perf($Axios, FileUpload): enhance Axios GET request

Support respond ArrayBuffer (byte array) as HTTP response.

BREAKING CHANGE: Support respond ArrayBuffer (byte array) as HTTP
response.

src/plugins/axios/axios-for-inter-communication.ts

@@ -3,7 +3,7 @@
  * @date 1/2/20 9:15 AM
  */
 // eslint-disable-next-line no-unused-vars
-import Axios, { AxiosRequestConfig, AxiosResponse, Canceler } from 'axios'
+import Axios, { AxiosRequestConfig, AxiosResponse, Canceler, ResponseType } from 'axios'
 import * as Cancellation from '@/plugins/axios/cancellation'
 import { HttpStatus } from '@/constants/http-status'
 
@@ -101,15 +101,17 @@ service.interceptors.response.use(
  *
  * The GET method requests a representation of the specified resource. Requests using GET should only retrieve data.
  *
- * @param url URL
- * @param params Params
+ * @param url URL.
+ * @param params Params.
+ * @param responseType Response type.
  * @return {Promise<any>} Response data.
  * @see <a href='https://developer.mozilla.org/en-US/docs/Web/HTTP/Methods/GET'>HTTP request methods — GET | MDN</a>
  */
-export function get (url: string, params?: any): Promise<any> {
+export function get (url: string, params?: any, responseType?: ResponseType): Promise<any> {
   return new Promise<any>((resolve, reject) => {
     service.get(url, {
-      params: params
+      params: params,
+      responseType: responseType
     }).then(resp => {
       resolve(resp)
     }).catch(rejectedReason => {

src/requests/exrx-net-api.ts

@@ -1,7 +1,9 @@
+/* eslint-disable no-unused-vars */
 import * as InterAxios from '@/plugins/axios/axios-for-inter-communication'
+import { ResponseType } from 'axios'
 
 export const exrxNetApi = {
   exerciseDirectory: () => InterAxios.get('/http://exrx.net/Lists/Directory'),
   muscleList: () => InterAxios.get('/http://exrx.net/Lists/Muscle'),
-  getHtmlByUrl: (url: string) => InterAxios.get(`/${url}`)
+  getResourceByUrl: (url: string, param?: any, responseType?: ResponseType) => InterAxios.get(`/${url}`, param, responseType)
 }

src/views/exrx-net/index.vue

@@ -110,7 +110,7 @@ export default Vue.extend({
       }
       const updateMuscleDetailsPayload = new UpdateMuscleDetailsPayload()
       updateMuscleDetailsPayload.name = muscleLink.name
-      const response = await exrxNetApi.getHtmlByUrl(muscleLink?.link)
+      const response = await exrxNetApi.getResourceByUrl(muscleLink?.link)
       const cheerio1 = cheerio.load(response)
       try {
         updateMuscleDetailsPayload.otherNames = DomUtil.getFirstLevelTextArray(cheerio1('.col-sm-6').find('h2:contains(\'Other Names\')').next())
@@ -140,7 +140,7 @@ export default Vue.extend({
         imageUrlList.push(HyperlinkUtil.restorePathToUrl(element.attribs.src))
       })
       for (const url of imageUrlList) {
-        const image = await exrxNetApi.getHtmlByUrl(url)
+        const image = await exrxNetApi.getResourceByUrl(url, undefined, 'arraybuffer')
         const imageFile = new File([image], HyperlinkUtil.parseFileNameFromUrl(url))
         updateMuscleDetailsPayload.muscleImageList.push(imageFile)
       }