1、新建一个api目录,与pages同级

2、在api目录下新建一个api.js文件

3、编写代码

const host = 'http://test.test.cn'
const wxRequest = function (params, url) {
wx.showToast({
title: '加载中...',
icon: 'loading'
})
wx.request({
url: url,
method: params.method || 'GET',
data: params.data || {},
header: {
'Content-Type': 'application/x-www-form-urlencoded;charset=utf-8'
},
success: function (res) {
params.success && params.success(res)
wx.hideToast()
},
fail: function (res) {
params.fail && params.fail(res)
},
complete: function (res) {
params.complete && params.complete(res)
}
})
} const bindCode = function (params) { wxRequest(params, host + '/AppPhone/Api') }
const startScan = function (params) { wxRequest(params, host + '/AppPhone/Api') }
const imgToservers = function (params) { wxRequest(params, host + '/AppPhone/Api/upload_files') } module.exports = {
bindCode,
startScan,
imgToservers
}

4、在js中调用

import api from '../../api/api.js'
Page({ /**
* 页面的初始数据
*/
data: {
shopCode: '',
deviceId: '',
}, /**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
var getShopInfo = wx.getStorageSync('shopInfo');
if (getShopInfo) {
this.setData({
shopCode: getShopInfo.shop_code,
deviceId: getShopInfo.device_id
})
}else{
wx.redirectTo({
url: '../bindnum/bindnum?type=1'
})
}
},
beginScan: function(){
var _that = this;
api.startScan({
method: 'POST',
data: {
shop_code: this.data.shopCode,
device_id: this.data.deviceId,
method: 'get_phone_scanner_id'
},
success: function(res){
console.log(res.data);
}
});
},
})

5、问题

一开始wx.request中header设置为

header: {
'content-type': 'application/json' // 默认值
},
导致接口调用时,报500

后面查找发现,终于找到了解决方案,将header设置为:
  header: {
'Content-Type': 'application/x-www-form-urlencoded;charset=utf-8'
},

就可以成功调用了

参考文章: wx.request发送与服务端接受

 

小程序封装wx.request,以及调用的更多相关文章

  1. 今天微信小程序发现wx.request不好使了,调试报错: 小程序要求的 TLS 版本必须大于等于 1.2

    今天微信小程序发现wx.request不好使了,调试报错: 小程序要求的 TLS 版本必须大于等于 1.2 查官方文档 解决方法 在 PowerShell中运行以下内容, 然后重启服务器 # Enab ...

  2. 小程序 之wx.request和wx.showModal简单封装

    一.request封装 request(url, data, successCallBack = function(data) {}, completeCallBack = function(data ...

  3. 微信小程序之wx.request:fail错误,真机预览请求无效问题解决,安卓,ios网络预览异常

    新版开发者工具增加了https检查功能:可使用此功能直接检查排查ssl协议版本问题: 可能原因:0:后台域名没有配置0.1:域名不支持https1:没有重启工具:2:域名没有备案,或是备案后不足24小 ...

  4. 微信小程序:wx.request之post请求后端无法获取数据的问题

    前言:小程序的开发中总是踩到各种坑,看文档也不知所云: 例如当我们在写微信小程序接口时,method请求方式有POST和GET两种,为了数据安全,我们会偏向于使用POST请求方式访问服务器端: 问题: ...

  5. 微信小程序请求wx.request数据,渲染到页面

    先说一下基本使用.官网也有. 比如说你在App.js里面有这些变量.想修改某些值. data: { main_view_bgcolor: "", border: "&qu ...

  6. mpvue 小程序 使用wx.request请求数据

    1.创建src下创建utils/wx-request.js const host = 'http://10.0.0.6:8081' function request (url, method, dat ...

  7. 微信小程序设置全局请求URL 封装wx.request请求

    app.js: App({ //设置全局请求URL globalData:{ URL: 'https://www.oyhdo.com', }, /** * 封装wx.request请求 * metho ...

  8. 以聚合数据免费接口为例,通过 Class 类继承方法,让小程序实现项目化接口调用

    微信小程序数据来源,是通过接口实现的.但接口如何调,数据如何取?每个人都有不同的方法,下面以聚合数据免费接口为例. 配置接口 config.js 聚合数据请求接口需要以key作为参数. const c ...

  9. 小程序封装一个ajax

    小程序中,我们一般习惯把提交接口请求的方法放在一个公共js里面.下面是一个简单实现. (1)我们把所有请求的地址都放在一个json里面 var postAddress = { "domin& ...

随机推荐

  1. windows上利用dhcpsrv搭建DHCP服务器

    起因是一个很奇葩的需求:乙方要远程升级仪器,用TeamViewer远程控制并ssh到仪器,但仪器内部IP地址没有写死,靠DHCP服务器获取.那么就要在PC建立DHCP服务器,用网线连接仪器,然后才能看 ...

  2. 一些DP上的奇奇怪怪的东西

    单调队列&单调栈: 有手就行.jpg 四边形不等式: 若\(w(i,j)\)满足\(\forall a\le b<c\le d,w(a,c)+w(b,d)\le w(b,c)+w(a,d ...

  3. [LeetCode] 203. 移除链表元素

    题目链接:https://leetcode-cn.com/problems/remove-linked-list-elements/ 题目描述: 删除链表中等于给定值 val 的所有节点. 示例: 输 ...

  4. Windows下spark1.6.0本地环境搭建

    由于spark是用scala编写的,且需要jdk的环境支撑,所以本地spark环境的搭建需要四个步骤:JDK的安装,scala的安装,hadoop的配置,spark的配置. 一.jdk的安装与环境变量 ...

  5. 分布式均匀算法--hash性一致算法--hash slot(转)

    目录 1.redis cluster介绍 2.最老土的hash算法和弊端(大量缓存重建) 3.一致性hash算法(自动缓存迁移)+虚拟节点(自动负载均衡) 不用遍历    -->   hash算 ...

  6. 内存分析工具MAT(Memory Analyzer Tool)从安装到使用

    一.安装 首先,你得有一个Eclipse(因为MAT是Eclipse的插件) 然后,你要在Eclipse上安装MAT,步骤如下: 1.点击Help,Install New Soft,就出现了以下Ins ...

  7. JavaEE高级-Spring学习笔记

    *Spring是什么? - Spring是一个开源框架 - Spring为简化企业级应用开发而生.使用Spring可以使简单的JavaBean实现以前只有EJB才能实现的功能 - Spring是一个I ...

  8. Web基础之http协议

    第6章 Web基础之http协议 第6章 Web基础之http协议一.http协议介绍 1.1)什么是超文本 1.2)什么是URL 1.3)什么是超文本传输协议二.访问网站分析三.页面请求信息解析(仅 ...

  9. 基于tcp和udp协议的套接字

    socket:是在应用层和传输层之间的一个抽象层,它把TCP/IP层的复杂的操作封装抽象,并提供一些接口供应用层调用 套接字:被设计用于同一台主机上多个应用程序之间的通信,被称为进程之间通信或IPC ...

  10. Uva 10635 - Prince and Princess LCS/LIS

    两个长度分别为p+1和q+1的由1到n2之前的整数组成的序列,每个序列的元素各不相等,两个序列第一个元素均为1.求两个序列的最长公共子序列 https://uva.onlinejudge.org/in ...