一录煤、數(shù)據(jù)請求
出于安全性方面的考慮,小程序官方對數(shù)據(jù)接口的請求做出了如下兩個(gè)限制:
- 只能請求 HTTPS 類型的接口荞胡。
- 必須將接口的域名添加到信任列表中妈踊。
1.1、配置 request 合法域名
配置步驟:
登錄微信小程序管理后臺 -> 開發(fā) ->開發(fā)設(shè)置 ->服務(wù)器域名 ->修改 request 合法域名泪漂。
- 注意事項(xiàng)
域名只支持 https 協(xié)議廊营。
域名不能使用IP 地址或 localhost。
域名必須經(jīng)過 ICP 備案萝勤。
服務(wù)器域名一個(gè)月內(nèi)最多可申請5 次修改露筒。
1.2、網(wǎng)絡(luò)數(shù)據(jù)請求
調(diào)用微信小程序提供的 wx.request()方法敌卓,可以發(fā)起數(shù)據(jù)請求慎式。
1.2.1、發(fā)起GET請求
<button type="primary" bind:tap="getInfo">GET請求</button>
getInfo(){
wx.request({
url:'https://www.escook.cn/api/get', ,// 請求的接口地址瞬捕,必須基于 https 協(xié)議
method:'GET', // 請求的方式
data:{ // 發(fā)送到服務(wù)器的數(shù)據(jù)
name:'zs',
age:20,
},
success:(res)=>{ // 請求成功之后的回調(diào)函數(shù)
console.log(res)
}
})
},
1.2.2鞍历、發(fā)起POST請求
<button type="primary" bind:tap="postInfo">POST請求</button>
postInfo(){
wx.request({
url:'https://www.escook.cn/api/post', // 請求的接口地址,必須基于 https 協(xié)議
method:'POST', // 請求的方式
data:{ // 發(fā)送到服務(wù)器的數(shù)據(jù)
name:'ls',
age:20,
},
success:(res)=>{ // 請求成功之后的回調(diào)函數(shù)
console.log(res)
}
})
},
1.2.3肪虎、在頁面剛加載時(shí)請求數(shù)據(jù)
在很多情況下劣砍,我們需要在頁面剛加載的時(shí)候,自動請求一些初始化的數(shù)據(jù)扇救。此時(shí)需要在頁面的 onLoad 事件中調(diào)用獲取數(shù)據(jù)的函數(shù)刑枝,示例代碼如下:
/**
* 生命周期函數(shù)--監(jiān)聽頁面加載
*/
onLoad(options) {
this.getInfo()
this.postInfo()
},
1.2.4、跳過 request 合法域名校驗(yàn)
如果后端程序員僅僅提供了 http 協(xié)議的接口迅腔、暫時(shí)沒有提供 https
協(xié)議的接口装畅,此時(shí)為了不耽誤開發(fā)的進(jìn)度,我們可以在微信開發(fā)者工具中沧烈,臨時(shí)開啟「開發(fā)環(huán)境不校驗(yàn)請求域名掠兄、TLS 版本及 HTTPS 證書」選項(xiàng)跳過 request 合法域名的校驗(yàn)。
- 注意
跳過 request 合法域名校驗(yàn)的選項(xiàng)锌雀,僅限在開發(fā)與調(diào)試階段使用!
1.2.5蚂夕、關(guān)于跨域和 Ajax 的說明
跨域問題只存在于基于瀏覽器的 Web 開發(fā)中。由于小程序的宿主環(huán)境不是瀏覽器腋逆,而是微信客戶端婿牍,所以小程序中不存在跨域的問題。
Ajax 技術(shù)的核心是依賴于瀏覽器中的 XMLHttpRequest 這個(gè)對象惩歉,由于小程序的宿主環(huán)境是微信客戶端等脂,所以小程序中不能叫做“發(fā)起 Ajax 請求”,而是叫做“發(fā)起網(wǎng)絡(luò)數(shù)據(jù)請求”撑蚌。