La palabra CORS significa «intercambio de recursos de origen cruzado». El intercambio de recursos de origen cruzado es un mecanismo basado en encabezado HTTP implementado por el navegador que permite que un servidor o una API (interfaz de programación de aplicaciones) indique cualquier origen (diferente en términos de protocolo, nombre de host o puerto) que no sea su origen desde el cual el origen desconocido obtiene permiso para acceder y cargar recursos.
Configuración del proyecto e instalación del módulo:
Paso 1: Cree una aplicación Node.js y asígnele el nombre gfg-cors usando el siguiente comando.
mkdir geeksforgeeks && cd geeksforgeeks npm init
Paso 2: instale los módulos de dependencia con el siguiente comando.
npm i express cors
Paso 3: cree un directorio de cliente y un archivo server.js en el directorio raíz. Luego cree index.html y script.js en el directorio del cliente .
Directorio de proyectos: Se verá así.
Ejemplo: Este es el código dentro del archivo index.html y script.js.
index.html
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Sample webpage</title> <script src="script.js"></script> </head> <body> </body> </html>
Javascript
fetch('http://localhost:5000/secret') .then((res) => res.json()) .then((data) => console.log(data))
Como hemos terminado con el archivo básico de códigos, ahora pase al tema principal y vea cómo permitir CORS en Express
Habilitación de CORS para todas las rutas: si desea permitir que los orígenes seleccionados accedan a su sitio, debe configurar cors como se muestra a continuación.
Sintaxis:
const cors = require(cors) app.use(cors())
Ejemplo: al habilitar CORS para todas las rutas del servidor, al nuevo index.js le gustará:
index.js
// Requiring module const express = require('express') const cors = require('cors') // Creating express app const app = express() // enabling CORS for any unknow origin(https://xyz.example.com) app.use(cors()); // sample api routes for testing app.get('/', (req, res) => { res.json("welcome to our server") }); app.get('/secret', (req, res) => { const secret = Math.floor(Math.random() * 100) res.json({ secret }) }); // Port Number const port = 5000; // Server setup app.listen(port, () => { console.log(`Server running on port ${port}.`) })
Paso para ejecutar la aplicación: Ejecute server.js usando el siguiente comando.
node server.js
Producción:
CORS para una ruta específica:
Pero podría darse el caso de que solo se permita el acceso a los recursos de nuestro servidor a una cierta cantidad de orígenes desconocidos, y necesitamos proteger nuestro servidor del intruso potencial (cualquier URL que no siga la política del mismo origen) debido a la confidencialidad. Aquí habilitaremos las requests CORS para una cierta cantidad de orígenes, como se muestra a continuación:});
Sintaxis:
let corsOptions = { origin : ['http://localhost:5500'], }
index.js
// index.js file // Requiring module const express = require('express') const cors = require('cors') // Creating express app const app = express() // enabling CORS for some specific origins only. let corsOptions = { origin : ['http://localhost:5500'], } app.use(cors(corsOptions)) // sample api routes for testing app.get('/',(req, res) => { res.json("welcome to our server") }); app.get('/secret', cors(corsOptions) , (req, res) => { const secret = Math.floor(Math.random()*100) res.json({secret}) }); // Port Number const port = 5000; // Server setup app.listen(port, () => { console.log(`Server running on port ${port}.`) });
Paso para ejecutar la aplicación: Ejecute server.js usando el siguiente comando.
node server.js
Producción:
Publicación traducida automáticamente
Artículo escrito por shinjanpatra y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA