用ng上传图片
我使用ng-file-upload来尝试将图像上传到spring boot rest api。 到目前为止，我一直无法得到它的工作。
我的方法是映射一个包含图像的对象，在前端创建对象并将该对象发布到我的其余api并将该图像插入到数据库中。
每次我尝试这个时，都会在后端出现内部500错误消息
[org.springframework.http.converter.HttpMessageNotReadableException：无法读取文档：无法将START_OBJECT令牌的byte []实例反序列化
我正在假设图像可以存储为Byte []，并且从Angular传递到Spring将类似于传递字符串。
在我的服务器端，我创建了一个对象Image
public class Image implements Serializable {
private byte[] profilePic;
private String user_id;
private String profilePicContentType;
//getter & setter methods below
}
我的休息服务是
@RequestMapping(value = "/images",
method = RequestMethod.POST,
produces = MediaType.APPLICATION_JSON_VALUE)
@Timed
public ResponseEntity<Image> createImage(@RequestBody Image image) throws URISyntaxException {
log.debug("REST request to save Image : {}", image);
if (image.getId() != null) {
return ResponseEntity.badRequest().headers(HeaderUtil.createFailureAlert("image", "idexists", "A new image cannot already have an ID")).body(null);
}
Image result = imageService.save(image);
return ResponseEntity.created(new URI("/api/images/" + result.getId()))
.headers(HeaderUtil.createEntityCreationAlert("image", result.getId().toString()))
.body(result);
}
在我的前端，我使用基本的演示ng-file-upload代码来选择图像
<div class="btn btn-primary" ngf-select ng-model="vm.settingsAccount.profilePic" name="file" ngf-pattern="'image/*'"
ngf-accept="'image/*'" ngf-max-size="16MB" ngf-min-height="100"
ngf-resize="{width: 100, height: 100}">Select</div>
我的角度控制器从窗体中获取内容并构建一个obeject并将其传递给调用我的rest api的资源控制器
var imageDomain = function (settingsAccount){
return {
profilePic: settingsAccount.profilePic,
user_id : settingsAccount.login,
profile_pic_content_type : 'UTF-8'
}
}
function save(){
vm.image = imageDomain(vm.settingsAccount);
ImageService.update(vm.image);
}
任何帮助或建议都会很棒。
谢谢。
编辑：玩过后，我有一些工作，这是一个妥协，并没有像我希望的优雅，但至少它会让我继续我的POC。
我放弃尝试使用角度资源来执行REST API并使用ng-file-upload指令中概述的Upload函数。
Upload.upload({
url: 'api/fileUpload',
data: {file: vm.settingsAccount.profilePic}
})
而在服务器端，而不是使用@RequestBody我切换到使用@RequestParam
@RequestMapping(value = "/fileUpload",
method = RequestMethod.POST,
produces = MediaType.APPLICATION_JSON_VALUE)
@Timed
public String uploadImage(@RequestParam(value = "file") final MultipartFile image) throws URISyntaxException, IOException {
log.debug("REST request to save Image : {}", image );
//Convert to byte[] so can insert into MongoDB
byte[] bytes = image.getBytes();
//Insert to DB code below
}
我希望这可以帮助别人。
链接地址: http://www.djcxy.com/p/48777.html上一篇: Upload image with ng