钉钉小程序上传下载(反显)文件(如excel ppt world等文件)前端处理(需要后端配合加上传下载的权限)
要上传excel ppt world等文件还需要借助钉盘实现,我就不废话了,直接上代码
axml结构,红框中的为钉盘文件上传和预览
其余的是兼容图片上传和PC端上传的文件,这里提一嘴,如果是PC端上传到自己服务器的文件要想在小程序里显示,需要后端把服务器的文件先传到钉盘,前端再通过钉盘下载,如果是小程序里的文件要在PC端系统显示,需要后端先从钉盘上传到自己的服务器,前端再从自己的服务器下载(PC端指的是其它web系统)
整体思路:
第一步:获取上传的权限(需要后端实现),前端只调后端的接口
第二步:获取钉盘的spaceId (需要后端实现),前端只调后端的接口
第三步:
文件上传,调用文档里的dd.uploadAttachmentToDingTalk方法
文件预览(下载),调用文档里的dd.previewFileInDingTalk方法
如果需要反显,上传文件后需要把返回的结果存在数据库里(需要后端配合实现),然后从后端服务器取出结果,最后通过dd.previewFileInDingTalk进行预览
以下为完整代码
js部分
// 授权钉钉上传和下载权限 type为add 上传权限,download为下载权限,和后端定义好参数就行
async getDingPanAuth(type = 'download', fileids = '') {
const { code } = await request.post('/kds-serve/dmsg/grant_custom_space', {
type,
fileids, // 下载授权需要
"domain":"999",
"userId": dd.getStorageSync({ key: 'currentId' }).data
})
if (code === 200) {
return true
} else {
return false
}
},
// 获取钉盘spaceId domain是后端定义的钉盘空间域
async getDingdSpaceId() {
const { result, code } = await request.post('/kds-serve/dmsg/get_custom_space', {
"domain":"999"
})
if (code === 200) {
return result
}
},
// 上传文件到钉盘
async onUploadWps(e) {
const flag = await this.getDingPanAuth('add') // 上传授权
if (flag) {
const spaceId = await this.getDingdSpaceId()
dd.uploadAttachmentToDingTalk({
space: { max: 9, corpId: '您企业的corpId', isCopy: 1, spaceId },
file: { max: 9, spaceId },
types: ['space'],
success: (res) => {
this.setData({ dingDingFileList: [...this.data.dingDingFileList, ...res.data] })
},
fail: (err) => {
dd.alert({
content:JSON.stringify(err)
})
},
})
} else {
dd.alert({ content: '请联系管理员授权' })
}
},
// 预览(下载)钉盘文件(反显也调这个方法, fileId, fileName, fileSize, fileType是上传后存的参数)
async handlePreviewFile(e) {
const { attr } = e.target.dataset
const { fileId, fileName, fileSize, fileType } = attr
const flag = await this.getDingPanAuth('download', fileId) // 下载授权
const spaceId = await this.getDingdSpaceId() // 获取spaceId
if (flag) {
dd.previewFileInDingTalk({
corpId:"您企业的corpId",
spaceId,
fileId,
fileName,
fileSize,
fileType,
})
} else {
dd.alert({ content: '请联系管理员授权' })
}
},
// 保存钉盘文件,这里是以JSON字符串存储的,与后端定义好就行
saveDingPanFile(_taskNum) {
return new Promise((resole, reject) => {
request.post('/kds-serve/file/upload_dingpan_files', {
taskNum: _taskNum,
fileUrl: JSON.stringify(this.data.dingDingFileList)
}).then(res => {
resole(res)
}).catch(error => {
reject(error)
})
})
},
希望这篇文章对你有帮助!