I have a client app that makes a fetch request to a server running at port 3333, however I get this error when I access the site after using port forwarding.
Access to fetch at 'http://localhost:3333/' from origin 'https://sdnxn5zx-3000.euw.devtunnels.ms' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.
even after running locally I still get errors
Access to fetch at 'http://localhost:3333/' from origin 'http://localhost:3000' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.
and here is what my server file has in it
const express = require("express");
const app = express();
const cors = require("cors");
app.use(
cors({
origin: "http://localhost:3000",
credentials: true,
methods: ["GET", "POST", "PUT", "DELETE", "OPTIONS"],
headers: ["Content-Type", "Authorization"],
maxAge: 84600,
})
);
app.use((request, response, next) => {
response.setHeaders({
"Access-Control-Allow-Origin": "http://localhost:3000",
"Access-Control-Allow-Credentials": true,
"Access-Control-Allow-Methods": "GET, POST, OPTIONS",
"Access-Control-Allow-Headers": "Origin, Content-Type, Accept",
});
});
app.get("/", (request, response) => {
response.json("Successful");
console.log("Hello World");
});
app.listen(3333, () => {
console.log("Server is running on port 3333");
});