axios的封装+添加请求头签名+md5加密
axios的封装+添加请求头签名+md5加密
·
1 . http文件夹下面创建index.js和api.js
2.index.js
import axios from 'axios'
import md5 from 'js-md5'
// 导入nanoid库 生成随机数
import { nanoid } from 'nanoid'
// axios.defaults.baseURL = 'http://192.168.1.89:8025/'
// //设置请求头
// 创建一个拥有通用配置的axios实例
axios.create({
// 创建一个拥有通用配置的axios实例
timeout: 1000 * 30, // 请求超时时间(毫秒)
withCredentials: true, // 是否携带cookie信息
headers: { // 头部信息
'Content-Type': 'application/json; charset=utf-8'
}
})
axios.interceptors.request.use(config => {
// 添加一个请求拦截器
// 请求头带上token在发送请求之前做某事
let timesTamp = new Date().getTime()
// appId appSecret 这两个是后端给的 类似于密钥
let appId = '00e55be8-a2c7-428e-882a-3d9f8f84c60a'
let appSecret = '020e940c-ac98-47a4-9074-2572af5724d3'
let nonce = nanoid()
config.headers.sign = md5(appId + appSecret + timesTamp + nonce)
config.headers.appId = appId
config.headers.timesTamp = timesTamp
config.headers.appSecret = appSecret
config.headers.nonce = nonce
return config
}, error => {
return Promise.reject(error)
})
export function postApi (url, data) {
return axios.post(url, data)
}
export function getApi (url, data) {
return axios.get(url, data)
}
3. api.js
// 封装后台接口方法
import { getApi, postApi } from './index'
export const getInfoApi = (params) => postApi('/api/cbecElist/getInfo', params)
// 进口清单
export const getImportList = (params) => postApi('/api/cbecElist/getInfo', params)
// 出口清单
export const getExportList = (params) => postApi('/api/cbeeElist/getInfo', params)
// 进口快件
export const getImportExpress = (params) => postApi('/api/importEntryHead/getInfo', params)
4. 页面使用
getImportList(data.query).then((res) => {
if (res.data.code !== 200) {
console.log(res, '进口清单数据')
} else {
console.log(res, '请求失败')
}
})
更多推荐
已为社区贡献2条内容
所有评论(0)