Home > Web Front-end > Front-end Q&A > An article introducing the cross-domain setting method of Node.js

An article introducing the cross-domain setting method of Node.js

PHPz
Release: 2023-04-05 09:43:10
Original
2378 people have browsed it

With the development of the Internet, the trend of separation of front-end and back-end is becoming more and more obvious. In the front-end and back-end separation development, when the front-end page requests the back-end API interface, it causes a lot of inconvenience due to cross-domain issues. This article will introduce the cross-domain setup method of Node.js.

1. What is cross-domain

1.1 What is the same-origin policy

In the field of Web security, the same-origin policy refers to: the protocol, domain name and port number must Documents from one source can be accessed from another source only if they are exactly the same. Simply put, the JavaScript in the page can only read and operate documents from the same source as itself.

1.2 What is cross-domain

Assume that the web page under domain name A accesses the resources under domain name B through a script. This situation is called cross-domain.

2. Node.js settings across domains

2.1 Install Cors module

Cors is a Node.js module that allows cross-domain access. As long as you install it, you can easily solve cross-domain problems.

npm install cors

2.2 Using the Cors module in Node.js

In the Express framework, using cors directly can solve cross-domain problems.

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

The above code will enable CORS for all routes in the project. If you only want to enable it in a specific route, you can use the following code:

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);
Copy after login

2.3 Custom cross-domain settings

If you want more detailed cross-domain settings, you can use various options of cors to customize. The following are some commonly used options:

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));
Copy after login

3. Summary

Node.js provides the cors module, which can easily solve cross-domain problems. In the Express framework, CORS can be turned on with just one line of code. At the same time, cross-domain settings can also be customized to meet more flexible needs.

The above is the detailed content of An article introducing the cross-domain setting method of Node.js. For more information, please follow other related articles on the PHP Chinese website!

source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template