微信小程序网络数据请求服务实现详解
一、小程序中网络数据请求的限制
出于安全性方面的考虑,小程序官方对数据接口的请求做出了如下
两个限制:
1.只能请求HTTPS类型的接口
2.必须将接口的域名添加到信任列表中
二、配置request合法域名
需求描述:假设在自己的微信小程序中,希望请求https:/ /www.yzq2ty.cn/域名下的接口
配置步骤:登录微信小程序管理后台->开发->开发设置->服务器域名->修改request合法域名
注意事项:
1.域名只支持https协议
2.域名不能使用IP地址或localhost
3.域名必须经过ICP备案
4.服务器域名一个月内最多可申请5次修改
三、发起GET请求
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请求
import request from '../utils/request.js' export function getLogin(username,password){ return request({ url:'/login', method:'POST', data:{ username,password } }) }
五、在页面刚加载时请求数据
在很多情况下,我们需要在页面刚加载的时候,自动请求- -些初始化的数据 。此时需要在页面的onLoad事件中调用获取数据的函数,示例代码如下:
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请求”,而是叫做“ 发起网络数据请求”。
到此这篇关于微信小程序网络数据请求服务实现详解的文章就介绍到这了,更多相关小程序数据请求内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!
相关文章
chatGPT前端流式输出js实现三种方法—fetch、SSE、websocket
项目需要接入chatgpt提供的api,后端返回流式的字符,前端接收并实时显示,在JavaScript中,使用Stream流通常指的是处理数据流的一种方式,它们允许数据被处理成块,而不是一次性处理整个数据集,这对于处理大量数据或者来自网络请求的数据非常有用,2024-07-07通过location.replace禁止浏览器后退防止重复提交
如果用户重复提交事件,然后又后退,这样可能会对某些数据产生灾难性的问题。所以今天就向大家介绍一种通过location.replace禁止浏览器后退按钮的方法2014-09-09firefox firebug中文入门教程 脚本之家新年特别版
最近看了一篇文章感触颇深,对于firebug作为脚本之家的编辑经常看的到,但可悲的是没怎么用过,不是不用那个而是不会用,刚好看了一篇基础的文章特别整理下。2010-01-01
最新评论