微信小程序ajax请求后台数据

最近学习一下微信小程序,感觉小程序的小程序的功能还是相当强大的尤其是推出web-view标签可以直接将H5页面嵌入在微信小程序中,真是做到了一次开发,处处访问

但是由于微信小程序对个人小程序的限制,web-view标签,支付等功能不对个人用户开放,微信小程序是请求的服务器必须是https协议

现在简单说一下微信小程序如何请求数据的
可以参考文档

https://developers.weixin.qq.com/miniprogram/dev/api/

我的微信小程序已经上线,会持续更新,大家可以扫下面二维码关注一波,互相学习一下,我的微信在微信小程序里面有,大家有问题可以互相讨论一下谢谢
在这里插入图片描述
下面提供一个请求服务端的类,大家可以直接引用

function getSearchMusic(keyword,pageindex, callbackcount,url, callback) {
  wx.request({
    url:url,
    data: {
      g_tk: 5381,
      uin: 0,
      format: 'json',
      inCharset: 'utf-8',
      outCharset: 'utf-8',
      notice: 0,
      platform: 'h5',
      needNewCode: 1,
      w: keyword,
      zhidaqu: 1,
      catZhida: 1,
      t: 0,
      flag: 1,
      ie: 'utf-8',
      sem: 1,
      aggr: 0,
      perpage: 20,
      n: callbackcount,  //返回数据的个数
      p: pageindex,
      remoteplace: 'txt.mqq.all',
      _: Date.now(),
      key:'b083d9eabad077c4a9d655591c5a1de2'
    },
    method: 'GET',
    header: { 'content-Type': 'application/json' },
    success: function (res) {
      if (res.statusCode == 200) {
        callback(res.data);
      }
    }
  })
}

module.exports = {
  getSearchMusic: getSearchMusic
}

使用:

var util = require('../../../../util/utilHttp.js')
Page({
  data: {
    searchKeyword: '',  //需要搜索的字符
    searchSongList: [], //放置返回数据的数组
    isFromSearch: true,   // 用于判断searchSongList数组是不是空数组,默认true,空的数组
    searchPageNum: 1,   // 设置加载的第几次,默认是第一次
    callbackcount: 5,      //返回数据的个数
    searchLoading: false, //"上拉加载"的变量,默认false,隐藏
    searchLoadingComplete: false,  //“没有数据”的变量,默认false,隐藏
    xhTypeArr: ["文本笑话", "笑图","图文笑话"]// 笑话种类
  },

  // 加载的时候加载数据
  onLoad: function (e) {
    console.log("页面加载时间执行了");
    this.fetchSearchList();
  },

  // 点击搜索的时候触发相关的事件


  // 点击图片可以进行预览的操作

  preview:function(event){
    console.log("点击事件执行了");

    var srcs= new Array();
    var src = event.target.dataset.src;
    srcs[0] = src;
    wx.previewImage({
      current: src, // 当前显示图片的http链接 
      urls: srcs,
    })
  },

  // 获取开始页面的数据
  getIndexPageNum:function(e){
      this.setData({
        searchPageNum:e.detail.value
      })


  },


  // 获取结束页面的数据


  queryByPageNum:function(){
    console.log("点击事件触发了");
    this.fetchSearchList();
  },

  //输入框事件,每输入一个字符,就会触发一次
  bindKeywordInput: function (e) {
    console.log("输入框事件")
    this.setData({
      searchKeyword: e.detail.value
    })
  },
  //搜索,访问网络
  fetchSearchList: function () {
    let that = this;
    let searchKeyword = that.data.searchKeyword,//输入框字符串作为参数
      searchPageNum = that.data.searchPageNum,//把第几次加载次数作为参数
      callbackcount = that.data.callbackcount; //返回数据的个数
    // 根据传参不同请求不同类型接口
      let url ;
      url = 'https://way.jd.com/showapi/dtgxt?page=' + searchPageNum + '&maxResult=5&appkey=4deac241a66f8eb3e6ccb43b79737728&key=b083d9eabad077c4a9d655591c5a1de2';
    


    //访问网络
    util.getSearchMusic(searchKeyword, searchPageNum, callbackcount,url, function (data) {
      console.log(data)
      console.log(data.code);
      console.log(data.result);
      console.log(data.result.showapi_res_body.contentlist);
      //判断是否有数据,有则取数据
      if (data.msg =='查询成功') {
        let searchList = [];
        //如果isFromSearch是true从data中取出数据,否则先从原来的数据继续添加
      

        searchList = data.result.showapi_res_body.contentlist;
        console.log(searchList);
        that.setData({
          searchSongList: searchList, //获取数据数组
          zhida: data.msg, //存放歌手属性的对象
          searchLoading: true   //把"上拉加载"的变量设为false,显示
        });
        //没有数据了,把“没有数据”显示,把“上拉加载”隐藏
      } else {
        that.setData({
          searchLoadingComplete: true, //把“没有数据”设为true,显示
          searchLoading: false  //把"上拉加载"的变量设为false,隐藏
        });
      }
    })
  },
 
  //点击搜索按钮,触发事件
  keywordSearch: function (e) {
    this.setData({
      searchPageNum: 1,   //第一次加载,设置1
      searchSongList: [],  //放置返回数据的数组,设为空
      isFromSearch: true,  //第一次加载,设置true
      searchLoading: true,  //把"上拉加载"的变量设为true,显示
      searchLoadingComplete: false ,//把“没有数据”设为false,隐藏
      index: e.detail.value
    })
    this.fetchSearchList(e);
  },
  //滚动到底部触发事件
  searchScrollLower: function () {

    console.log("加载数据的事件执行了");
    let that = this;
    if (that.data.searchLoading && !that.data.searchLoadingComplete) {
      that.setData({
        searchPageNum: that.data.searchPageNum + 1,  //每次触发上拉事件,把searchPageNum+1
        isFromSearch: false , //触发到上拉事件,把isFromSearch设为为false
      });
      that.fetchSearchList();
    }
  }
})