微信小程序(三):網(wǎng)絡(luò)請(qǐng)求
前文講配置的時(shí)候我們說過,開發(fā)小程序時(shí)可以選擇有 APPID 和 無 APPID ,兩種方式。
1. 當(dāng)有APPID的情況下,進(jìn)行網(wǎng)絡(luò)通信,只能和指定的域名進(jìn)行通信。如果沒有進(jìn)行配置,編譯時(shí)會(huì)報(bào)如下錯(cuò)誤:
配置方法:
設(shè)置域名
需要在微信公眾平臺(tái)的小程序中設(shè)置域名。在微信小程序的設(shè)置界面可以看到設(shè)置選項(xiàng):
選擇開發(fā)設(shè)置:
可以看到服務(wù)器設(shè)置:
這里我們可以設(shè)置我們這個(gè)APPID可以訪問的域名,每種最多可以設(shè)置兩個(gè)。(注意,此處只能使用 https 的域名,這個(gè)申請(qǐng)過程需要花費(fèi)一定的時(shí)間)
2. 當(dāng)沒有APPID的情況下,就方便多了,可以隨意進(jìn)行網(wǎng)絡(luò)請(qǐng)求,不限制域名,但是,這種情況下不能進(jìn)行發(fā)布,也不能在手機(jī)上預(yù)覽。如果想正式做小程序開發(fā),還是需要有一個(gè)https的域名,但是學(xué)習(xí)的情況下http的就足夠了。
在小程序中網(wǎng)絡(luò)請(qǐng)求大致分為四種類型。
- 普通HTTPS請(qǐng)求(wx.request)
- 上傳文件(wx.uploadFile)
- 下載文件(wx.downloadFile)
- WebSocket通信(wx.connectSocket)
這里主要講 wx.request:
使用wx.request可以發(fā)起一個(gè)http請(qǐng)求,一個(gè)微信小程序被限制為同時(shí)只有5個(gè)網(wǎng)絡(luò)請(qǐng)求。注意是同時(shí)。
wx.request({ url: 'http://192.168.1.137:80/app/guanggao', method: 'POST', data: { type: "1" }, header: { 'Accept': 'application/json' }, success: function (res) { that.setData({ images: res.data.data.guanggao }) } fail:function(err){ console.log(err) } })
上面的代碼會(huì)發(fā)送一個(gè)http get請(qǐng)求,其中的參數(shù)也比較容易理解。
- url 服務(wù)器的url地址
- data 請(qǐng)求的參數(shù)可以采用String data:”xxx=xxx&xxx=xxx”的形式或者Object data:{“userId”:1}的形式
- header 設(shè)置請(qǐng)求的header
- method http的方法,默認(rèn)為GET請(qǐng)求
- success 接口成功的回調(diào)
- fail 接口失敗的回調(diào)
另外還有一個(gè)參數(shù)沒有在代碼里:
- complete 調(diào)用接口結(jié)束之后的回調(diào),無論成功或者失敗該接口都會(huì)被調(diào)用
超時(shí)的設(shè)置
在前文中已經(jīng)提到了在app.js中設(shè)置networkTimeout可以設(shè)置四種類型網(wǎng)絡(luò)訪問的超時(shí)時(shí)間:
"networkTimeout":{ "request": 10000, "connectSocket": 10000, "uploadFile": 10000, "downloadFile": 10000 }
以上就是本文的全部?jī)?nèi)容,希望對(duì)大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
- 微信小程序網(wǎng)絡(luò)請(qǐng)求wx.request詳解及實(shí)例
- 微信小程序網(wǎng)絡(luò)請(qǐng)求的封裝與填坑之路
- 微信小程序 網(wǎng)絡(luò)請(qǐng)求(post請(qǐng)求,get請(qǐng)求)
- 微信小程序 網(wǎng)絡(luò)請(qǐng)求(GET請(qǐng)求)詳解
- 微信小程序 POST請(qǐng)求(網(wǎng)絡(luò)請(qǐng)求)詳解及實(shí)例代碼
- 微信小程序 網(wǎng)絡(luò)請(qǐng)求API詳解
- 微信小程序之網(wǎng)絡(luò)請(qǐng)求簡(jiǎn)單封裝實(shí)例詳解
相關(guān)文章
VSCode多行注釋插件KoroFileHeader使用示例
這篇文章主要為大家介紹了VSCode多行注釋插件KoroFileHeader使用示例詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-03-03TypeScript與JavaScript對(duì)比及打包工具比較
這篇文章主要為大家介紹了TypeScript與JavaScript對(duì)比及打包工具比較,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-03-03利用前端HTML+CSS+JS開發(fā)簡(jiǎn)單的TODOLIST功能(記事本)
這篇文章主要介紹了用HTML+CSS+JS做出簡(jiǎn)單的TODOLIST(記事本)項(xiàng)目,文中通過示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下2021-04-04JS前端架構(gòu)pnpm構(gòu)建Monorepo方式管理demo
這篇文章主要為大家介紹了JS前端架構(gòu)pnpm構(gòu)建Monorepo方式的管理demo,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2022-07-07基于遷移學(xué)習(xí)的JS目標(biāo)檢測(cè)器構(gòu)建過程詳解
這篇文章主要為大家介紹了基于遷移學(xué)習(xí)的JS目標(biāo)檢測(cè)器構(gòu)建過程詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-03-03JavaScript parseInt0.0000005打印5原理解析
這篇文章主要為大家介紹了JavaScript parseInt0.0000005打印5原理解析,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2022-07-07