Question

我在SpringBoot中编写的REST API具有以下上传照片的方法。

@RequestMapping(method = RequestMethod.POST, value = "/save-photo")
public ResponseEntity<?> uploadPhoto(@RequestPart("file") MultipartFile file){

    if (file.isEmpty()) {
        System.out.println("Attached file is empty");
        ErrorResponse errorResponse = new ErrorResponse();
        errorResponse.setMessage("Attached file is empty");
        return new ResponseEntity<ErrorResponse>(errorResponse, HttpStatus.INTERNAL_SERVER_ERROR);
    }
    String returnPath = null;
    try {
        byte[] bytes = file.getBytes();
        String saveDate = new SimpleDateFormat("yyMMddHHmmssSSS").format(new Date());
        Path path = Paths.get(UPLOAD_FOLDER + saveDate + "___"  + file.getOriginalFilename());
        Files.write(path, bytes); 
        returnPath = String.valueOf(path);
    } catch (IOException e) {
        //e.printStackTrace();
        ErrorResponse errorResponse = new ErrorResponse();
        errorResponse.setMessage(e.getMessage());
        return new ResponseEntity<ErrorResponse> (errorResponse, HttpStatus.INTERNAL_SERVER_ERROR);
    }
    System.out.println("Before returning, return path = "+returnPath);
    return new ResponseEntity<String>(returnPath, HttpStatus.OK);
}

以下是我编写的用于调用上述方法的代码。

savePhoto(photoToSave: File) {

    let formData: FormData = new FormData();
    formData.append("file", photoToSave);

    let savedPath = this._http
        .post(this._endpointUrl + "/save-photo", formData)
        .map(
        res => {
            return res.json();
        }
        )
        .catch(handleError);

    return savedPath;

}

文件上传过程很好。但是Angular2给了我以下错误。

位置0的JSON中出现意外的标记F

请注意，F是服务器返回的路径的起始字母。

为什么会这样？我认为服务器响应不是JSON。但为什么？通常，RestControllers返回JSON。我服务器中的所有其他控制器方法都正常。如何解决这个问题？

从浏览器控制台捕获的响应

部首：

Access-Control-Allow-Credentials:true
Access-Control-Allow-Origin:http://localhost:3000
Content-Length:88
Content-Type:application/json;charset=UTF-8
Date:Fri, 26 May 2017 04:33:05 GMT
Vary:Origin

响应：

F:\Work\Images\170526100305388___2.jpg

修改

来自brwoser的截屏

响应：

Answer 1

作为答案发布我曾经解决过的问题的解决方法。希望它可以帮到某个人。

我所做的不是返回String ResponseEntity，而是创建了一个JSON对象，它封装了我想要返回的字符串并作为响应返回。

JSONObject obj = new JSONObject();
obj.put("savedPath", returnPath);

return new ResponseEntity<>(obj, HttpStatus.OK);

在前端，我只返回response.json()

let savedPath = this._http
    .post(this._endpointUrl + "tender/save-new/save-photo", formData)
    .map(
    res => {
        return res.json();
    }
    )
    .catch(handleError);

现在在控制器类中，我可以通过以下方式访问保存的路径。

this._tendersService.savePhoto(files[0])
    .subscribe(res => {
        console.log("saved path = " + res.savedPath);
    }

    );

位于0的JSON中的意外标记 - Angular2 - Spring API

1 个答案: