您好,登錄后才能下訂單哦!
本文小編為大家詳細介紹“微信小程序怎么將本地資源上傳到開發者服務器”,內容詳細,步驟清晰,細節處理妥當,希望這篇“微信小程序怎么將本地資源上傳到開發者服務器”文章能幫助大家解決疑惑,下面跟著小編的思路慢慢深入,一起來學習新知識吧。
將本地資源上傳到開發者服務器。如頁面通過 wx.chooseImage 等接口獲取到一個本地資源的臨時文件路徑后,可通過此接口將本地資源上傳到指定服務器。客戶端發起一個HTTPS POST請求,其中Content-Type
為multipart/form-data
。
OBJECT參數說明:
參數 | 類型 | 必填 | 說明 |
---|---|---|---|
url | String | 是 | 開發者服務器url |
filePath | String | 是 | 要上傳文件資源的路徑 |
name | String | 是 | 文件對應的key , 開發者在服務器端通過這個key可以獲取到文件二進制內容 |
header | Object | 否 | HTTP 請求 Header,header中不能設置Referer |
formData | Object | 否 | HTTP 請求中其他額外的form data |
success | Function | 否 | 接口調用成功的回調函數 |
fail | Function | 否 | 接口調用失敗的回調函數 |
complete | Function | 否 | 接口調用結束的回調函數(調用成功、失敗都會執行) |
success返回參數說明:
參數 | 類型 | 說明 |
---|---|---|
data | String | 開發者服務器返回的數據 |
statusCode | Number | HTTP狀態碼 |
示例代碼:
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 對象的方法列表:
方法 | 參數 | 說明 | 最低版本 |
---|---|---|---|
onProgressUpdate | callback | 監聽上傳進度變化 | 1.4.0 |
abort | 中斷上傳任務 | 1.4.0 |
onProgressUpdate 返回參數說明:
參數 | 類型 | 說明 |
---|---|---|
progress | Number | 上傳進度百分比 |
totalBytesSent | Number | 已經上傳的數據長度,單位 Bytes |
totalBytesExpectedToSend | Number | 預期需要上傳的數據總長度,單位 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() // 取消上傳任務
tip
: 最大并發限制是 10 個
tip
: 默認超時時間和最大超時時間都是 60s
下載文件資源到本地。客戶端直接發起一個HTTP GET請求,返回文件的本地臨時路徑。
OBJECT參數說明:
參數 | 類型 | 必填 | 必填 |
---|---|---|---|
url | String | 是 | 下載資源的 url |
header | Object | 否 | HTTP 請求 Header |
success | Function | 否 | 下載成功后以 tempFilePath 的形式傳給頁面,res={tempFilePath:'文件的臨時路徑'} |
fail | Function | 否 | 接口調用失敗的回調函數 |
complete | Function | 否 | 接口調用結束的回調函數(調用成功、失敗都會執行) |
注:文件的臨時路徑,在小程序本次啟動期間可以正常使用,如需持久保存,需在主動調用 wx.saveFile,在小程序下次啟動時才能訪問得到。
示例代碼:
wx.downloadFile({ url: 'http://example.com/audio/123', //僅為示例,并非真實的資源 success: function(res) { wx.playVoice({ filePath: res.tempFilePath }) } })
返回值:
基礎庫 1.4.0 開始支持,低版本需做兼容處理
返回一個downloadTask
對象,通過downloadTask
,可監聽下載進度變化事件,以及取消下載任務。
downloadTask 對象的方法列表:
方法 | 參數 | 說明 | 最低版本 |
---|---|---|---|
onProgressUpdate | callback | 監聽下載進度變化 | 1.4.0 |
abort | 中斷下載任務 | 1.4.0 |
onProgressUpdate 返回參數說明:
參數 | 類型 | 說明 |
---|---|---|
progress | Number | 下載進度百分比 |
totalBytesWritten | Number | 已經下載的數據長度,單位 Bytes |
totalBytesExpectedToWrite | Number | 預期需要下載的數據總長度,單位 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() // 取消下載任務
tip
: 最大并發限制是 10 個
tip
: 默認超時時間和最大超時時間都是 60s
tip
: 網絡請求的 referer 是不可以設置的,格式固定為 https://servicewechat.com/{appid}/{version}/page-frame.html,其中{appid}
為小程序的 appid,{version}
為小程序的版本號,版本號為 0 表示為開發版。
tip
: 6.5.3 以及之前版本的 iOS 微信客戶端header
設置無效
讀到這里,這篇“微信小程序怎么將本地資源上傳到開發者服務器”文章已經介紹完畢,想要掌握這篇文章的知識點還需要大家自己動手實踐使用過才能領會,如果想了解更多相關內容的文章,歡迎關注億速云行業資訊頻道。
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。