CORS

Fa parte della sezione API REST del percorso Node.js di Coddy. Lezione 13 di 18.

Una pagina su https://board.example.com chiama la tua API con fetch, ma il browser blocca la risposta. I browser consentono a una pagina di leggere le risposte solo dalla propria origine, cioè lo schema, l'host e la porta da cui proviene, a meno che il server non ne consenta altre tramite le intestazioni CORS.

OPTIONS /api/products/7
Origin: https://shop.example.com
Access-Control-Request-Method: DELETE

204 No Content
Access-Control-Allow-Origin: https://shop.example.com
Access-Control-Allow-Methods: GET, DELETE
Access-Control-Allow-Headers: Content-Type

Prima di un DELETE, di un PATCH o di un corpo JSON, il browser invia questa richiesta preflight e procede solo se la risposta lo consente. Anche tutte le altre risposte devono includere Access-Control-Allow-Origin. * consente qualsiasi origine, ma i browser lo rifiutano quando la pagina invia cookie (Access-Control-Allow-Credentials: true), quindi specifica l'origine. Solo i browser applicano CORS: curl e la barra delle richieste lo ignorano.

Sfida

Facile

Un middleware prima delle route imposta Access-Control-Allow-Origin: https://board.example.com e Access-Control-Allow-Credentials: true in ogni risposta.
OPTIONS risponde con 204 e Access-Control-Allow-Methods che elenca GET, POST, PUT, PATCH, DELETE, e Access-Control-Allow-Headers: Content-Type.

Fai da browser: invia OPTIONS /api/tasks/2 con l'intestazione Origin: https://board.example.com, poi GET /api/tasks e leggi le intestazioni di ciascuna risposta.

Provalo tu

import express from 'express';
import { sendError } from './errors.js';
import taskRoutes from './routes/tasks.js';

const app = express();
app.use(express.json());

app.use('/api/tasks', taskRoutes);

// Gli errori delle route arrivano qui. Un corpo che non è JSON valido è un errore del
// client (400); qualsiasi altro errore è nostro (500).
app.use((err, req, res, next) => {
    if (err.type === 'entity.parse.failed') {
        return sendError(res, 400, 'invalid_json', 'The body is not valid JSON');
    }
    console.error(err);
    sendError(res, 500, 'server_error', 'Something went wrong');
});

app.listen(3000, () => {
    console.log('Task tracker API on port 3000');
});