使用Qiniu-JavaScript-SDK上传文件至七牛云存储

一、Qiniu-JavaScript-SDK介绍

　　基于 JS-SDK 可以方便的从浏览器端上传文件至七牛云存储，并对上传成功后的图片进行丰富的数据处理操作。
　　JS-SDK 兼容支持 H5 File API 的浏览器，在低版本浏览器下，需要额外的插件如 plupload，JS-SDK 提供了一些接口可以结合插件来进行上传工作。

　　Qiniu-JavaScript-SDK 为客户端 SDK，没有包含 token 生成实现，为了安全，token 建议通过网络从服务端获取，具体生成代码可以参考服务端 SDK 的文档。

1、参考文档

　　官方API文档：JavaScript SDK

　　基于七牛 API 开发的前端 JavaScript SDK 源码地址：https://github.com/qiniu/js-sdk

2、引入（NPM安装）

　　NPM 的全称是 Node Package Manager，是一个 NodeJS 包管理和分发工具，已经成为了非官方的发布 Node 模块（包）的标准。

$ npm install qiniu-js

 

二、javascript项目实现　　

　　创建七牛上传组件：hsedu_mgr/src/components/chart/QiniuUpload.vue

　　下面代码中集成了上传进度条，及上传完成提示

 

2、在父组件中引入七牛上传组件

    for="qiniu" class="col-md-3 col-form-label">课件上传
    
      
    
  

 

　　使用props传递属性到子组件。这样可以拼接出比较复杂的文件名（key: 文件资源名）。

 

转载于:https://www.cnblogs.com/xiugeng/p/11356381.html