http.js 5.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218
  1. import axios from 'axios'
  2. import qs from 'qs'
  3. import _ from 'lodash'
  4. import { Message } from 'element-ui'
  5. /**
  6. * 统一进行异常输出
  7. * 如果异常只是弹框显示即可,可使用该实例
  8. */
  9. const httpConfig = {
  10. timeout: 1000 * 30,
  11. withCredentials: true,
  12. headers: {
  13. 'Content-Type': 'application/json; charset=utf-8'
  14. }
  15. }
  16. const httpCustom = axios.create(httpConfig)
  17. /**
  18. *对于出现异常时还需要做其他操作,可使用该实例
  19. */
  20. const http = axios.create(httpConfig)
  21. /**
  22. * 封装的异常对象
  23. * @param message
  24. * @param code
  25. * @constructor
  26. *
  27. */
  28. function EipException (message, code) {
  29. this.msg = message
  30. this.code = code
  31. }
  32. /**
  33. * 请求拦截
  34. */
  35. http.interceptors.request.use(config => {
  36. return {
  37. ...config,
  38. ..._.merge(httpConfig, window.BS_CONFIG?.httpConfigs)
  39. }
  40. }, error => {
  41. return Promise.reject(error)
  42. })
  43. /**
  44. * 自定义请求拦截
  45. */
  46. httpCustom.interceptors.request.use(config => {
  47. return config
  48. }, error => {
  49. return Promise.reject(error)
  50. })
  51. /**
  52. * 响应拦截
  53. */
  54. http.interceptors.response.use(response => {
  55. const res = response.data
  56. // 异常拦截
  57. // eslint-disable-next-line no-empty
  58. if (res && res.code === 401) {
  59. } else if (res && res.code !== 200) {
  60. // return Promise.reject(response.data.msg)
  61. Message({
  62. message: response.data.msg,
  63. type: 'error'
  64. })
  65. throw new EipException(response.data.msg, response.data.code)
  66. } else {
  67. return res
  68. }
  69. }, error => {
  70. if (error.message && error.message === 'Network Error') {
  71. Message({
  72. message: error.message,
  73. type: 'error'
  74. })
  75. return Promise.reject(error)
  76. // eslint-disable-next-line no-empty
  77. } else {
  78. }
  79. Message({
  80. message: '服务异常',
  81. type: 'error'
  82. })
  83. return Promise.reject(error)
  84. })
  85. /**
  86. * 响应拦截
  87. */
  88. httpCustom.interceptors.response.use(response => {
  89. const res = response.data
  90. return res
  91. }, error => {
  92. if (error.message && error.message === 'Network Error') {
  93. return Promise.reject(error)
  94. // eslint-disable-next-line no-empty
  95. } else {
  96. }
  97. Message({
  98. message: '服务异常',
  99. type: 'error'
  100. })
  101. return Promise.reject(error)
  102. })
  103. /**
  104. * get请求
  105. * @param url
  106. * @param params
  107. * @returns {Promise<any>}
  108. */
  109. export function get (url, params = {}, customHandlerException = false) {
  110. if (!url.startsWith('http')) {
  111. url = window.BS_CONFIG?.httpConfigs?.baseURL + url
  112. }
  113. // 如果是ie浏览器要添加个时间戳,解决浏览器缓存问题
  114. if (!!window.ActiveXObject || 'ActiveXObject' in window) {
  115. params._t = new Date().getTime()
  116. }
  117. const axiosInstance = customHandlerException ? httpCustom : http
  118. return new Promise((resolve, reject) => {
  119. axiosInstance.get(url, {
  120. params: params,
  121. paramsSerializer: params => {
  122. return qs.stringify(params, { indices: false })
  123. }
  124. }).then(response => {
  125. if (customHandlerException) {
  126. resolve(response)
  127. } else {
  128. resolve(response.data)
  129. }
  130. }).catch(err => {
  131. reject(err)
  132. })
  133. })
  134. }
  135. /**
  136. * Post 请求
  137. * @param url
  138. * @param params
  139. * @returns {Promise<any>}
  140. */
  141. export function post (url, data = {}, customHandlerException = false) {
  142. if (!url.startsWith('http')) {
  143. url = window.BS_CONFIG?.httpConfigs?.baseURL + url
  144. }
  145. const axiosInstance = customHandlerException ? httpCustom : http
  146. data = JSON.stringify(data)
  147. return new Promise((resolve, reject) => {
  148. axiosInstance.post(url, data).then(response => {
  149. if (customHandlerException) {
  150. resolve(response)
  151. } else {
  152. resolve(response.data)
  153. }
  154. }).catch(err => {
  155. reject(err)
  156. })
  157. })
  158. }
  159. /**
  160. * download 请求
  161. * @returns {Promise<any>}
  162. */
  163. export function download (url, headers = {}, params = {}, body = {}) {
  164. if (!url.startsWith('http')) {
  165. url = window.BS_CONFIG?.httpConfigs?.baseURL + url
  166. }
  167. // 如果是ie浏览器要添加个时间戳,解决浏览器缓存问题
  168. if (!!window.ActiveXObject || 'ActiveXObject' in window) {
  169. params._t = new Date().getTime()
  170. }
  171. return new Promise((resolve, reject) => {
  172. axios({
  173. method: 'post',
  174. url: url,
  175. headers: headers,
  176. params: params,
  177. data: body,
  178. withCredentials: false,
  179. responseType: 'arraybuffer'
  180. }).then(res => {
  181. // IE10,11采用自带下载文件流方法
  182. if ((!!window.ActiveXObject || 'ActiveXObject' in window) && window.navigator && window.navigator.msSaveOrOpenBlob) {
  183. window.navigator.msSaveOrOpenBlob(new Blob([res.data]), res.headers.filename)
  184. return
  185. }
  186. const fileUrl = window.URL.createObjectURL(new Blob([res.data]))
  187. // 创建超链接
  188. const fileLink = document.createElement('a')
  189. fileLink.href = fileUrl
  190. // 设置下载文件名
  191. let responseFileName = res.headers.filename
  192. // 解决中文乱码
  193. responseFileName = window.decodeURI(responseFileName)
  194. fileLink.setAttribute('download', responseFileName)
  195. document.body.appendChild(fileLink)
  196. // 模拟人工点击下载超链接
  197. fileLink.click()
  198. // 释放资源
  199. document.body.removeChild(fileLink)
  200. window.URL.revokeObjectURL(fileUrl)
  201. }).catch(e => {
  202. const status = e?.response?.status
  203. if (status === 404) {
  204. return
  205. }
  206. console.error('服务异常')
  207. })
  208. })
  209. }