如何解決node.JS護照oauth2 cors錯誤

Question

我正在嘗試配置節點護照 oauth2 登錄。

如果直接從瀏覽器調用get url，一切正常。

我正在嘗試使用反應客戶端作為前端來設置登錄。

反應 axios api 呼叫

 const res = await Axios.get(http://locahost:5000/login`)

node.js 快遞

app.use(cors({
  'allowedHeaders': ['sessionId', 'Content-Type', 'authorization'],
  'exposedHeaders': ['sessionId','authorization'],
  // 'origin': true,
  // 'Access-Control-Allow-Origin': 'http://localhost:8080',
  'methods': 'GET,HEAD,PUT,PATCH,POST,DELETE, OPTIONS',
  'preflightContinue': false
}));

app.use(bodyParser.json({ limit: "50mb", extended: true }));

app.get('/npt/login', passport.authenticate('oauth2'));

這是我得到的錯誤

Access to XMLHttpRequest at 'https://...' (redirected from 'http://localhost:5000/npt/login') from origin 'http://localhost:8080' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.

我需要在客戶端應用程序中設置標題嗎？

更新：我正在嘗試使用 Azure App Registration 來使用此配置。

我已經更新了 express CORS 設置。

UPDATE2：我已經設法解決了在與 nodeJS express 服務器相同的源上運行前端的問題。 這是我遵循的示例： https://github.com/cicorias/react-azuread-passport

Answer 1

如果你通過CRA運行 react side

您可以在package.json文件中添加代理

像這樣：

"proxy": "http://yourTarget.com",

並調用 http 請求

http://localhost:3000

注意：當您更改package.json文件時，您必須重置npm start命令以查看更改