微信小程序云开发-云存储-上传、下载、打开文件文件(word/excel/ppt/pdf)一步到位

一、wxml文件

<!-- 上传、下载、打开文件一步执行 -->
<view class="handle">
<button bindtap="handleFile" type="primary">上传下载打开文件</button>
<text>实现文件的上传、下载、打开一步到位</text>
</view>

二、wxss文件

.handle{
margin: 200rpx 20rpx 0 20rpx;
text-align: center;
}

三、js文件

Page({
data:{
fileID :null
}, //功能:上传、下载、打开文件一气呵成
handleFile(){
//选择文件
let that = this
wx.chooseMessageFile({
count: 1,
type: 'all',
success (res) {
// tempFilePath可以作为img标签的src属性显示图片
const tempFilePaths = res.tempFiles
let tempFile = tempFilePaths[0]
that.uploadFile(tempFile.name,tempFile.path)
}
})
},
//上传文件
uploadFile(fileName,tempFile){
wx.cloud.uploadFile({
cloudPath:fileName,
filePath:tempFile,
})
.then(res=>{
console.log("文件上传成功",res);
//下载文件
wx.cloud.downloadFile({
fileID: res.fileID,
success: res => {
console.log("文件下载成功",res);
//打开文件
const filePath = res.tempFilePath
wx.openDocument({
filePath: filePath,
success: function (res) {
console.log('文件打开成功',res)
}
})
}
}) })
.catch(err=>{
console.log("文件上传失败",err);
}) }
})

四、实现效果

微信小程序云开发-云存储-上传、下载、打开文件文件(word/excel/ppt/pdf)一步到位

上一篇:使用Visual Studio创建简单的自己定义Web Part 部件属性


下一篇:uedit修改文件上传路劲,支持api文件接口