react請求資料統一處理(axios)

2021-08-27 23:46:56 字數 1388 閱讀 3566

開發中為了方便開發和便於維護,我們將所有的請求統一處理。這樣可以提高我們的開發效率,而且便於後期的維護。

在src目錄下新建資料夾api,建立三個js檔案:server.js,serverapi.config.js,api.js.如下圖:

server.js檔案處理axios跨域問題。**如下:

import axios from 'axios';

//取消請求

let canceltoken = axios.canceltoken

axios.create(

})//開始請求設定,發起攔截處理

axios.interceptors.request.use(config =>

config.canceltoken = new canceltoken(c =>

axios[requestname].cancel = c})}

return config

}, error => )

// respone***

axios.interceptors.response.use(

response => else

},error =>

)export default axios

serverapi.config.js檔案處理所有介面

/***

* *統一定義介面,有利於維護

* **/

const history= '';

const url =

export default url

api.js檔案,統一定義介面方法

import server from './server';

import url from './serviceapi.config';

//介面1方法

export function histopen(data))

}//介面2方法

export function histdata(data))

}

使用時在需要的元件裡面引入api.js,舉個栗子

import react from 'react';

import from './../api/api';

export default class login extends react.component}}

async componentdidmount())

}render()

}

統一處理異常

1.controlleradvice 註解定義全域性異常處理類 controlleradvice public class globalexceptionhandler 2.exceptionhandler 註解宣告異常處理方法,註解的方法的引數列表裡,還可以宣告很多種型別的引數 controlle...

Web應用架構 錯誤統一處理, 和事務統一處理

因為前期,重點放在業務分析上,這兩塊一直認真思考過,覺得很簡單.一開始只是找了乙個nhibernate的示例,就決定把session的open和close和事務 transaction 的commit,放在httpmodule中處理.算是session per request的模式.之後,繼續加入錯...

Web應用架構 錯誤統一處理, 和事務統一處理

因為前期,重點放在業務分析上,這兩塊一直認真思考過,覺得很簡單.一開始只是找了乙個nhibernate的示例,就決定把session的open和close和事務 transaction 的commit,放在httpmodule中處理.算是session per request的模式.之後,繼續加入錯...