![](/img/trans.png)
[英]Uploading a base64 image from react-webcam to cloudinary via Node
[英]Cloudinary Base64 Image uploading in angularjs
$http({method: 'POST',
url: $rootScope.CLOUDINARY_CONFIG.upload_url,
data : {
file : canvasImage,
resource_type : 'image',
format: "jpg",
timestamp : 1375363550,
api_key : $rootScope.CLOUDINARY_CONFIG.api_key,
signature : signature,
public_id : scope.model.public_id
},
headers : {"X-Requested-With": "XMLHttpRequest", "Content-Type" : "multipart/formData"}
}).success(function(data, status, headers, config) {
console.log("success");
}).error(function(data, status, headers, config) {
console.log("fail");
});
我正在尝试将base64图像上传到cloudinary帐户。 我已经检查过签名,api密钥,上传url和canvasImage是否正确。 然而,无论何时发送请求,
我收到错误回复:
{"error":{"message":"Missing required parameter - file"}}
在检查请求有效负载时,我可以看到正在传递的文件参数。
canvasImage是base64 jpg。 排序 - 数据:image / jpeg; base64,/ 9j / 4AAQSkZJRgABA。
在cloudinary文档中找不到任何此类内容。
首先,查看FormData对象。 如果您要上传多部分表单数据,则需要使用它。
基本上,FormData对象允许你使用它所拥有的唯一函数附加文件,blob和字符串(如果你附加不属于那三个的东西,它会将其字符串化),追加即:
var newForm = new FormData();
newForm.append('fileName', file);
newForm.append('api_key', $rootScope.CLOUDINARY_CONFIG.api_key);
newForm.append('signature', signature);
newForm.append(public_id, scope.model.public_id);
等等..
下一个。
将内容类型设置为undefined而不是多部分表单数据。 这似乎不直观,但是,发生的情况是浏览器会自动为您设置适当的边界,并自动将内容类型设置回multipart / formdata。
另外,将transformRequest添加到angular.identity的配置集。 浏览器将尝试序列化表单数据,因此您需要通过将transformRequest设置为angular.identity来阻止它。
整个$ http请求应如下所示:
$http.post(url, newForm, {
transformRequest: angular.identity,
headers: {'Content-Type': undefined}
})
.success(function(data){
// success
})
.error(function(err){
// log error
})
还要注意FormData很难处理你,因为如果你控制你的FormData对象,即(console.log(newForm))它将显示的全部是:FormData {append:function}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.