10

AngularJS で POST リクエストを送信するにはどうすればよいですか? JSON 部分は必須ですが、ファイルは必要ありません。他のブログ投稿に基づいてこれを試しましたが、うまくいきません。Bad request 400 エラーが発生します。

正解者には200ポイントが加算されます

var test = {
  description:"Test",
  status: "REJECTED"
};

var fd = new FormData();
fd.append('data', angular.toJson(test));

return $http.post('/servers', fd, {
  transformRequest: angular.identity,
  headers: {
    'Content-Type': undefined
  }
});
4

2 に答える 2

16

シンプルな Spring バックエンドでコードをテストしましたが、問題なく動作します。

@Controller
public class FileController {

  @ResponseBody
  @RequestMapping(value = "/data/fileupload", method = RequestMethod.POST)
  public String postFile(@RequestParam(value="file", required=false) MultipartFile file,
                       @RequestParam(value="data") Object data) throws Exception {
    System.out.println("data = " + data);

    return "OK!";
  }
}

angular v1.1.5でクライアント側のコードを使用しました：

var test = {
  description:"Test",
  status: "REJECTED"
};

var fd = new FormData();
fd.append('data', angular.toJson(test));

//remove comment to append a file to the request
//var oBlob = new Blob(['test'], { type: "text/plain"});
//fd.append("file", oBlob,'test.txt');

return $http.post('/data/fileupload', fd, {
  transformRequest: angular.identity,
  headers: {
    'Content-Type': undefined
  }
});

リクエストは次のようになります (Chrome コンソールの [ネットワーク] タブからコピー):

Request URL:http://localhost:8080/data/fileupload
Request Method:POST
Status Code:200 OK

Request Headers
POST /data/fileupload HTTP/1.1
Host: localhost:8080
...
Content-Type: multipart/form-data; boundary=----WebKitFormBoundaryEGiRWBFzWY6xwelb
Referer: http://localhost:8080/
...
Request Payload
------WebKitFormBoundaryEGiRWBFzWY6xwelb
Content-Disposition: form-data; name="data"

{"description":"Test","status":"REJECTED"}
------WebKitFormBoundaryEGiRWBFzWY6xwelb--

応答 200 OK が返され、コンソールは期待どおりの結果を出力します。{"description":"Test","status":"REJECTED"}

于 2013-08-16T14:39:50.853 に答える
-3

JSON コンテンツを POST データに直接投稿できます。

$http.post(URI, JSON.stringify(test));

API 仕様によっては、コンテンツ タイプを追加する必要がある場合があります。

$http.post(URI, JSON.stringify(test), {headers: {'Content-Type': 'application/json'}});
于 2013-08-13T07:49:50.067 に答える