Vue发送Get 和 Post 请求以及获取数据

Vue发送Get 和 Post 请求

注意以下代码是请求处理request.js

request.js

url：请求服务器路径；value：需要发送给服务器的数据；method：请求方式；options的使用：导出Excel
export(data) {
return request(‘export’, data, ‘post’, {
responseType: ‘blob’
})
}
export(data) {
return request(‘export’, data, ‘get’, {
responseType: ‘blob’
})
}

// 适配器, 用于适配不同的请求方式, 默认请求方式为post请求
export const baseRequest = (url, value = {
   }, method = 'post', options = {
   }) => {
   
    // 拼接请求后端服务器接口的完整路径
    url = sysConfig.API_URL + url
    console.log(url)
    // 对 post、get 等方式进行分别处理
    if (method === 'post') {
   
       return service.post(url, value, options)
    } else if (method === 'get') {
   
       return service.get(url, {
    params: value, ...options })
    } else if (method === 'formdata') {
   
       // form-data表单提交的方式
       return service.post(url, qs.stringify(value), {
   
          headers: {
   
             'Content-Type': 'multipart/form-data'
          },
          ...options
       })
    } else {
   
       // 其他请求方式，例如：put、delete
       return service({
   
          method: method,
          url: url,
          data: value,
          ...options
       })
    }
} 

const service = axios.create({
   
    baseURL: '/api', // api base_url
    timeout: sysConfig.TIMEOUT // 请求超时时间
})  

// HTTP response 拦截器
service.interceptors.response.use(
    (response) => {
   
       // 配置了blob，不处理直接返回文件流
       if (response.config.responseType === 'blob') {
   
          if (response.status === 200) {
   
             return response
          } else {
   
             message.warning('文件下载失败或此文件不存在')
             return
          }
       }
       const data = response.data
       const code = data.code
       if (reloadCodes.includes(code)) {
   
          if (!loginBack.value) {
   
             error()
          }
          return
       }
       if (code !== 200) {
   
          const customErrorMessage = response.config.customErrorMessage
          message.error(customErrorMessage || data.msg)
          return Promise.reject(data)
          // 自定义错误提示，覆盖后端返回的message
          // 使用示例：
          // export function customerList (data) {
   
          //   return request('list', data, 'get', {
   
          //     customErrorMessage: '自定义错误消息提示'
          //   });
          // }
       } else {
   
          // 统一成功提示
          const responseUrl = response.config.url
          // 如果访问路径包含（注意是包含，不是一定得是这个单词&#