当前位置: 首页 > Web前端 > JavaScript

vue3+腾讯云上传文件

时间:2023-03-27 13:31:09 JavaScript

1.引入腾讯云npmicos-js-sdk-v5--save2。调用后台接口获取上传所需的授权信息//获取上传授权信息getUploadAuth(){letself=this;API.authInfo().then(res=>{self.uploadSign=res.data;})}上传文件//点击上传文件clickUpload(){letself=this;self.$refs.upload.submit();//取消自动上传功能需要调用el-uplaod的submit();self.$message.success('正在上传文件,请稍候');letcos=newCOS({//创建COS实例getAuthorization(options,callback){callback({TmpSecretId:self.uploadSign.Credentials.TmpSecretId,//请求接口返回的数据TmpSecretKey:self.uploadSign.Credentials.TmpSecretKey,//请求接口返回的数据SecurityToken:self.uploadSign.Credentials.Token,//请求接口返回的数据ExpiredTime:self.uploadSign.ExpiredTime//请求接口返回的数据});}});cos.putObject({Bucket:'',//例如examplebucket-1-1250000000Region:'',//RegionKey:fileName,//上传的文件名StorageClass:'STANDARD',Body:fileContent,//上传fileobject},function(err,data){//err上传失败//数据上传成功//data.Location为上传成功后的地址,如果要渲染页面,需要加上前缀'http://'或'https://'})}