iis服务器助手广告广告
返回顶部
首页 > 资讯 > 精选 >【小程序从0到1】网络数据请求——request合法域名|GET|POST|跨域?Ajax?
  • 908
分享到

【小程序从0到1】网络数据请求——request合法域名|GET|POST|跨域?Ajax?

小程序ajax移动端javascript微信小程序 2023-08-17 07:08:55 908人浏览 八月长安
摘要

欢迎来到我的博客 📔博主是一名大学在读本科生,主要学习方向是前端。 🍭目前已经更新了【Vue】、【React–从基础到实战】、【typescript】等等系列专栏 🛠目前正在学习的是&#

欢迎来到我的博客
📔博主是一名大学在读本科生,主要学习方向是前端
🍭目前已经更新了Vue】、【React–从基础到实战】、【typescript】等等系列专栏
🛠目前正在学习的是🔥 R e a c t / 小程序 React/小程序 React/小程序🔥,中间穿插了一些基础知识的回顾
🌈博客主页👉codeMak1r.小新的博客

本文被专栏【小程序|原力计划】收录

🕹坚持创作✏️,一起学习📖,码出未来👨🏻‍💻!
在这里插入图片描述

上篇文章详细讲解了微信小程序的页面配置,这篇文章将带领大家学习的是小程序的「网络数据请求」

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

处于安全性考虑,小程序官方对于数据接口的请求作出了如下两个限制:

  • 只能请求https类型的接口;
  • 必须将接口的域名添加到信任列表中

在这里插入图片描述

需要将接口的域名添加到图中的request合法域名中。

配置request合法域名

假设需要在自己的微信小程序中,希望请求Https://www.escook.cn/域名下的接口

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

在这里插入图片描述
在这里插入图片描述

⚠️注意:https://www.escook.cn是刘龙斌老师提供的域名。

  • 域名只支持https协议
  • 域名不能使用IP地址或者localhost
  • 域名必须经过ICP备案
  • 服务器域名一个月内最多可申请50次修改

发起GET请求

调用微信小程序提供的 wx.request()方法,可以发起GET数据请求,示例代码如下:
(在小程序中有一个顶级的对象就是wx,相当于web开发中的window,此类对象不需要声明就可以直接使用)

getInfo() {    wx.request({      url: 'https://www.escook.cn/api/get',  // 请求的地址,必须基于https协议      method: 'GET',      data: {        name: 'zs',        age: 20      },      success: res => {        console.log(res.data);      }  })

在这里插入图片描述

发起POST请求

调用微信小程序提供的 wx.request() 方法,可以发起POST数据请求,示例代码如下:

wx.request({      url: 'https://www.escook.cn/api/post',      method: 'POST',      data: {        name: 'ls',        age: 33      },      success: res => {        console.log(res.data);      }  })

在这里插入图片描述

页面刚加载时请求数据 — onLoad

onLoad生命周期函数——监听页面加载

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

// 生命周期函数——监听页面加载onLoad() {  this.getInfo()  this.postInfo()},

这样就可以在页面刚一加载时,就去调用getInfo / postInfo两个方法。

跳过request合法域名校验

如果后端程序员仅仅提供了http协议的接口,暂时没有提供https协议的接口。
此时为了不耽误开发进度,我们可以在微信开发者工具中,临时开启「开发环境不校验请求域名、TLS版本以及 HTTPS 证书」选项,跳过request合法域名校验。

在这里插入图片描述

注意:跳过request合法域名校验的选项,仅限在开发与调试阶段使用!

关于跨域和ajax的说明

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

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

来源地址:https://blog.csdn.net/Svik_zy/article/details/127230887

--结束END--

本文标题: 【小程序从0到1】网络数据请求——request合法域名|GET|POST|跨域?Ajax?

本文链接: https://www.lsjlt.com/news/372457.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

本篇文章演示代码以及资料文档资料下载

下载Word文档到电脑,方便收藏和打印~

下载Word文档
猜你喜欢
软考高级职称资格查询
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作