需要自行安装axios 这个包
一、程序目录入下图
其中
api 放接口文件。
config 放配置文件
util 放 dd.httpRequest 封装
二、文件及主要代码
api 下新增一个index.js文件,一个model目录
--------------------------------------------------index.js文件
const files = require.context('./model', false, /\.js$/)
const modules = {}
files.keys().forEach((key) => {
modules[key.replace(/(\.\/|\.js)/g, '')] = files(key)
})
export default modules
--------------------------------------------------index.js文件
config 下新增一个config文件
--------------------------------------------------config.js文件
export default {
TIMEOUT: 5000,
ServerUrl: "https://XXXXXXXXX",
TOKEN_NAME: 'Authorization',
}
--------------------------------------------------config.js文件
util 下新建一个request.js 文件
--------------------------------------------------request.js文件
import axios from 'axios';
//导入配置文件
import configT from '/config/config';
//拦截request增加header参数
axios.interceptors.request.use(
(config) => {
config.headers['ContentType'] = "application/json";
config.headers[configT.TOKEN_NAME] =dd.getStorageSync({ key: "TOKEN" });
return config;
}
);
// HTTP response 拦截器
axios.interceptors.response.use(
(response) => {
dd.hideLoading()
return response;
},
(error) => {
if (error.response) {
dd.hideLoading()
//可以自行添加多种拦截
if (error.response.status == 404) {
dd.confirm({
title: '错误',
content: 'Status:404,正在请求不存在的服务器记录!',
})
console.log("Status:404,正在请求不存在的服务器记录!");
} else {
dd.confirm({
title: '错误',
content: "请求服务器无响应!",
})
}
return Promise.reject(error.response);
}
);
//修改适配器,用钉钉的httpRequest
axios.defaults.adapter = function (config) {
return new Promise((resolve, reject) => {
var settle = require('axios/lib/core/settle');
var buildURL = require('axios/lib/helpers/buildURL');
config.headers.dataType = 'application/json';
dd.httpRequest({
method: config.method.toUpperCase(),
url: buildURL(config.url, config.params, config.paramsSerializer),
headers: config.headers,
data: config.data,
sslVerify: config.sslVerify,
complete: (response) => {
response = {
data: response.data,
status: response.statusCode,
errMsg: response.errMsg,
header: response.header,
config: config
};
settle(resolve, reject, response);
}
})
})
}
//篇幅影响就列出一个get请求
var http = {
/** get 请求*/
get: function (url, params = {}, config = {}) {
return new Promise((resolve, reject) => {
axios({
method: 'get',
url: url,
params: params,
...config
}).then((response) => {
resolve(response.data);
}).catch((error) => {
reject(error);
})
})
},
}
export default http;
在api /model 目录下新增一个接口文件auth.js 用于授权
--------------------------------------------------auth.js文件
import http from '/util/request.js';
import config from '/config/config';
export default {
login: {
url: `${config.ServerUrl}/login`,
name: "登录获取TOKEN",
post: async function (data = {}) {
return await http.post(this.url, data);
}
}
logout: {
url: `${config.ServerUrl}/logout`,
name: "退出",
post: async function (data = {}) {
return await http.post(this.url, data);
}
}
}
--------------------------------------------------auth.js文件
三、应用
在需要登录的界面
import API from '/api/index'; // 载入相对路径
Page({
...
async login() {
var res = await API.auth.login.post({
username: this.data.username,
password: this.data.password,
});
dd.setStorageSync({
key: 'user',
data: res.result
})
...
})