上傳文件時出錯，以紅石服務器

讀取文件

dom.InputElement uploadInput = dom.querySelector('#upload'); 

    uploadInput.onChange.listen((dom.Event e) 
    { 
     // read file content as dataURL 
     final files = uploadInput.files; 

     if (files.length == 1) 
     { 
      final file = files[0]; 
      final reader = new dom.FileReader(); 

      reader.onLoad.listen((_) 
      { 
       dataRequest('upload', reader.result); 
      }); 

      reader.readAsDataUrl (file); 
     } 
    });

將文件發送

Future<dom.HttpRequest> dataRequest (String path, dynamic data) 
    { 
     return dom.HttpRequest.request (path, method: "POST", 
       sendData: data); 
    }

但我得到這個錯誤

POST http://localhost:9090/upload 400 (Bad Request) :9090/upload:1 
Instance of '_XMLHttpRequestProgressEvent' 

STACKTRACE: 
null

我收到它在紅石這樣

@app.Route("/upload", methods: const [app.POST], allowMultipartRequest: true) 
@Encode() 
upload(@app.Body(app.FORM) Map form) 
{ 
    var file = form["file"]; 
    print(file.filename); 
    print(file.contentType); 
    print(file.runtimeType); 

    return new Resp() 
     ..success = (file.filename != null); 
}

任何想法？

來源

2015-01-15 Cristian Garcia

貌似的http://stackoverflow.com/questions/13298140 – 2015-01-15 19:02:22

重複我有我的設置從那裏的一部分，固定的幾件事情，因爲鏢，因爲這個問題的答案已經改變，但問題是這個錯誤。 – 2015-01-15 19:18:48

你如何處理服務器上的請求？也許你可以在那裏瞭解更多關於事業的細節。 – 2015-01-15 19:22:58

飛鏢：1.9.1
紅石：0.5.21

比方說，你有以下的html：

<!DOCTYPE html> 

<html> 
    <head> 
    <title>send_file.html</title> 
    </head> 

    <body> 
    <form id="read"> 
     user: <input type="text" name='user' value='DefaultValue'> 
     <input type="file" id="file" name="my_file"/> <br> 

     <input type="button" id="whole_btn" value="Send whole form!"> &nbsp;&nbsp;&nbsp; 
     <input type="button" id="specific_btn" value="Send specific values!"> 
    </form> 

    <script type="application/dart" src="send_file.dart"></script> 
    </body> 
</html>

紅石服務器文件：

import 'dart:io'; 
import 'package:logging/logging.dart'; 
import 'package:redstone/server.dart' as app; 
import 'package:shelf_static/shelf_static.dart'; 

@app.ErrorHandler(HttpStatus.NOT_FOUND) 
handleNotFoundError() => app.redirect("not_found.html"); 

@app.Route('/post',methods: const [app.POST], allowMultipartRequest: true) 
wholeFormPost(@app.Body(app.FORM) Map form) { 
    var user = form['user']; 
    var f = form['my_file']; 
    print('user: $user \n file: \n ${f.content}'); 
} 

@app.Route('/post1',methods: const [app.POST], allowMultipartRequest: true) 
specificPost(@app.Body(app.FORM) Map form) { 
    var specificField = form['specificField']; 
    var f = form['my_file']; 
    print('specificField: $specificField \n file: \n ${f.content}'); 
} 

@app.Interceptor(r'/.*') 
interceptor1() { 
    if (app.request.method == 'OPTIONS') { 
    app.response = app.response.change(headers: CORS); 
    app.chain.interrupt(); 
    } else { 
    app.chain.next(() { 
     return app.response = app.response.change(headers: CORS); 
    }); 
    } 
} 

Map CORS = { 
    "Access-Control-Allow-Origin" : "*, ", 
    "Access-Control-Allow-Methods": "POST, GET, OPTIONS", 
    "Access-Control-Allow-Headers": "Origin, X-Requested-With, Content-Type, Accept, Content-Disposition" 
}; 

main() { 
    app.setShelfHandler(createStaticHandler("/home/raz2/dartProjects_linux_1/PR5/cl2/lib", 
              defaultDocument: 'send_file.html', 
              serveFilesOutsidePath: true)); 

    app.setupConsoleLog(Level.ALL); 
    app.start(address: "0.0.0.0", port: 8081); 
}

客戶端dart文件：send_file.dart

import 'dart:html'; 

class UploadFileEx { 
    FormElement _readForm; 
    InputElement _fileInput; 
    File file; 
    ButtonElement _wholeBtn; 
    ButtonElement _specificBtn; 

    UploadFileEx() { 
    _readForm = document.querySelector('#read'); 
    _fileInput = 
     document.querySelector('#file') 
     ..onChange.listen(_onFileInputChange); 

    _wholeBtn = 
     document.querySelector('#whole_btn') 
     ..onClick.listen((sendForm)); 

    _specificBtn = 
     document.querySelector('#specific_btn') 
     ..onClick.listen((sendFileAndField)); 
    } 

    _onFileInputChange(_) { 
    file = _fileInput.files[0]; 
    } 

    // Send the whole form 
    void sendForm(_) { 
    if(file == null) 
     return; 

    FormData fd = new FormData(_readForm); 

    HttpRequest req = new HttpRequest(); 
    req.open("POST", 'http://127.0.0.1:8081/post'); 
    req.send(fd); 
    } 

    // add my own field to FormData 
    void sendFileAndField(_) { 
    if(file == null) 
     return; 

    FormData fd = new FormData(); 
    fd.append('specificField', 'Lalala'); 
    fd.appendBlob('my_file', file); 

    HttpRequest req = new HttpRequest(); 
    req.open("POST",'http://127.0.0.1:8081/post1'); 
    req.send(fd); 
    } 

} 

void main() { 
    new UploadFileEx(); 
}

應該工作。看看這個鏈接獲取更多信息：Sending_forms_through_JavaScript

來源

2015-04-15 14:28:21 Raizul

上傳文件時出錯，以紅石服務器

回答

相關問題