一文介紹Node.js的跨域設定方法

隨著網路的發展，前後端分離的趨勢越來越明顯。在前後端分離開發中，前端頁面請求後端的API介面時，由於跨域問題，造成了許多不便。本文將介紹Node.js的跨域設定方法。

一、什麼是跨域

1.1 什麼是同源策略

在Web安全領域中，同源策略指的是：協定、網域名稱和連接埠號碼必須完全一致，才能從一個來源存取另一個來源的文件。簡單來說，就是頁面中的JavaScript只能讀取和操作與自己來源相同的文件。

1.2 什麼是跨網域

假設A網域下的網頁透過腳本存取了B網域下的資源，這種情況就稱為跨網域。

二、Node.js設定跨域

2.1 安裝Cors模組

Cors是一個Node.js模組，它允許跨域存取。你只要安裝它，就能夠輕鬆解決跨域問題。

npm install cors

2.2 在Node.js中使用Cors模組

在Express框架中，直接使用cors可以解決跨域問題。

const express = require('express');
const cors = require('cors');
const app = express();
app.use(cors());

以上程式碼將專案中的所有路由開啟CORS，如果只想在特定路由中開啟，可以使用以下程式碼：

const express = require('express');
const cors = require('cors');
const app = express();
const router = express.Router();

const corsOptions = {
    origin: 'http://example.com', // 允许访问的域名
    optionsSuccessStatus: 200 // some legacy browsers (IE11, various SmartTVs) choke on 204
};

router.get('/', cors(corsOptions), function(req, res) {
    //...
});

app.use('/', router);

2.3 自訂跨域設定

#如果想要更細緻的跨域設置，可以使用cors的各個選項進行自訂。以下是一些常用的選項：

const corsOptions = {
    origin: 'http://example.com', // String: 允许访问的域名，可以是字符串或正则表达式
    methods: ['GET', 'POST'], // Array: 允许的HTTP请求方法
    allowedHeaders: ['Content-Type'], // Array: 允许使用的自定义Header
    exposedHeaders: ['Content-Type'], // Array: 允许客户端访问的响应头
    credentials: true, // Boolean: 是否发送Cookies
    maxAge: 86400 // Number: 预检请求缓存时间，单位秒
};
app.use(cors(corsOptions));

三、總結

Node.js提供了cors模組，能夠輕鬆地解決跨域問題。在Express框架中，只需一行程式碼即可開啟CORS。同時，還可以自訂跨域設置，以滿足更靈活的需求。

以上是一文介紹Node.js的跨域設定方法的詳細內容。更多資訊請關注PHP中文網其他相關文章！