microvideo-request

microvideo-request

研发人: 朱琦

研发日期: 2022/1/10

简介

microvideo-request 插件是基于 axios，qs 开发的请求封装，可以支持多服务域名请求

快速使用

安装

npm i microvideo-request

引入

初始化配置 vue main.js 为例

import { setRequestConfig, setInterceptor } from 'microvideo-request'

/**
 * 初始化 配置
 * @param {Object} config      初始配置
 * @param {Object} services 多个服务域名配置
 * */
setRequestConfig(
  // config 初始配置 可设置baseUrl timeout headers
  {
    baseURL: process.env.VUE_APP_BASE_API,
    timeout: 60000, // 非必传 接口超时时间设置, 默认 60000ms
    headers: {}, // 非必传 请求头
    successStatus: [301, 302], // 非必传 请求成功状态码, 默认 2xx 都为成功状态码，可额外配置
  },
  // services 多个服务域名配置, 可不传 不传时config.baseURL 为必传
  [
    {
      // 默认服务域名 第一个
      name: 'BASE_SERVER',
      url: process.env.VUE_APP_BASE_API
    },
    {
      // 其他服务域名
      name: 'JTQG_SERVER',
      url: process.env.VUE_APP_JTQG_SERVER_BASE_API
    },
  ]
)

若后续需要设置 headers 可再次调用 setRequestConfig(config)

使用

import { createRequest } from 'microvideo-request'

/**
  * 实例1
  * */
getList (params) {
  return createRequest().setParameters(params).get('/event/list')
}

/**
  * 实例2
  * 用setAxios请求
  * 传参方法遵循 axios
  * */
getList (params) {
  return createRequest().setAxios({
    url: '/event/listForJtqg',
    method: 'get',
    params
  })
}

使用方法详解

• createRequest()

  创建请求类，传参为空时 使用默认服务域名

  createRequest()
  // 等同于
  createRequest('BASE_SERVER')
  

• 设置当前 请求超时 时间

  createRequest('BASE_SERVER',timeout)
  

• setParameters(object) 传参

  createRequest().setParameters(object)
  

• add() 添加参数

  createRequest().add('key','value')
  

• get() GET 请求

  createRequest().add('key','value').get(url)
  <!-- 修改单个请求的headers 其余请求类型同理 -->
  createRequest().add('key','value').get(url, {
    headers:{
      userId: xxx
    }
  })
  

• post() POST 请求

  默认 application/json

  createRequest().setParameters(object).post(url)
  

• post() POST 请求 setParameters(object,'formdata')

  请求类型为 multipart/form-data 传参一定要是个对象，不能是 formData 类型

  createRequest().setParameters(object,'formdata').post(url)
  

• post() POST 请求 setParameters(object,'urlencoded')

  请求类型为 application/x-www-form-urlencoded

  createRequest().setParameters(object,'urlencoded').post(url)
  

• delete() DELETE 请求

  createRequest().setParameters(object).delete(url)
  

• delete() DELETE 请求 setParameters(object,'urlencoded')

  请求类型为 application/x-www-form-urlencoded

  createRequest().setParameters(object,'urlencoded').delete(url)
  

• put() PUT 请求

  createRequest().setParameters(object).put(url)
  

• url 拼接参数

  createRequest().setParameters({id:123, type:0}).get(url/{id}/{type})
  

• file() 下载文件流

  createRequest().setParameters(object).file(url, config)
  

config [Object] 配置

config	类型	说明
fileType	String	下载文件类型
fileName	String	下载文件名

关于 fileType 文件类型，可取值：

拓展名	文件类型	fileType
.jpg 、.jpeg	JPEG 图片	image/jpeg
.png	PNG 图片	image/png
.json	JSON 格式	application/json
.pdf	PDF	application/pdf
.ppt	Microsoft PowerPoint	application/vnd.ms-powerpoint
.xls	Microsoft Excel	application/vnd.ms-excel
.zip	ZIP	application/zip
.rar	RAR 存档	application/x-rar-compressed

• fileUrl() 获取 url 链接

createRequest().setParameters(object).fileUrl(url, openUrl)

openUrl [Boolean] 是否打开 url 默认为 true

为 true 时，会直接通过 window.open(href) 打开连接 为 false 时，可以通过 then 回调获取 url

方法

setRequestConfig(config, services) 设置请求配置

• config [Object] 请求基础配置

config	类型	说明
baseURL	String	默认服务域名
timeout	Number	接口超时时间设置 非必传
headers	Object	请求头 非必传

• services [Object] 请求多服务域名配置

[{
    name: "BASE_SERVER",
    url: process.env.VUE_APP_BASE_API
 },
 {
    name: "JTQG_SERVER",
    url: process.env.VUE_APP_JTQG_SERVER_BASE_API
 },
 ...
]

createRequest(servicesName, timeout) 创建请求类

• servicesName [String] 服务名

• timeout [Number] 超时时间

setInterceptor(fun, type) 拦截器

• fun [Function] 拦截器触发的回调函数

fun(res)

• res： 当前状态返回信息

• type [String] 拦截器类型

type	类型	说明
SUCCESS	String	请求成功时
ERROR	String	请求失败时
BEFORE	String	请求之前时