這篇文章給大家介紹了微信小程式如何進行http請求的詳細步驟，相信對大家學習微信小程式網路請求會有所幫助，有需要的朋友們下面來一起看看吧。
http請求介紹
HTTP(HyperText Transfer Protocol)是一套電腦透過網路通訊的規則。電腦專家設計出HTTP，使HTTP客戶（如Web瀏覽器）能夠從HTTP伺服器(Web伺服器)請求資訊和服務，HTTP目前協定的版本是1.1.HTTP是一種無狀態的協議，無狀態是指Web瀏覽器和Web伺服器之間不需要建立持久的連接，這意味著當一個客戶端向伺服器端發出請求，然後Web伺服器返回回應(response)，連接就被關閉了，在伺服器端不保留連接的有關訊息.HTTP遵循請求(Request)/應答(Response)模型。 Web瀏覽器向Web伺服器發送請求，網路伺服器處理請求並傳回適當的應答。所有HTTP連接都被建構成一套請求和應答。
微信小程式設定http請求
#在微信小程式進行網路通信，只能和指定的網域進行通信，微信小程式包括四種類型的網路請求。
1、普通HTTPS請求(wx.request)
2、上傳檔案(wx.uploadFile)
## 3、下載檔案(wx.downloadFile)
4、WebSocket通訊(wx.connectSocket)
這裡以介紹wx.request,wx.uploadFile,wx.dowloadFile三種網路請求為主
#設定域名
要微信小程式進行網路通信，必須先設定域名，不然會出現錯誤:
URL 網域不合法，請在mp 後台配置後重試
需要在微信公眾平台的小程式中設定網域。
在微信小程式的設定介面可以看到設定選項：
設定
選擇開發設定：
開發設定
可以看到伺服器設定:
伺服器設定
在這裡可以設定對應四種網路存取的域名，每一種類型的網路請求需要設定一個域名，注意如果在這裡設定域名為https://example.com/api/,那麼https://example.com/api是無法呼叫的，必須加上後面/ 。
http請求
使用wx.request可以發起http請求，一個微信小程式被限制為同時只有5個網路請求。
function queryRequest(data){
wx.request({
url:"https://example.com/api/",
data:data,
header:{
// "Content-Type":"application/json"
},
success:function(res){
console.log(res.data)
},
fail:function(err){
console.log(err)
}
})
}上面的程式碼會傳送一個http get請求，然後列印出回傳的結果。其中的參數也比較容易理解。
url 伺服器的url位址
data 請求的參數可以採用String data:"xxx=xxx&xxx=xxx "的形式或Object data:{"userId":1}的形式
header 設定請求的header
success 介面成功的回呼
# fail 介面失敗的回呼
另外還有兩個參數沒有在程式碼裡:
的方法,預設為GET要求
complete 呼叫介面結束後的回呼，無論成功或失敗該介面都會被呼叫
上傳檔案
#上傳檔案的api為wx.uploadFile，該api會發起一個http post請求，其中的Content-type為multipart/form-data
Content-type
類型接收檔案,範例程式碼：#
function uploadFile(file,data) {
wx.uploadFile({
url: 'http://example.com/upload',
filePath: file,
name: 'file',
formData:data,
success:function(res){
console.log(res.data)
},
fail:function(err){
console.log(err)
}
})
}其中的url， header，success，fail和普通的http請求是一樣的。
這裡有差異的參數是: name檔案對應的key
，伺服器端需要透過
參數取得檔案
要求中可以使用的其他參數
下載檔案
下载文件的api为wx.downloadFile,该api会发起一个http get请求，并在下载成功之后返回文件的临时路径，示例代码：
function downloadFile(url,typ,success){
wx.downloadFile({
url:url,
type:typ,
success:function(res){
if(success){
success(res.tempFilePath)
}
},
fail:function(err){
console.log(err)
}
})
}其中的url,header,fail,complete和wx.uploadFile的参数使用是一致的，其中有区别的参数是:
type:下载资源的类型，用于客户端自动识别，可以使用的参数image/audio/video<br/>
success：下载成功之后的回调，以tempFilePath的参数返回文件的临时目录：res={tempFilePath:'文件路径'}<br/>
下载成功后的是临时文件，只会在程序本次运行期间可以使用，如果需要持久的保存，需要调用方法wx.saveFile主动持久化文件，实例代码:
function svaeFile(tempFile,success){
wx.saveFile({
tempFilePath:tempFile,
success:function(res){
var svaedFile=res.savedFilePath
if(success){
success(svaeFile)
}
}
})
}使用wx.saveFile保存临时文件到本地，提供给小程序下次启动时使用，其中的参数：
tempFilePath 需要被保存文件的路径
success 保存成功的回调，返回保存成功的路径，使用res.savedFilePath可以获取保存成功的路径
fail 失败的回调
complete结束的回调
超时的设置
可以在app.js中设置networkTimeout可以设置四种类型网络访问的超时时间：
"networkTimeout":{
"request": 10000,
"connectSocket": 10000,
"uploadFile": 10000,
"downloadFile": 10000
}这里设置的超时时间对应着四种类型的网络请求。
以上就是本文的全部内容，希望对大家的学习有所帮助，更多相关内容请关注PHP中文网！
相关推荐：
以上是關於微信小程式設定http請求的步驟的詳細內容。更多資訊請關注PHP中文網其他相關文章！
