JSON中位置0的意外令牌 - Angular2 - Spring API

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

编辑

来自浏览器的屏幕截图

回复：

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);
    }

    );