钉钉小程序、文件上传(excel、ppt、word等)

钉钉小程序上传下载(反显)文件(如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)
      })
    })
  },

希望这篇文章对你有帮助!

  • 4
    点赞
  • 5
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
⼩程序下载⽂件并预览 需求分析 最近优化了个原先写过的需求,回头复习复习⼩程序的 API 是这样的,我需要下载⼀个⽂件并打开此⽂件 优化:记录是否被下载过,如果下载过就直接打开 获取⽂件下载链接,打开⽂件 wx.downloadFile({ url: `${pic.meetingUrl}/weixin/noticeStart/downLoad/${this.selectItem.recordId}`, // 下载资源的 url success: (res) => { wx.openDocument({ filePath: res.tempFilePath, // ⽂件路径,可通过 downloadFile 获得, fileType: 'pdf', // 写下载后的⽂件的格式,这⾥距离是pdf success: (res) => { }, fail: (error) => { }, }); }, fail: () => {}, complete: () => {}, }); 优化 思路:保存下载后的⽂件,保存其路径到本地缓存,然后下次打开的时候判断⼀下本地缓存⾥是否有,如果有就打开,本地缓存没有的话, 就先下载在打开。 const that = this; const cacheFilePath = wx.getStorageSync( `filePath-${this.selectItem.recordId}` ); // 先判断这个⽂件是否下载过 // 如果下载过,尝试通过缓存,打开⽂件 // 否则就要下载下载成功后保存本地缓存(临时路径信息),命名规则为 filePath + recordId if (cacheFilePath) { wx.openDocument({ filePath: cacheFilePath, //⽂件路径,可通过 downFile 获得, fileType: this.selectItem.fileType, // 获取⽂件格式 success: (res) => { }, fail: (error) => { }, }); } else { wx.showLoading({ title: "下载中", mask: true, }); wx.downloadFile({ url: `${pic.meetingUrl}/weixin/noticeStart/downLoad/${this.selectItem.recordId}`, // 下载资源的 url success: (res) => { // 隐藏 loading wx.hideLoading(); // 下载成功后,保存⽂件路径到本地缓存 wx.setStorageSync( `filePath-${this.selectItem.recordId}`, `${res.tempFilePath}` ); // 尝试打开下载后的⽂件 wx.openDocument({ filePath: res.tempFilePath, //⽂件路径,可通过 downFile 获得, fileType: this.selectItem.fileType, // 获取⽂件格式 success: (res) => { }, fail: (error) => { }, }); }, fail: () => {}, complete: () => {}, }); }

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值