下载安卓APP箭头
箭头给我发消息

客服QQ:3315713922

web前端:微信小程序实现pdf,word等格式文件上传

作者:海中灯塔     来源: https://www.cnblogs.com/haizhongdenta/p/11496316.html点击数:2406发布时间: 2020-03-04 19:36:39

标签: 微信小程序IT行业

Web开发

  小程序也是这么多年来中国IT行业里一个真正能够影响到普通程序员的创新成果,现在已经有超过150万的开发者加入到了小程序的开发,与我们一起共同发力推动小程序的发展,小程序应用数量超过了一百万,覆盖200多个细分的行业,日活用户达到两个亿,小程序还在许多城市实现了支持地铁、公交服务。小程序发展带来更多的就业机会,2017年小程序带动就业104万人,社会效应不断提升。

  目前微信只支持从聊天记录里面获取文件

  一.前言#

  目前微信提供了一个接口wx.chooseMessageFile它能让用户从聊天记录里面选择一个或者多个文件,然后返回它的一些信息,列入文件的path地址,文件名,文件的大小等.

  获取这些信息再结合微信的上传接口wx.uploadFile,即可实现文件上传.

  二.具体实现#

  首先需要一个按钮来调用wx.chooseMessageFile.

  wx.chooseMessageFile({

  count:1,//能选择文件的数量

  type:'file',//能选择文件的类型,我这里只允许上传文件.还有视频,图片,或者都可以

  success(res){

  varsize=res.tempFiles[0].size;

  varfilename=res.tempFiles[0].filename;

  varnewfilename=filename+"";

  if(size>4194304||newfilename.indexOf(".pdf")==-1){//我还限制了文件的大小和具体文件类型

  wx.showToast({

  title:'文件大小不能超过4MB,格式必须为pdf!',

  icon:"none",

  duration:2000,

  mask:true

  })

  }else{

  that.setData({

  path:res.tempFiles[0].path,//将文件的路径保存在页面的变量上,方便wx.uploadFile调用

  filename:filename//渲染到wXML方便用户知道自己选择了什么文件

  })

  }

  }

  })

  这样在这里就保存了文件的路径和名称

  data:{

  path:'',

  filename:''

  },

  然后等用户进行提交的时候,再调用上传的接口

  wx.uploadFile({

  url:serverUrl//上传的路径

  filePath:that.data.path,//刚刚在data保存的文件路径

  name:'file',//后台获取的凭据

  success(){

  wx.showToast({//做个提示或者别的操作

  title:'',

  icon:"none",

  duration:5000,

  mask:true,

  success:function(res){

  }

  })

  }

  })

  这样前段就完成实现了

  后台获取的文件是一个.tmp结尾的临时文件

  然后就可以通过IO流将文件保存到你想保存的位置上去,就可以了.

  微信小程序,简称小程序,英文名MiniProgram,是一种不需要下载安装即可使用的应用,它实现了应用"触手可及"的梦想,用户扫一扫或搜一下即可打开应用。

赞(11)
踩(0)
分享到:
华为认证网络工程师 HCIE直播课视频教程