文章详情

短信预约-IT技能 免费直播动态提醒

请输入下面的图形验证码

提交验证

短信预约提醒成功

微信小程序怎么将本地资源上传到开发者服务器

2023-06-26 09:31

关注

本文小编为大家详细介绍“微信小程序怎么将本地资源上传到开发者服务器”,内容详细,步骤清晰,细节处理妥当,希望这篇“微信小程序怎么将本地资源上传到开发者服务器”文章能帮助大家解决疑惑,下面跟着小编的思路慢慢深入,一起来学习新知识吧。

wx.uploadFile(OBJECT)


将本地资源上传到开发者服务器。如页面通过 wx.chooseImage 等接口获取到一个本地资源的临时文件路径后,可通过此接口将本地资源上传到指定服务器。客户端发起一个HTTPS POST请求,其中Content-Typemultipart/form-data

OBJECT参数说明:

参数类型必填说明
urlString开发者服务器url
filePathString要上传文件资源的路径
nameString文件对应的key , 开发者在服务器端通过这个key可以获取到文件二进制内容
headerObjectHTTP 请求 Header,header中不能设置Referer
formDataObjectHTTP 请求中其他额外的form data
successFunction接口调用成功的回调函数
failFunction接口调用失败的回调函数
completeFunction接口调用结束的回调函数(调用成功、失败都会执行)

success返回参数说明:

参数类型说明
dataString开发者服务器返回的数据
statusCodeNumberHTTP状态码

示例代码:

wx.chooseImage({  success:function(res){var tempFilePaths = res.tempFilePaths    wx.uploadFile({      url: 'http://example.weixin.qq.com/upload', //仅为示例,非真实的接口地址      filePath: tempFilePaths[0],      name:"file",      formData:{"user":"test"  }      success: function(res){        var data = res.data        //do something      }    })  }})

返回值:

基础库 1.4.0 开始支持,低版本需做兼容处理

返回一个uploadTask对象,通过uploadTask,可监听上传进度变化事件,以及取消上传任务。

uploadTask

uploadTask 对象的方法列表:

方法参数说明最低版本
onProgressUpdatecallback监听上传进度变化1.4.0
abort 中断上传任务1.4.0

onProgressUpdate 返回参数说明:

参数类型说明
progressNumber上传进度百分比
totalBytesSentNumber已经上传的数据长度,单位 Bytes
totalBytesExpectedToSendNumber预期需要上传的数据总长度,单位 Bytes

示例代码:

const uploadTask = wx.uploadFile({    url: 'http://example.weixin.qq.com/upload', //仅为示例,非真实的接口地址filePath: tempFilePaths[0],    name: 'file',    formData:{'user': 'test'},    success: function(res){var data = res.data//do something}})uploadTask.onProgressUpdate((res) => {console.log('上传进度', res.progress)console.log('已经上传的数据长度', res.totalBytesSent)console.log('预期需要上传的数据总长度', res.totalBytesExpectedToSend)})uploadTask.abort() // 取消上传任务

Bug & Tip

  1. tip: 最大并发限制是 10 个

  2. tip: 默认超时时间和最大超时时间都是 60s

wx.downloadFile(OBJECT)


下载文件资源到本地。客户端直接发起一个HTTP GET请求,返回文件的本地临时路径。

OBJECT参数说明:

参数类型必填必填
urlString下载资源的 url
headerObjectHTTP 请求 Header
successFunction下载成功后以 tempFilePath 的形式传给页面,res={tempFilePath:'文件的临时路径'}
failFunction接口调用失败的回调函数
completeFunction接口调用结束的回调函数(调用成功、失败都会执行)

注:文件的临时路径,在小程序本次启动期间可以正常使用,如需持久保存,需在主动调用 wx.saveFile,在小程序下次启动时才能访问得到。

示例代码:

wx.downloadFile({  url: 'http://example.com/audio/123', //仅为示例,并非真实的资源  success: function(res) {    wx.playVoice({      filePath: res.tempFilePath    })  }})

返回值:

基础库 1.4.0 开始支持,低版本需做兼容处理

返回一个downloadTask对象,通过downloadTask,可监听下载进度变化事件,以及取消下载任务。

downloadTask

downloadTask 对象的方法列表:

方法参数说明最低版本
onProgressUpdatecallback监听下载进度变化1.4.0
abort 中断下载任务1.4.0

onProgressUpdate 返回参数说明:

参数类型说明
progressNumber下载进度百分比
totalBytesWrittenNumber已经下载的数据长度,单位 Bytes
totalBytesExpectedToWriteNumber预期需要下载的数据总长度,单位 Bytes

示例代码:

const downloadTask = wx.downloadFile({    url: 'http://example.com/audio/123', //仅为示例,并非真实的资源success: function(res) {        wx.playVoice({            filePath: res.tempFilePath        })    }})downloadTask.onProgressUpdate((res) => {console.log('下载进度', res.progress)console.log('已经下载的数据长度', res.totalBytesWritten)console.log('预期需要下载的数据总长度', res.totalBytesExpectedToWrite)})downloadTask.abort() // 取消下载任务

Bug & Tip

  1. tip: 最大并发限制是 10 个

  2. tip: 默认超时时间和最大超时时间都是 60s

  3. tip: 网络请求的 referer 是不可以设置的,格式固定为 https://servicewechat.com/{appid}/{version}/page-frame.html,其中{appid}为小程序的 appid,{version}为小程序的版本号,版本号为 0 表示为开发版。

  4. tip: 6.5.3 以及之前版本的 iOS 微信客户端header设置无效

读到这里,这篇“微信小程序怎么将本地资源上传到开发者服务器”文章已经介绍完毕,想要掌握这篇文章的知识点还需要大家自己动手实践使用过才能领会,如果想了解更多相关内容的文章,欢迎关注编程网行业资讯频道。

阅读原文内容投诉

免责声明:

① 本站未注明“稿件来源”的信息均来自网络整理。其文字、图片和音视频稿件的所属权归原作者所有。本站收集整理出于非商业性的教育和科研之目的,并不意味着本站赞同其观点或证实其内容的真实性。仅作为临时的测试数据,供内部测试之用。本站并未授权任何人以任何方式主动获取本站任何信息。

② 本站未注明“稿件来源”的临时测试数据将在测试完成后最终做删除处理。有问题或投稿请发送至: 邮箱/279061341@qq.com QQ/279061341

软考中级精品资料免费领

  • 历年真题答案解析
  • 备考技巧名师总结
  • 高频考点精准押题
  • 2024年上半年信息系统项目管理师第二批次真题及答案解析(完整版)

    难度     813人已做
    查看
  • 【考后总结】2024年5月26日信息系统项目管理师第2批次考情分析

    难度     354人已做
    查看
  • 【考后总结】2024年5月25日信息系统项目管理师第1批次考情分析

    难度     318人已做
    查看
  • 2024年上半年软考高项第一、二批次真题考点汇总(完整版)

    难度     435人已做
    查看
  • 2024年上半年系统架构设计师考试综合知识真题

    难度     224人已做
    查看

相关文章

发现更多好内容

猜你喜欢

AI推送时光机
位置:首页-资讯-服务器
咦!没有更多了?去看看其它编程学习网 内容吧
首页课程
资料下载
问答资讯