为了账号安全,请及时绑定邮箱和手机立即绑定

小程序请求网络数据json数据

标签:
WebApp

上一节带领大家实现了本地json数据的解析,但是我们做小程序肯定不是想要本地死的数据,所以这一节来教大家怎么获取网络json数据。

本节知识点

  • 1,小程序后台配置服务器域名

  • 2,小程序wx.request发起网络请求

一,配置网络请求的服务器域名

我们用小程序请求网络数据,需要先在小程序后台配置服务器域名


webp

找到服务器域名配置

webp

配置域名

30paotui.com是我为大家学习小程序专门做的后台数据接口,大家只需要按照上面步骤配置好服务器域名。

二,小程序网络请求

还是先看官方文档和官方示例
https://developers.weixin.qq.com/miniprogram/dev/api/network/request/wx.request.html

webp

官方文档


可以看出我们做基本的网络请求时,需要url,data,header,success。通过下图我们可以看到做网络请求时只有url是必须的。

webp

必填的只有url


看完官方文档,我们就来正式的实现自己小程序的网络请求了。

所需参数参数值(获取网络数据用)
urlhttps://30paotui.com/article/list

我们只需要在上一节代码的基础上做以下改动就可以了。

上一节课程链接

// home.js//引入本地json数据,这里引入的就是第一步定义的json数据var jsonData = require('../../data/json.js');
Page({ data: {}, //把上一节解析本地json数据的代码注释掉
 // //我们在这里加载本地json数据
 // onLoad: function() {
 //  this.setData({
 //   //jsonData.dataList获取json.js里定义的json数据,并赋值给dataList
 //   dataList: jsonData.dataList
 //  });
 // },

 //小程序的生命周期函数
 onLoad() {  this.getHomeList(); //调用网络请求的方法:getHomeList
 }, //获取网络数据
 getHomeList() {
  wx.request({   url: "https://30paotui.com/article/list",   success: function(res) { //请求成功
    console.log(res);//在调试器里打印网络请求到的json数据
   },   fail: function(res) { // 请求失败
   }
  })
 }
})

可以看到我们home.js里的getHomeList方法就是用来获取网络数据用的。只有简单的几行代码,我们就可以获取到网络数据了,不信点击编译看下调试器里打印的log,如下图


webp

获取到的网络数据

到这里我们就轻松的获取到网络数据了,是不是很简单。



作者:java小石头
链接:https://www.jianshu.com/p/7bb5ed87033f


点击查看更多内容
TA 点赞

若觉得本文不错,就分享一下吧!

评论

作者其他优质文章

正在加载中
JAVA开发工程师
手记
粉丝
205
获赞与收藏
1010

关注作者,订阅最新文章

阅读免费教程

  • 推荐
  • 评论
  • 收藏
  • 共同学习,写下你的评论
感谢您的支持,我会继续努力的~
扫码打赏,你说多少就多少
赞赏金额会直接到老师账户
支付方式
打开微信扫一扫,即可进行扫码打赏哦
今天注册有机会得

100积分直接送

付费专栏免费学

大额优惠券免费领

立即参与 放弃机会
意见反馈 帮助中心 APP下载
官方微信

举报

0/150
提交
取消