vue 七牛云视频表单上传（js）

置顶学无止境---活到老，学到老

已于 2022-08-08 11:35:54 修改

阅读量566

点赞数

分类专栏：前端文章标签：七牛云视频表单上传

于 2019-09-21 16:07:34 首次发布

本文链接：https://blog.csdn.net/weixin_44382124/article/details/101109448

版权

前端专栏收录该内容

33 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1.0">
    <meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests">
    <script src="https://res.wx.qq.com/open/js/jweixin-1.4.0.js"></script>
    <!-- <script src="https://unpkg.com/qiniu-js@<version>/dist/qiniu.min.js"></script> -->
    <title>----</title>
  </head>
  <body>
      <form method="post" id="froms" enctype="multipart/form-data" submit="return saveReport()">
      <input name="key" type="hidden" value="<resource_key>" />
      <input name="x:<custom_name>" type="hidden" value="<custom_value>" />
      <input name="token" type="hidden" :value="uptoken" />
      <!-- <input name="crc32" type="hidden" /> -->
      <input name="accept" type="hidden" />
      <input name="file" id="uploader" type="file" @change="uploader($event)" />
      <!-- <input type="submit" @click="submits" value="上传文件" /> -->
   </form>
     </body>
     <script>
     methods:{
      uploader(event) {
      let file = event.target.files[0];
      const self = this;
      const flag = this.flag;
      if (file) {
        if (this.maxSize) {
          //todo filter file
        }
        //filter file, 文件大小,类型等过滤
        //如果是图片文件
        // const reader = new FileReader()
        // const imageUrl = reader.readAsDataURL(file)
        // img.src = imageUrl //在预览区域插入图片

        const formData = new FormData();
        formData.append("file", file);

        //获取token
        getdata("api/app/qiniuload/getToken").then(response => {
          console.log(response);
          const result = response.data.data;
          formData.append("token", result.token);
          // formData.append("key", result.key);
          //提交给七牛处理
          self.$http
            .post("http://up-z2.qiniup.com", formData, {emulateJSON:true})
            .then(
              response => {
                console.log(response);
              },
            );
        });
      }
    }

}
     </script>
</html>

学无止境---活到老，学到老

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
vue 七牛云视频表单上传（js）

<!DOCTYPE html><html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width,initial-scale=1.0"> <meta http-equiv="Content-Secu...
复制链接

扫一扫