如何在微信小程序中封装网络请求

　　介绍

这期内容当中小编将会给大家带来有关如何在微信小程序中封装网络请求,文章内容丰富且以专业的角度为大家分析和叙述,阅读完这篇文章希望大家可以有所收获。

<强>网络请求

网络请求小程序提供了<代码>天气。请求> api> 美元。ajax代码吗,好古老啊。

//,官方例子 　　wx.request ({ 　　,url: & # 39; test.php& # 39;,,//仅为示例,并非真实的接口地址 　　,数据:{ 　　,,,x: & # 39; & # 39;,, 　　,,,y: & # 39; & # 39; 　　}, 　　,头:{ 　　,,& # 39;内容类型# 39;:,& # 39;application/json # 39;,//,默认值 　　}, 　　,成功:函数(res), { 　　console.log才能(res.data) 　　,} 　　})

小程序支持ES6,那么就应该支持答应了,很开心~,话不多说直接上代码吧

<强>承诺封装

const  baseUrl =, & # 39; https://api.it120.cc& # 39;; 　　 　　const  http =, ({=,, url  & # 39; & # 39;,, param =, {},,……other },=,{}),=祝辞,{ 　　wx.showLoading({才能 　　,,,标题:,& # 39;请求中,请耐心等待. . & # 39; 　　,,}); 　　let 才能;timeStart =, Date.now (); 　　return 才能;new 承诺((解决,,拒绝),=祝辞,{ 　　,,,wx.request ({ 　　,,,,,url:, getUrl (url), 　　,,,,,数据:,参数, 　　,,,,,头:,{ 　　,,,,,,,& # 39;内容类型# 39;:,& # 39;application/json # 39;,//,默认值,,另一种是,“content-type":,“应用程序/x-www-form-urlencoded" 　　,,,,,}, 　　,,,,,,, 　　,,,,,完成:,(res),=祝辞,{ 　　,,,,,,,wx.hideLoading (); 　　,,,,,,,console.log(“耗时$ {Date.now(),安康;timeStart}”); 　　,,,,,,,if  (res.statusCode 祝辞=,200,,,,res.statusCode  & lt;, 300), { 　　,,,,,,,,,解决(res.data) 　　,,,,,,,},{else  　　,,,,,,,,,拒绝(res) 　　,,,,,,,} 　　,,,,,} 　　,,,}) 　　})才能 　　} 　　 　　const  getUrl =, (url),=祝辞,{ 　　if 才能;(url.indexOf (& # 39;://& # 39;),==, 1), { 　　,,,url =, baseUrl  +, url; 　　,,} 　　return 才能;url 　　}//,让方法 　　const  _get =, (url, param =,{}),=祝辞,{ 　　http ({return 才能; 　　,,,的url, 　　,,参数 　　})才能 　　} 　　 　　const  _post =, (url, param =,{}),=祝辞,{ 　　http ({return 才能; 　　,,,的url, 　　,,,参数, 　　,,,方法:,& # 39;文章# 39; 　　})才能 　　} 　　 　　const  _put =, (url, param =,{}),=祝辞,{ 　　http ({return 才能; 　　,,,的url, 　　,,,参数, 　　,,,方法:,& # 39;把# 39; 　　})才能 　　} 　　 　　const  _delete =, (url, param =,{}),=祝辞,{ 　　http ({return 才能; 　　,,,的url, 　　,,,参数, 　　,,,方法:,& # 39;把# 39; 　　})才能 　　} 　　module.exports =, { 　　baseUrl,才能 　　get,才能 　　_post才能, 　　_put才能, 　　_delete才能 　　}

<强>使用

const  api =,需要(& # 39;. ./. ./跑龙套api.js& # 39;)//,单个请求 　　api.get(& # 39;列表# 39;),然后(res =祝辞,{ 　　,console.log (res) 　　}).catch (e =祝辞,{ 　　,console.log (e) 　　})//,一个页面多个请求 　　Promise.all ([ 　　,api.get(& # 39;列表# 39;), 　　,api.get(“细节/$ {id}”) 　　))(result =祝辞,{ 　　,console.log(结果) 　　}).catch (e =祝辞,{ 　　,console.log (e) 　　})

<>强登陆问题

做一个应用,肯定避免不了登录操作。用户的个人信息啊,相关的收藏列表等功能都需要用户登录之后才能操作。一般我们使用令牌做标识。

小程序并没有登录界面,使用的是<代码>天气。登录。<代码>天气。登录> 代码,拿着该代码<> 代码去请求我们的后台会最后返回一个<代码>标记到小程序这边,保存这个值为令牌每次请求的时候带上这个值。
一般还需要把用户的信息带上比如用户微信昵称,微信头像等,这时候就需要使用wx。getUserInfo,这里涉及到一个用户授权的问题

带上用户信息就够了嘛?太年轻太简单!我们的项目不可能只有小程序,相应的微信公众平台可能还有相应的应用,我们需要把账号系统打通,让用户在我们的项目中的账户是同一个。这就需要用到微信开放平台提供的UnionID。

<>强登陆

//app.js 　　应用程序({ 　　,onLaunch: function  (), { 　　console.log才能(& # 39;App  onLaunch& # 39;); 　　var 才能;that =,;//,才能获取商城名称 　　wx.request({才能 　　,,,url: & # 39; https://api.it120.cc/& # 39; +, that.globalData.subDomain  + & # 39;/config/get-value& # 39; 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null 　　null

如何在微信小程序中封装网络请求