request.js 5.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193
  1. import axios from 'axios'
  2. import { MessageBox, Message } from 'element-ui'
  3. import store from '@/store'
  4. import { getToken } from '@/utils/auth'
  5. var moduleId = ''
  6. export function setModuleId(val) {
  7. console.log(val)
  8. moduleId = val
  9. }
  10. // create an axios instance
  11. const service = axios.create({
  12. baseURL: process.env.VUE_APP_BASE_API, // url = base url + request url
  13. // withCredentials: true, // send cookies when cross-domain requests
  14. timeout: 300000 // request timeout
  15. })
  16. const whiteCodes = [200, 201, 4444]
  17. // request interceptor
  18. service.interceptors.request.use(
  19. config => {
  20. // do something before request is sent
  21. if (store.getters.token) {
  22. // let each request carry token
  23. // ['X-Token'] is a custom headers key
  24. // please modify it according to the actual situation
  25. config.headers['x-token'] = getToken()
  26. config.headers['moduleId'] = moduleId
  27. }
  28. return config
  29. },
  30. error => {
  31. // do something with request error
  32. console.log(error) // for debug
  33. return Promise.reject(error)
  34. }
  35. )
  36. // response interceptor
  37. service.interceptors.response.use(
  38. /**
  39. * If you want to get http information such as headers or status
  40. * Please return response => response
  41. */
  42. /**
  43. * Determine the request status by custom code
  44. * Here is just an example
  45. * You can also judge the status by HTTP Status Code
  46. */ response => {
  47. const res = response.data
  48. // if the custom code is not 20000, it is judged as an error.
  49. if (whiteCodes.indexOf(res.code) < 0) {
  50. Message({
  51. message: res.message || 'Error',
  52. type: 'error',
  53. duration: 5 * 1000
  54. })
  55. // 50008: Illegal token; 50012: Other clients logged in; 50014: Token expired;
  56. if (res.code === 1001) {
  57. // to re-login
  58. MessageBox.confirm('登录失效,您可以取消停留在此页面,或重新登录', '登录失效', {
  59. confirmButtonText: '重新登录',
  60. cancelButtonText: '取消',
  61. type: 'warning'
  62. }).then(() => {
  63. store.dispatch('user/resetToken').then(() => {
  64. location.reload()
  65. })
  66. })
  67. }
  68. return Promise.reject(new Error(res.message || 'Error'))
  69. } else {
  70. return res
  71. }
  72. },
  73. error => {
  74. console.log('err' + error) // for debug
  75. Message({
  76. message: error.message,
  77. type: 'error',
  78. duration: 5 * 1000
  79. })
  80. return Promise.reject(error)
  81. }
  82. )
  83. export default service
  84. // post方式导出文件
  85. export function postBlob(data) {
  86. return new Promise(function (r, j) {
  87. axios({
  88. method: 'post',
  89. url: process.env.VUE_APP_BASE_API + data.url, // 后端接口地址
  90. responseType: 'blob', // bolb格式的请求方式
  91. headers: {
  92. moduleId,
  93. 'x-token': getToken() // 请求头
  94. },
  95. data: data.data // 需要传给后端的请求参数体
  96. })
  97. .then(res => {
  98. const BLOB = res.data
  99. const fileReader = new FileReader()
  100. fileReader.readAsDataURL(BLOB) // 对请求返回的文件进行处理
  101. fileReader.onload = e => {
  102. const a = document.createElement('a')
  103. a.download = data.name
  104. a.href = e.target.result
  105. document.body.appendChild(a)
  106. a.click()
  107. document.body.removeChild(a)
  108. }
  109. r()
  110. })
  111. .catch(err => {
  112. console.log(err.message)
  113. j()
  114. })
  115. })
  116. }
  117. // get方式导出文件
  118. export function getBlob(data) {
  119. return new Promise(function (r, j) {
  120. axios({
  121. url: process.env.VUE_APP_BASE_API + data.url,
  122. method: 'get',
  123. responseType: 'blob',
  124. params: data.data, // 与post传参方式不同之处
  125. headers: {
  126. moduleId,
  127. 'x-token': getToken() // 请求头
  128. }
  129. })
  130. .then(res => {
  131. var blob = new Blob([res.data], {
  132. type: 'application/vnd.openxmlformats-officedocument.wordprocessingml.document;charset=utf-8'
  133. })
  134. var filename = data.name + '.xlsx'
  135. var downloadElement = document.createElement('a')
  136. var href = window.URL.createObjectURL(blob) // 创建下载的链接
  137. downloadElement.style.display = 'none'
  138. downloadElement.href = href
  139. downloadElement.download = filename // 下载后文件名
  140. document.body.appendChild(downloadElement)
  141. downloadElement.click() // 点击下载
  142. document.body.removeChild(downloadElement) // 下载完成移除元素
  143. window.URL.revokeObjectURL(href) // 释放掉blob对象
  144. r()
  145. })
  146. .catch(err => {
  147. console.log(err.message)
  148. j()
  149. })
  150. })
  151. }
  152. /**
  153. * 导入功能
  154. * @param {*} url
  155. * @param {*} formData
  156. * @param {*} id
  157. */
  158. export async function handleImport(url, formData, id = '') {
  159. return await new Promise((resolve, reject) => {
  160. axios
  161. .post(process.env.VUE_APP_BASE_API + url, formData, {
  162. headers: {
  163. moduleId,
  164. 'Content-Type': 'multipart/form-data',
  165. 'x-token': getToken(),
  166. id
  167. }
  168. })
  169. .then(res => {
  170. if (res.data.code !== 200) {
  171. reject(new Error(res.data.message || 'Error'))
  172. return
  173. }
  174. resolve(res.data)
  175. })
  176. .catch(err => {
  177. reject(err)
  178. })
  179. })
  180. }