使用场景是想做图片裁剪,直接传oss
基本步骤:
1,图片裁剪,产生base64字符串,略
2,base64转blob
3,blob添加到表单
4,ajax上传
具体:
/** * 将以base64的图片url数据转换为Blob * @param urlData * 用url方式表示的base64图片数据 */ function convertBase64UrlToBlob(urlData){ var bytes=window.atob(urlData.split(',')[1]); //去掉url的头,并转换为byte //处理异常,将ascii码小于0的转换为大于0 var ab = new ArrayBuffer(bytes.length); var ia = new Uint8Array(ab); for (var i = 0; i < bytes.length; i++) { ia[i] = bytes.charCodeAt(i); } return new Blob( [ab] , {type : 'image/png'}); }
3添加到表单:
var formParam = new FormData(); formParam.append("file",convertBase64UrlToBlob(base64Codes));
4,ajax提交:
$.ajax({ type: 'POST', url: host , data:formParam , ...
OSS需要额外增加授权:具体参考官方例子
额外传这些参数:
formParam.append("key",g_object_name); formParam.append("policy",policyBase64); formParam.append("OSSAccessKeyId",accessid); formParam.append("success_action_status",'200'); formParam.append("signature",signature);