接口说明

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代码:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
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);
}

注意事项:

  1. var url = "http://upload.qiniu.com/putb64/20264"; 这里的20264是你的图片的没经过base64处理的原图的字节大小。

  2. xhr.setRequestHeader("Authorization", "UpToken 填写你从服务端获取的上传token"); 这里的UpToken与后面的字符串保留一个空格。后面跟上你在服务端请求的token的字符串。具体你通过什么样子的请求方式获得是客户自己要关心的事情。

  3. 获取文件大小的时候,切记要通过文件流的方式获取。而不是通过图片标签然后转换后获取。

  4. 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=

如何上传base64编码图片到七牛云的更多相关文章

  1. 前端上传 base64 编码图片到七牛云存储

    参考文档 如何上传base64编码图片到七牛云 调试过程 文档中分别有 java 和 html 的 demo,可以根据文档示例调试. 下面是我调试的过程,可以作为参考,特别注意的是,如果需要给文件起名 ...

  2. 接口上传base64编码图片

    package com.*.util; import java.io.FileInputStream; import java.io.FileOutputStream; import java.io. ...

  3. php上传文件与图片到七牛的实例详解

    上传文件到七牛最简单的方式就是使用七牛官方最新的SDK 用composer安装PHP SDK composer require qiniu/php-sdk 上传文件到七牛 use Qiniu\Auth ...

  4. 潭州课堂25班:Ph201805201 django 项目 第三十九课 后台 文章发布,图片上传到 FastDFS后端实现 七牛云讲解(课堂笔记)

    文章发布: # 1,从前台获取参数# 2,校验参数# 3,把数据保存到数据库# 4,返回执行结果到前台,(创建成功或失败) 自定义 froms.py 校验参数 上传图片到七牛云 注册 https:// ...

  5. Ant Design Upload 组件上传文件到云服务器 - 七牛云、腾讯云和阿里云的分别实现

    在前端项目中经常遇到上传文件的需求,ant design 作为 react 的前端框架,提供的 upload 组件为上传文件提供了很大的方便,官方提供的各种形式的上传基本上可以覆盖大多数的场景,但是对 ...

  6. 移动端图片上传base64编码

    $base64 = "/9j/4AAQSkZJRgABAQEAkACQAAD/4QCMRXhpZgAATU0AKgAAAAgABQESAAMAAAABAAEAAAEaAAUAAAABAAAA ...

  7. 小程序上传base64的图片,可上传多张

    微信小程序上传图片转化为base64格式 clickimage: function(e) { var index = e.currentTarget.dataset.index; var count ...

  8. 上传base64图片到七牛云前端遇到的坑

    介意前端普通引入七牛云SDk上传图片到七牛云需要多个js,所以才有了base64的上传方式,简化操作,(懒.) 七牛云官方文档如下 https://developer.qiniu.com/kodo/k ...

  9. 上传base64格式的图片到服务器

    上传base64格式的图片到服务器 /**bash64上传图片 * @param $base64 图片的base64数据 * @param $path 保存路径 */ function base64_ ...

随机推荐

  1. Webpack 从0开始

    Webpack Demos https://github.com/ruanyf/webpack-demos Docs https://webpack.github.io/docs/?utm_sourc ...

  2. 解密电子书之四:MCU(freescale)

    谈完国产的君正,让我们再看看呛了君正财路的freescale iMX51. 这是freescale近期的主打产品,用的是ARM Cortex A8架构,主频在消费电子领域最高可达800MHz,在工业领 ...

  3. chrome调试ajax

    network可以查看ajax的信息.非常的实用.

  4. Spring mvc 简单异常配置jsp页面

    原文出处:http://howtodoinjava.com/spring/spring-mvc/spring-mvc-simplemappingexceptionresolver-example/ 这 ...

  5. php使用check box

    if (isset($_POST['submit'])) { foreach ($_POST['todelete'] as $delete_id) { //这里是循环遍历这个数组 todelete 每 ...

  6. hdu--1800--字典树&&其他

    题目连接:http://acm.hdu.edu.cn/showproblem.php?pid=1800 根据题意可知:意思是有若干个飞行员,需要在扫帚上练习飞行,每个飞行员具有不同的等级,且等级高的飞 ...

  7. C++_bool

    1 0 #include <iostream> using namespace std; void main() { && || || - && ; std ...

  8. 修改ubuntu的默认python版本

    ubuntu14.04LTS上装有两个版本的python:python2.7.6与python3.4,默认使用python2.7.6. 可以使用以下命令来修改默认python版本: sudo cp / ...

  9. Gridland(规律)

    Gridland Time Limit: 2 Seconds      Memory Limit: 65536 KB BackgroundFor years, computer scientists ...

  10. Joseph(约瑟夫环)

    Joseph Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Others)Total Subm ...