在Vue中使用腾讯云COS(建议正式环境使用)

腾讯云COS-JavaScript API文档

获取临时密钥 官网SDK
临时秘钥请让后端人员进行给接口进行数据的获取

测试环境用的例子 <–请点击

<script>
const COS = require('cos-js-sdk-v5');

export default {
methods: {

demoFunc(){
      let that = this;
      let t = 'api返回的数据';
      let cosf = new COS({
        SecretId: t.tmp_secretId,
        SecretKey: t.tmp_secretKey,
        SecurityToken: t.session_token
      });

      cosf.uploadFile({
        Bucket: t.Bucket, /* 填入您自己的存储桶，必须字段 */
        Region: t.Region,  /* 存储桶所在地域，例如ap-beijing，必须字段 */
        Key: '路径/' + e.file.name, /* 存储在桶里的对象键（例如1.jpg，a/b/test.txt），必须字段 */
        Body: e.file,               /* 必须 */
        SliceSize: 1024 * 1024 * tong.size,     /* 触发分块上传的阈值，超过5MB使用分块上传，非必须 */
        // onTaskReady: function(taskId) {                   /* 非必须 */
        //   console.log('onTaskReady ---->',taskId);
        // },
        // onProgress: function (progressData) {           /* 非必须 */
        //   console.log('onProgress ---->',JSON.stringify(progressData));
        // },
        onFileFinish: function (err, data, options) {   /* 非必须 */
          cosf.getObjectUrl({
            Bucket: t.Bucket, /* 填入您自己的存储桶，必须字段 */
            Region: t.Region,  /* 存储桶所在地域，例如ap-beijing，必须字段 */
            Key: '路径/' + e.file.name,  /* 存储在桶里的对象键（例如1.jpg，a/b/test.txt），必须字段 */
            Sign: false
          }, function (err, data) {
            console.log(data.Url)
            e.file.status = 'done'
            e.onProgress({percent:100})
            e.onSuccess()
          })
        },
      }, function(err, data) {
        // console.log('function ---->',err || data);
      });
}

}
</script>