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, '请求失败')
            }
      })
Logo

华为开发者空间,是为全球开发者打造的专属开发空间,汇聚了华为优质开发资源及工具,致力于让每一位开发者拥有一台云主机,基于华为根生态开发、创新。

更多推荐