Reactjs Question posted in
The new location for the React Documentation can be found here.

Reactjs – I can't acces my data when I deploy in vercel api. It shows only cors problem – how to solve this?

:5173/watches:1 Access to fetch at ‘https://watch-websites-server-site-mr3f7mg2v-md-sabbir-khans-projects.vercel.app/watches’ from origin ‘http://localhost:5173’ has been blocked by CORS policy: No ‘Access-Control-Allow-Origin’ header is present on the requested resource. If an opaque response serves your needs, set the request’s mode to ‘no-cors’ to fetch the resource with CORS disabled.

When I used my website in locally, I didn’t get any data from the vercel API link

Tags:

2

Answers


  1. 0

    To resolve the CORS issue, you have several options:

    Modify the Server to Allow CORS:

    // Your code goes here
const express = require('express');
const cors = require('cors');
const app = express();

app.use(cors());

app.get('/watches', (req, res) => {
  res.json({ message: 'This has CORS enabled' });
});

app.listen(3000, () => {
  console.log('Server is running on port 3000');
});
    Login or Signup to reply.
  2. 0

    Ensure that your CORS headers are intact. Also you can use CORS as a middleware if needed.
    So just as an example –
    app.use(cors());

    app.get('/watches', (req, res) => {
  res.json({ message: 'CORS enabled' });
});

app.listen(3000, () => {
  console.log('Server is running on port 3000');
});

    Also check if your vercel.json (if you are having one) is not having any overriding headers.

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search