博客 / 詳情

返回

日拱一卒-如何實現請求轉發

今天在聯調的時候,由於後端的問題導致接口出現了跨域問題。
使用接口請求工具可以請求到數據,但是一旦把服務跑起來,就會報跨域的問題。
由於自己之前簡單學習了一下mock數據的方法,於是想着,那不如寫一個簡單的請求轉發的工具,這樣就能解決跨域問題了。
使用的工具是express和axios。
先根據express的官方文檔,安裝express generator:

npm i -g express-generator
express --view=pug myapp
cd myapp
npm install

為了便於修改文件而不用不停地重啓服務,我還安裝了nodemon:

npm i nodemon -g

之後便可以愉快地啓動項目:

nodemon start

接下來就是正式開始寫請求轉發。
當然此處我沒有完全實現,因為post請求的body一直拿不到,即使用了body-paser也一樣。此處只講get請求的處理:
首先寫一個接口:

router.get("/index", (req, res, next) => {
    const data = {};
    res.send(data);
});

這樣就實現了一個接口,可以通過接口請求工具進行請求了。比如本地服務是跑在3000端口的,那麼就可以通過"http://localhost:3000/index"訪問該接口,返回的結果應該是一個空對象。
但是我們還要實現接口轉發,也就是要拿到別的接口的數據,這時候就要用到axios。
首先安裝axios:

npm i axios

然後在項目中引用:

var axios = require("axios");

接着就是正式使用axios請求數據並返回:

axios.get("http://www.baidu.com/api").then(response => {
    res.send(response);
});

這個時候,我們嘗試着請求接口,發現是拿不到數據的,而且服務會報錯。是因為我們需要對數據進行解析後再返回,所以需要引入util這個包。

var util = require("util");

之後將接口改寫成如下模樣:

axios.get("http://www.baidu.com/api").then(response => {
    res.send(util.inspect(response.data));
});

至此就實現了一次完整的請求轉發。
如果要實現post請求也是可以的,關鍵點就是要拿到前端傳過來的請求體,這個目前我還沒研究,等下次再寫。
順便貼一下接口轉發的完整代碼:

router.get("/index", (req, res, next) => {
    axios
        .get("http://www.baidu.com/api")
        .then(response => {
            res.send(util.inspect(response.data));
        });
});

最近忙着搬家和加班,着實沒有時間寫日拱一卒,落下了好幾天,今天終於恢復。

user avatar
0 位用戶收藏了這個故事!

發佈 評論

Some HTML is okay.