如何上传base64编码图片到七牛云

news/2024/7/7 10:28:11

接口说明

POST /putb64/<Fsize>/key/<EncodedKey>/mimeType/<EncodedMimeType>/crc32/<Crc32>/x:user-var/<EncodedUserVarVal>
Host: upload.qiniu.com
Authorization: UpToken <UpToken>
Content-Type: application/octet-stream

<Base64EncodedFileContent>

<Fsize>: 文件大小，必选。
<EncodedKey>: 可选，如果没有指定则：如果 uptoken.SaveKey 存在则基于 SaveKey 生产 key，否则用 hash 值作 key。
<EncodedMimeType>: 文件的 MIME 类型。可选，默认是 application/octet-stream。
<Crc32>: 文件内容的 crc32 校验值。可选，不指定则不进行校验。
Host ：上传域名up.qiniu.com 用于服务端上传，upload.qiniu.com 用于客户端的上传

返回包：

200 OK {
  hash: <ETag>
}

通过javascript方式上传：

javascript代码：

       function 
       putb64(){
      
       var 
       pic = 
       "填写你的base64后的字符串"
       ;
      
       var 
       url = 
       "http://upload.qiniu.com/putb64/20264"
       ;
      
       var 
       xhr = 
       new 
       XMLHttpRequest();
      
       xhr.onreadystatechange=
       function
       (){
      
       if 
       (xhr.readyState==4){
      
       document.getElementById(
       "myDiv"
       ).innerHTML=xhr.responseText;
      
       }
      
       }
      
       xhr.open(
       "POST"
       , url, 
       true
       );
      
       xhr.setRequestHeader(
       "Content-Type"
       , 
       "application/octet-stream"
       );
      
       xhr.setRequestHeader(
       "Authorization"
       , 
       "UpToken  填写你从服务端获取的上传token"
       );
      
       xhr.send(pic);
      
       }

注意事项：

var url = "http://upload.qiniu.com/putb64/20264"; 这里的20264是你的图片的没经过base64处理的原图的字节大小。
xhr.setRequestHeader("Authorization", "UpToken 填写你从服务端获取的上传token"); 这里的UpToken与后面的字符串保留一个空格。后面跟上你在服务端请求的token的字符串。具体你通过什么样子的请求方式获得是客户自己要关心的事情。
获取文件大小的时候，切记要通过文件流的方式获取。而不是通过图片标签然后转换后获取。
var url = "http://upload.qiniu.com/putb64/20264"; 中可以扩展为以下方式：http://upload.qiniu.com/putb64/Fsize/key/EncodedKey/mimeType/EncodedMimeType/x:user-var/EncodedUserVarVal

Fsize: 文件大小，必选。支持传入 -1 表示文件大小以 http request body 为准。
EncodedKey: 可选，如果没有指定则：如果 uptoken.SaveKey 存在则基于 SaveKey 生产 key，否则用 hash 值作 key。 .
整个EncodedKey需要经过base64编码！！
如：

var key = uuid();
key = base64encode(key);
var url = 'http://upload.qiniu.com/putb64/-1/key/'+key

具体可以参照: http://developer.qiniu.com/docs/v6/api/overview/appendix.html#urlsafe-base64
EncodedMimeType: 文件的 MIME 类型。可选，默认是 application/octet-stream。
举例：上传后并指定自定义的key： http://upload.qiniu.com/putb64/12345/key/usxxeigng=