微信小程序数据请求的方式和注意事项详解

 更新时间:2022年11月30日 10:03:22   作者:未及545  
这篇文章主要为大家介绍了微信小程序网络数据请求的方式和注意事项讲解,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪

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

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

① 只能请求HTTPS类型的接口

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

2.配置request合法域名

假设要在自己的微信小程序中,希望请求某一域名下的接口,则配置步骤如下:

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

注意事项:

① 域名只支持https协议

② 域名不能使用IP地址或localhost

③ 域名必须经过ICP备案

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

3.发起GET请求

调用微信小程序提供的wx.request()方法,可以发起GET数据请求。

首先设置好请求域名,然后操作如下:

<button type="primary" bindtap="Info">GET获取请求</button>
.js文件和data数据平级
Info(){
    wx.request({
      // 请求路径
      url:"https://www.escook.cn/api/get",
      // 请求方式
      method:"GET",
      // 发送到服务器的数据
      data:{
        name:"张三",
        age:20
      },
      // 成功之后的回调函数
      success:(res)=>{
        console.log(res);
      }
    })
  },

4.发起POST请求

调用微信小程序提供的wx.request()方法,可以发起POST数据请求

<button type="primary" bindtap="PostInfo">POST获取请求</button>
  PostInfo(){
    wx.request({
      // 请求路径
      url:"https://www.escook.cn/api/post",
      // 请求方式
      method:"POST",
      // 发送到服务器的数据
      data:{
        name:"张三",
        age:20
      },
      // 成功之后的回调函数
      success:(res)=>{
        console.log(res);
      }
    })
  },

5.在页面刚加载时请求数据

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

 /**
   * 生命周期函数--监听页面加载
   */
  onLoad(options) {
this.PostInfo()
  },

6.跳过request合法域名校验

如果后端仅仅提供了http协议的接口,暂时没有https接口,此时可以通过以下设置跳过request合法域名校验。

注意:仅在开发调试阶段使用。

7.关于跨域和Ajax的介绍

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

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

到此这篇关于微信小程序数据请求的方式和注意事项详解的文章就介绍到这了,更多相关小程序数据请求内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

相关文章

  • ES6 Promise对象概念及用法实例详解

    ES6 Promise对象概念及用法实例详解

    这篇文章主要介绍了ES6 Promise对象概念及用法,结合实例形式详细分析了ES6中Promise对象的概念、原理、创建、使用方法及相关操作注意事项,需要的朋友可以参考下
    2019-10-10
  • webpack4 升级迁移的实现

    webpack4 升级迁移的实现

    这篇文章主要介绍了webpack 4 升级迁移的实现,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2018-09-09
  • JS、jquery实现几分钟前、几小时前、几天前等时间差显示效果的代码实例分享

    JS、jquery实现几分钟前、几小时前、几天前等时间差显示效果的代码实例分享

    在新浪微博首页看到每条微博后边显示的时间并不是标准的年-月-日格式,而是经过换算的时间差,如:发表于5分钟前、发表于“2小时前”,比起标准的时间显示格式,貌似更加直观和人性化
    2014-04-04
  • 小程序scroll-view安卓机隐藏横向滚动条的实现详解

    小程序scroll-view安卓机隐藏横向滚动条的实现详解

    这篇文章主要介绍了小程序scroll-view安卓机隐藏横向滚动条的实现详解,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2019-05-05
  • CocosCreator实现技能冷却效果

    CocosCreator实现技能冷却效果

    这篇文章主要介绍了CocosCreator实现技能冷却效果,同学们可以跟着教程,亲手试一下,代码都是可以复用的
    2021-04-04
  • javascript+dom树型菜单类,希望朋友们一起进步

    javascript+dom树型菜单类,希望朋友们一起进步

    javascript+dom树型菜单类,希望朋友们一起进步...
    2007-05-05
  • js判断数组key是否存在(不用循环)的简单实例

    js判断数组key是否存在(不用循环)的简单实例

    下面小编就为大家带来一篇js判断数组key是否存在(不用循环)的简单实例。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2016-08-08
  • 深入理解Javascript闭包 新手版

    深入理解Javascript闭包 新手版

    最近在网上查阅了不少Javascript闭包(closure)相关的资料,写的大多是非常的学术和专业。对于初学者来说别说理解闭包了,就连文字叙述都很难看懂。撰写此文的目的就是用最通俗的文字揭开Javascript闭包的真实面目。
    2010-12-12
  • js代码解密代码

    js代码解密代码

    在做网页时(其实是网页木马呵呵),最让人烦恼的是自己辛辛苦苦写出来的客户端IE运行的JAVASCRIPT代码常常被别人轻易的拷贝,实在让自己的心里有点不是滋味,要知道自己写点东西也挺累的
    2008-06-06
  • IE view-source 无法查看看源码 JavaScript看网页源码

    IE view-source 无法查看看源码 JavaScript看网页源码

    查看网页源代码的方法其实有好几种,最常用的我们就是在浏览器中直接选择“查看网页源代码”就可以了,但是在有些时候这种方法却不能见效,以下再介绍几种简单的方法供大家参考!
    2009-07-07

最新评论