애플릿의 백엔드 인터페이스를 올바르게 호출하는 방법

작성:

최근 백엔드 인터페이스 요청 방법을 배울 때 원래 프로젝트에 사용되는 인터페이스를 요청하려고 했는데 위챗 애플릿이 허용하지 않았습니다. 공식적인 알림은 인터페이스에 도메인 이름이 있어야 하고 등록되어야 하지만 우리 인터페이스는 모두 IP 주소이므로 이에 대해 할 수 있는 일이 없다는 것입니다.

그러나 좌절할 필요는 없습니다. 참고할 수 있도록 공식 요청 인터페이스 방법을 공유해 보겠습니다.

1. 공식적인 방법

이 방법은 간단하고 이해하기 쉽지만, 사용하면 코드의 양이 너무 많아 캡슐화하는 것이 좋습니다.

wx.request({
  url: 'test.php', // 仅为示例，并非真实的接口地址
  data: {
    x: '',
    y: ''
  },
  header: {
    'content-type': 'application/json' // 默认值
  },
  success(res) {
    console.log(res.data)
  }
})

2. 요청 메소드 캡슐화(새 폴더 util, 도구 파일 생성, 폴더 아래에 request.js 파일 생성, 메소드 캡슐화에 사용) request.js는 다음과 같습니다.

var app = getApp();
//项目URL相同部分，减轻代码量，同时方便项目迁移
//这里因为我是本地调试，所以host不规范，实际上应该是你备案的域名信息
var host = 'http://localhost:8081/demo/';

/**
 * POST请求，
 * URL：接口
 * postData：参数，json类型
 * doSuccess：成功的回调函数
 * doFail：失败的回调函数
 */
function request(url, postData, doSuccess, doFail) {
  wx.request({
    //项目的真正接口，通过字符串拼接方式实现
    url: host + url,
    header: {
      "content-type": "application/json;charset=UTF-8"
    },
    data: postData,
    method: 'POST',
    success: function (res) {
      //参数值为res.data,直接将返回的数据传入
      doSuccess(res.data);
    },
    fail: function () {
      doFail();
    },
  })
}

//GET请求，不需传参，直接URL调用，
function getData(url, doSuccess, doFail) {
  wx.request({
    url: host + url,
    header: {
      "content-type": "application/json;charset=UTF-8"
    },
    method: 'GET',
    success: function (res) {
      doSuccess(res.data);
    },
    fail: function () {
      doFail();
    },
  })
}

/**
 * module.exports用来导出代码
 * js文件中通过var call = require("../util/request.js")  加载
 * 在引入引入文件的时候"  "里面的内容通过../../../这种类型，小程序的编译器会自动提示，因为你可能
 * 项目目录不止一级，不同的js文件对应的工具类的位置不一样
 */
module.exports.request = request;
module.exports.getData = getData;

(동영상 공유 학습: 소개 to 프로그래밍 )

3. 페이지에 폴더를 생성하고, 4가지 종류의 파일을 생성하고, js에

1 //引入代码
 2 var call = require("../util/request.js")
 3 
 4 Page({
 5   data: {
 6     pictureList: [],
 7   },
 8   
 9   onLoad: function () {
10     var that = this;
11     //调用封装的方法，为了方便我直接在页面加载的时候执行这个方法
12     call.getData('lunbo.do', this.shuffleSuc, this.fail);
15   },
16   shuffleSuc: function (data) {
17     var that = this;
18     that.setData({
19       pictureList: data.rows
20     })
21     //我后面测试了一下，直接this.setData也可以，但是因为我在没有使用封装方法的时候
22     //this.setData报过错，不能直接用this，所以我在赋值的时候一般都会加上var that = this;
23     //这句话算是一个不是习惯的习惯
24   },
25   fail: function () {
26     console.log("失败")
27   },
28 })

를 추가한 후 페이지에 콜백 함수를 작성하면, 이를 통해 호출합니다. that.setData 메소드가 작동하는지 확인하기 위해서입니다.

관련 추천: 미니 프로그램 개발 튜토리얼

위 내용은 애플릿의 백엔드 인터페이스를 올바르게 호출하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!