微信小程序网络数据请求服务实现详解

网友投稿 527 2023-11-09

目录一、小程序中网络数据请求的限制二、配置request合法域名三、发起GET请求四、发起POST请求五、在页面刚加载时请求数据六、跳过request合法域名校验七、关于跨域和Ajax的说明

一、小程序中网络数据请求的限制

出于安全性方面的考虑,小程序官方对数据接口的请求做出了如下

微信小程序网络数据请求服务实现详解

两个限制:

1.只能请求HTTPS类型的接口

2.必须将接口的域名添加到信任列表中

二、配置request合法域名

需求描述:假设在自己的微信小程序中,希望请求https:/ /www.yzq2ty-/域名下的接口

配置步骤:登录微信小程序管理后台->开发->开发设置->服务器域名->修改request合法域名

注意事项:

1.域名只支持https协议

2.域名不能使用IP地址或localhost

3.域名必须经过ICP备案

4.服务器域名一个月内最多可申请5次修改

三、发起GET请求

?
1
2
3
4
5
6
7
8
9
10
11
12
13
uni.request({
url:baseURL+options.url,
method:options.method || GET,
data:options.data ||{},
header:options.header||{},
dataType:options.dataType||json,
success: (res) => {
resolve(res.data)
},
fail:(err)=>{
reject(err)
}
})

四、发起POST请求

我的项目在登录时,需要发起POST请求

五、在页面刚加载时请求数据

在很多情况下,我们需要在页面刚加载的时候,自动请求- -些初始化的数据 。此时需要在页面的onLoad事件中调用获取数据的函数,示例代码如下:

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
onLoad() {
uni.getSystemInfo({//获取系统信息
success: (res) => {
// #ifdef H5
this.scrollH = res.windowHeight - uni.upx2px(88)
//#endif
// #ifndef H5
this.scrollH = res.windowHeight - uni.upx2px(225)
//#endif
}
}),
this.gethome()
this.qqmapsdk = new QQMapWX({
key: 3SUBZ-W5BCQ-FLM5G-GYOPG-D523V-DUFNH
});
},

六、跳过request合法域名校验

如果后端程序员仅仅提供了http协议的接口、暂时没有提供https协议的接口。

此时为了不耽误开发的进度,我们可以在微信开发者工具中,临时

开启「开发环境不校验请求域名、TLS版本及HTTPS证书」

跳过request合法域名的校验。

七、关于跨域和Ajax的说明

跨域问题只存在于基于浏览器的Web开发中。由于小程序的宿主环境不是浏览器,而是微信客户端,所以小程序中不存在跨域的问题。

Ajax技术的核心是依赖于浏览器中的XMLHttpRequest这个对象,由于小程序的宿主环境是微信客户端,所以小程序中不能叫做“ 发起Ajax请求”,而是叫做“ 发起网络数据请求”。

您可能感兴趣的文章:微信小程序中如何使用store数据共享微信小程序数据请求的方式和注意事项详解小程序中实现获取全部数据的图文教程微信小程序前后端数据交互的详细图文教程微信小程序实现事件传参与数据同步流程详解微信小程序全局数据共享和分包图文详解微信小程序数据-使用实例详解

版权声明:本文内容由网络用户投稿,版权归原作者所有,本站不拥有其著作权,亦不承担相应法律责任。如果您发现本站中有涉嫌抄袭或描述失实的内容,请联系我们jiasou666@gmail.com 处理,核实后本网站将在24小时内删除侵权内容。

上一篇:使用uniapp打包上架微信小程序完整教程
下一篇:有关微信的小程序和小游戏的区别
相关文章

 发表评论

暂时没有评论,来抢沙发吧~