Loading...
Loading...
Access to fetch at 'https://api.example.com/data' from origin 'http://localhost:3000' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resourceCORS (Cross-Origin Resource Sharing) is a browser security feature that prevents a website on one domain (like localhost:3000) from making fetch/XHR requests to another domain (like api.example.com) unless the server explicitly allows it.
Route requests through your own backend or dev server to bypass browser CORS checks.
// Next.js: next.config.mjs
const nextConfig = {
async rewrites() {
return [
{
source: '/api/:path*',
destination: 'https://api.example.com/:path*',
},
];
},
};
// Now fetch from your own domain: fetch('/api/users')If you control the API, add the Access-Control-Allow-Origin header.
// Express.js
const cors = require('cors');
app.use(cors({ origin: 'http://localhost:3000' }));
// Python Flask
from flask_cors import CORS
CORS(app, resources={r"/api/*": {"origins": "*"}})For local testing, use the 'Allow CORS' Chrome extension to temporarily bypass the check.