Vue axios統一介面管理

2021-09-07 19:16:06 字數 1520 閱讀 4840

通過axios請求介面已經很簡單了,但最近在做乙個vue專案,想著把axios請求再封裝一下,這樣api就可以只在一處配置成方法,在使用的時候直接呼叫這個方法。

但咱們不用每個介面都定義成乙個囉嗦的axios請求方法,既然是想簡單點,就盡量只在一處完成簡單的配置。

將同一模組的介面放在乙個檔案下,比如我在src的services下定義了乙個global.js作為全域性服務的配置,在它裡面配置的api可以作為這個服務的方法。

比如:

name欄位將作為之後被呼叫的方法名,但這個只是乙個單純的物件,現在我們定義方法將它轉為方法。

import axios from "axios";

const withaxios = apiconfig =>;

apiconfig.map(() =>)

return

axios();

};});

return

servicemap;

};export

default withaxios;

我們在utils下定義了乙個通用的方法withaxios,這個方法的作用是將api配置檔案轉化為包含方法的乙個物件。

import withaxios from "../utils/withaxios";

const apiconfig =[

, ,

];export

default withaxios(apiconfig);

直接export出包裝後的物件即可。

想在vuex中呼叫某個api,首先import剛才匯出的物件

import globalservice from "@/services/global";
在action中呼叫某個介面:

const  = awaitglobalservice.userlogin(payload);
這樣就完事了。之後只需要配置-呼叫這麼兩步就可以完成介面呼叫,而且介面的語義化也更明確了。

我們可以在utils的withaxios中順便對axios做一些通用的設定。

比如每次請求頭中都自動帶上鑑權:

axios.defaults.headers.common["authorization"] = getcookie("jwt") || "";

//注意:此處只會在web應用初始化時配置,在登入成功後需重新配置authorization。

比如使用***對返回物件做統一處理:

axios.interceptors.response.use(response => =response;

if (data.status === -2) );

} if (data.status === -1) ]`);

} return

response;

});

在flask restplus下統一介面返回格式

在使用flask flask restplus時,業務正常時介面函式返回乙個可以json序列化的物件 ns.route hello class hello resource def get self return hello hi 介面返回內容如下 hello hi 當業務異常 比如檢測到引數錯誤 ...

記錄程式日誌(日誌實現和統一介面)

log是什麼?log最早 於航海日誌,是用來記錄航海過程中的所見所聞。在應用程式開發領域,特別是企業級應用程式,需要在程式不停止的情況下,能夠分析程式的執行過程。這個時候就需要把程式執行過程中的資料內容,分支選擇,異常,錯誤等資訊完整的記錄下來。實現這個功能的部件就叫做log。log的基本要求 lo...

九 介面總結

1,介面和抽象類讓實現和定義實現分離 2.抽象類 抽象類用abstract修飾,可包含抽象方法,和普通方法,其中抽象方法只是宣告了存在乙個方法,但不知道具體怎麼做 抽象方法 方法只有宣告沒有方法體,使用abstract進行修飾,只是宣告了乙個方法 如果乙個類有1個或多個抽象方法,那麼該類一定是抽象類...