小程序接口访问(先来个get 等我用到post再补充)

1.在项目根目录下,新建一个request文件夹

2.在request文件夹中新一个一个request.js文件用于封装wxrequest方法

//这个页面就是封装了requsst什么都不用动,放着就行

//单纯把wx.request 封装

function request(params) {
  //promise 解决 异步编程运行顺序的问题
  return new Promise(function (resolve,reject) {
    wx.request({
      url:params.url,
      data:params.data || {},
      header:params.header || {},
      method:params.method || "GET",
      dataType:"json",
      success(res){
        resolve(res.data)
      },
      fail(err){
        reject(err)
      }
    })
  })
}

module.exports = {
  req:request
}

3.在request文件夹中新一个api.js文件用于设置url服务,设置接口路径,开发接口


//开发服务器
let url = "http://kumanxuan1.f3322.net:8001/";
//测试服务器
//let url = "http://www.ceshi.com";
//上线服务器
//let url = "http://www.dashanpao.com";

//设置每一个接口的路径
// const 自己命名的api名=url+'后端给的接口名'
const indexApi=url+'/index/index';


// 将接口开放出去,给fetch.js引用
module.exports = {
  // newApi
  indexApi
}

4.在request文件夹中新建一个fetch.js

// 这个页面中的内容也不用管

let api = require("./api.js");
let request = require("./request.js");

//整合 路径 和 请求函数
function getIndex() {
  return request.req({
    url:api.indexApi
  })
}

// 将请求函数开放出去
module.exports = {
  // getNew
  getIndex
}

5.使用接口函数

// index.js
// ========================================================引入接口文件
const fetch = require("../../request/fetch.js"); 

Page({
  data: {

  },
  // 事件处理函数

  onLoad() {
    // ==================================================使用getIndex()方法
    fetch.getIndex().then(res=>{
      console.log(res);
    })

  },


})

6.成功展示:

如果不好使请 点击详情,勾选不校验合法域名

7.这回真的成功了

在get请求中传入参数

1.在fetch.js文件中封装的请求中添加 data:params

// 这个页面中的内容也不用管

let api = require("./api.js");
let request = require("./request.js");

//整合 路径 和 请求函数
function getIndex() {
  return request.req({
    url:api.indexApi,
   
  })
}

// 3.--------------------写一个请求方法
function getTopicList(params){
  return request.req({
 url:api.topiclistApi,
//  要传参数的请求可以加上data:params++++++++++++
 data:params
// +++++++++++++++++看这里+++++++++++++++++++++++++++
})
}

//4.----------------------- 将请求函数开放出去
module.exports = {
  // getNew
  getIndex,
  getTopicList

}

2.在要使用请求的js文件中的请求方法中写入{键:值,键:值}

 

// pages/topic/topic.js
const fetch = require("../../request/fetch.js");
Page({

  /**
   * 页面的初始数据
   */
  data: {

  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    this.getTabBar().setData({
      active: 1,
      })
    //  在请求方法中可添加要发送给接口的数据===================
      fetch.getTopicList({page:1,size:5}).then(res=>{
        // =========================看这里========================
        console.log(res);
      })


  },
})

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值