• 七牛云上传文件


    python配置

    from qiniu import Auth
    
    def Qiniu():
        #需要填写你的 Access Key 和 Secret Key
        access_key = ''
        secret_key = '-uNnvv4TxSXjm5_'
        #构建鉴权对象
        q = Auth(access_key, secret_key)
        #要上传的空间,自己七牛云的空间名称
        bucket_name = ''
        #3600为token过期时间,秒为单位。3600等于一小时
        token = q.upload_token(bucket_name, expires=3600)
        print(token)
        return token
    

    vue配置

    首先下载七牛云的JavaScript-SDK
    
    npm install qiniu-js
    <template>
      <div>
          <input type="file" name='upFile' id="upFile" @change='changeFile($event)'>
          <input type="button" name="开始上传" value="开始上传" @click='uploadFile()'>
          <img v-if="coverUrl" :src="coverUrl" alt="封面">
          <el-progress :percentage="filePercent"></el-progress>
          {{filePercent}}
      </div>
    </template>
    <script>
    import * as qiniu from "qiniu-js";
     
    export default {
      name:'qiniu',
      data() {
        return {
          file:null,
          videoUrl:null,
          coverUrl:null,
          filePercent:0
        };
      },
      methods: {
        changeFile(e){
        //   获取文件
          this.file = e.target.files[0];
        },
        uploadFile() {
        // 当前VUE中的this 是指向实例,相当于父级,指向指不到子级中。所需需要一个变量 _this 存储this得指向。
          let _this = this
        // 获取身份的token
          let token = '6iHLwjADA4xPDG9Wl5FdJFkdU_mcaE5YrgDyoFHa:xT_22Uqm24-ZLGRFvk74Z7F-Xrw=:eyJzY29wZSI6ImppeXVuZWR1IiwiZGVhZGxpbmUiOjE2MDMzNTI0OTh9'
        // 上传时的配置
          var config = {
            useCdnDomain: true
          };
        //  设置文件的配置
          var putExtra = {
            fname: "",
            params: {},
            mimeType: null
          };
    
        //   实例化七牛云的上传实例
          var observable = qiniu.upload(_this.file, null, token, putExtra, config);
        //   设置实例的监听对象
          var observer = {
            //   接收上传进度信息
            next(res) {
                // 上传进度
                _this.filePercent = parseInt(res.total.percent) 
                if(_this.filePercent==100){
                    console.log("success")
                } 
            },
            // 接收上传错误信息
            error(err) {
              console.log(err)
            },
    
            // 接收上传完成后的信息
            complete(res) {
                 console.log(res.key)
            }
          };
          // 上传开始
          var subscription = observable.subscribe(observer); 
        }
        
      }
    };
    </script>
    
  • 相关阅读:
    初识python 2.x与3.x 区别
    装饰器
    函数的进阶
    Spring Boot启动问题:Cannot determine embedded database driver class for database type NONE
    22.Spring Cloud Config安全保护
    23.Spring Cloud Bus 无法更新问题(踩坑) Spring cloud config server Could not fetch remote for master remote
    24.Spring Cloud之Spring Cloud Config及Spring Cloud Bus
    Spring Boot整合Spring Data Elasticsearch 踩坑
    项目中Spring Security 整合Spring Session实现记住我功能
    32.再谈SpringBoot文件上传
  • 原文地址:https://www.cnblogs.com/dongjiaxing/p/13951959.html
Copyright © 2020-2023  润新知