axios.js 2.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104
  1. import axios from 'axios'
  2. import {
  3. getToken
  4. } from '@/libs/auth'
  5. import loading from '@/libs/loading'
  6. import {
  7. Notify
  8. } from 'quasar'
  9. // 创建一个错误
  10. function errorCreate (msg) {
  11. const error = new Error(msg)
  12. errorLog(error)
  13. throw error
  14. }
  15. // 记录和显示错误
  16. function errorLog (error) {
  17. // 打印到控制台
  18. if (process.env.ENV === 'development') {
  19. console.log('>>>>>> Error >>>>>>', error)
  20. }
  21. // 显示提示
  22. Notify.create({
  23. message: error.message
  24. })
  25. }
  26. // 创建一个 axios 实例
  27. const service = axios.create({
  28. baseURL: process.env.API, // api的base_url
  29. timeout: 20000 // request timeout
  30. })
  31. // 请求拦截器
  32. service.interceptors.request.use(
  33. config => {
  34. // 在请求发送之前做一些处理
  35. loading.show(config)
  36. const token = getToken()
  37. // 让每个请求携带token-- ['Authorization']为自定义key 请根据实际情况自行修改
  38. if (token) {
  39. config.headers['Authorization'] = 'Bearer ' + token
  40. }
  41. return config
  42. },
  43. error => {
  44. // 发送失败
  45. console.log('error:发送失败,', error)
  46. Promise.reject(error)
  47. }
  48. )
  49. // 响应拦截器
  50. service.interceptors.response.use(
  51. response => {
  52. // dataAxios 是 axios 返回数据中的 data
  53. const dataAxios = response.data
  54. // 这个状态码是和后端约定的
  55. const { code } = dataAxios
  56. // 根据 code 进行判断
  57. if (code === undefined) {
  58. // 如果没有 code 代表这不是项目后端开发的接口 比如可能是 D2Admin 请求最新版本
  59. return dataAxios
  60. } else {
  61. // 有 code 代表这是一个后端接口 可以进行进一步的判断
  62. switch (code) {
  63. case 0:
  64. // [ 示例 ] code === 0 代表没有错误
  65. return dataAxios.data
  66. case 'xxx':
  67. // [ 示例 ] 其它和后台约定的 code
  68. errorCreate(`[ code: xxx ] ${dataAxios.msg}: ${response.config.url}`)
  69. break
  70. default:
  71. // 不是正确的 code
  72. errorCreate(`${dataAxios.msg}: ${response.config.url}`)
  73. break
  74. }
  75. }
  76. },
  77. error => {
  78. if (error && error.response) {
  79. switch (error.response.status) {
  80. case 400: error.message = '请求错误'; break
  81. case 401: error.message = '未授权,请登录'; break
  82. case 403: error.message = '拒绝访问'; break
  83. case 404: error.message = `请求地址出错: ${error.response.config.url}`; break
  84. case 408: error.message = '请求超时'; break
  85. case 500: error.message = '服务器内部错误'; break
  86. case 501: error.message = '服务未实现'; break
  87. case 502: error.message = '网关错误'; break
  88. case 503: error.message = '服务不可用'; break
  89. case 504: error.message = '网关超时'; break
  90. case 505: error.message = 'HTTP版本不受支持'; break
  91. default: break
  92. }
  93. }
  94. errorLog(error)
  95. return Promise.reject(error)
  96. }
  97. )
  98. export default service