Tester CORS

Testa e debugga le politiche CORS (Cross-Origin Resource Sharing) e le richieste API

Impostazioni richiesta

Configura la tua richiesta API per il test

URL

Metodo HTTP

Intestazioni

Richieste di esempio

Prova queste richieste API predefinite

Informazioni CORS

Informazioni di base su CORS

Cos'è CORS? CORS (Cross-Origin Resource Sharing) è un meccanismo che consente ai browser web di effettuare richieste cross-origin (dominio, protocollo o porta diversi) da script in esecuzione nel browser.

Intestazioni CORS chiave

Access-Control-Allow-Origin: Specifica quali origini sono autorizzate ad accedere alla risorsa
Access-Control-Allow-Methods: Specifica quali metodi HTTP sono consentiti
Access-Control-Allow-Headers: Specifica quali intestazioni HTTP possono essere utilizzate
Access-Control-Allow-Credentials: Specifica se includere le credenziali (cookie, autenticazione HTTP)

💡 Soluzioni CORS

Soluzioni lato server

1. Express.js (Node.js):

const cors = require('cors');
          app.use(cors({
            origin: 'https://example.com',
            methods: ['GET', 'POST'],
            credentials: true
          }));

2. Spring Boot (Java):

@CrossOrigin(origins = "https://example.com")
          @RestController
          public class ApiController { ... }

Soluzioni lato client

1. Utilizzo di un server proxy:

// package.json (React)
          "proxy": "http://localhost:3001"

2. JSONP (solo GET):

// Soluzione limitata ma semplice
          fetch('api?callback=handleResponse')

🔧 Configurazione CORS per ambiente

Next.js

// next.config.js
          module.exports = {
            async headers() {
              return [
                {
                  source: '/api/:path*',
                  headers: [
                    {
                      key: 'Access-Control-Allow-Origin',
                      value: '*'
                    }
                  ]
                }
              ]
            }
          }

Nginx

location /api {
            add_header Access-Control-Allow-Origin *;
            add_header Access-Control-Allow-Methods 
              "GET, POST, OPTIONS";
            add_header Access-Control-Allow-Headers 
              "Content-Type, Authorization";
          }

Apache

# .htaccess
          Header always set Access-Control-Allow-Origin "*"
          Header always set Access-Control-Allow-Methods 
            "GET, POST, OPTIONS"
          Header always set Access-Control-Allow-Headers 
            "Content-Type, Authorization"

Configurazione CORS per ambiente

Scenari di test

• Richiesta semplice: Testa il comportamento CORS di base con richieste GET
• Richiesta preflight: Testa le richieste preflight con i metodi PUT/DELETE
• Intestazioni personalizzate: Testa le richieste con l'intestazione Authorization
• Credenziali: Testa le richieste con i cookie
• Gestione degli errori: Testa gli scenari di errore

Considerazioni sulla sicurezza

• Fai attenzione all'uso del carattere jolly (*) a causa dei rischi per la sicurezza
• Principio del privilegio minimo: consenti solo le origini e i metodi necessari
• Restrizioni delle credenziali: consenti solo origini specifiche quando includi le credenziali
• Revisione regolare: rivedi e aggiorna periodicamente le politiche CORS