使用NodeJs反向代理http請求並解決跨域問題

前言

準備使用Halo搭建個人博客,但是在初始化時因爲我亂摁鍵盤卡出了一個bug,原本是8090端口服務端,其他請求沒問題,但css等靜態資源神奇地變成了809端口.... 如圖

(請求的是8090,但css等靜態資源很迷的變成了809,導致頁面沒樣式)

怎麼辦呢?全部重新刪掉再安裝?.....  突然意識到手頭有NodeJs,行吧,乾脆就用Node代理下請求,把809請求轉到8090就好了


使用NodeJs反向代理http請求

1. 在你的nodejs項目路徑下初始化

npm init

然後一路回車就可以了,只不過這樣的話啓動文件必須是app.js,想改的話不要一路回車,因爲中途會有個輸入文件名的提示

 

2. 使用npm包管理器安裝express和http中間件代理模塊

npm install  express  http-proxy-middleware --save-dev

3. 新建app.js,輸入如下代碼

var express = require('express');
const proxy = require('http-proxy-middleware');
const app = express();
app.set('port', '809');           // 你NodeJs代理端口

var options = {
        target: 'http://localhost:8090',    //  你服務器端口
        changeOrigin: true,
    };
var exampleProxy = proxy(options);
app.use('/', exampleProxy);              //  ‘/’ 表示對所有請求代理
app.listen(app.get('port'), () => {
 console.log(`server running @${app.get('port')}`);
});

弄完後結構大致是這樣的

4. 啓動NodeJs

node app.js

再次請求8090端口,這次果然好了....... 不對,好像還有什麼問題

報錯 No 'Access-Control-Allow-Origin' header ,原來是809、8090請求跨了端口 ,屬於跨域問題


NodeJs解決跨域請求

將上面的代碼添加跨域處理部分,代碼如下

var express = require('express');
const proxy = require('http-proxy-middleware');
const app = express();
app.set('port', '809');

app.all('*', function (req, res, next) {    // 解決跨域問題
    res.header("Access-Control-Allow-Origin", "*");
    res.header("Access-Control-Allow-Headers", "Content-Type,Content-Length, Authorization, Accept,X-Requested-With");
    res.header("Access-Control-Allow-Methods", "PUT,POST,GET,DELETE,OPTIONS");    
    if (req.method == "OPTIONS") {
        res.send(200);       
    } else {
        next();
    }
});

var options = {
        target: 'http://localhost:8090',
        changeOrigin: true,
    };
var exampleProxy = proxy(options);
app.use('/', exampleProxy);
app.listen(app.get('port'), () => {
 console.log(`server running @${app.get('port')}`);
});

再次啓動NodeJs,發現問題已經沒了


其他

再次啓動NodeJs時可能會報錯端口占用,雖然挺好解決但是還是提一下,使用 lsof -i:809 可以找出809端口進程的PID,然後用kill -9 幹掉即可

如果直接node app.js啓動此時終端是卡住的,一按鍵就可能斷開,也幹不了其他事,這裏可以使用 & 開啓後臺進程

node app.js &

後面加一個 & 表示啓用後臺進程,這樣你就可以不用管它了,當然,如果你是寶塔面板,你也可以用PM2管理你的NodeJs項目

點擊啓動即可

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章