Reactjs: No 'Access-Control-Allow-Origin' header is present on the requested resource

Question

I added headers on the server side

 res.setHeader('Access-Control-Allow-Origin','*');

 res.setHeader('Access-Control-Allow-Methods',"OPIONS,GET,POST,PUT,PATCH,DELETE");

 res.setHeader('Access-Control-Allow-Headers','Content-Type , Authorization');

But I still get the error on reactjs I used fetch for send and take data. Also I used from the header 'Access-Control-Allow-Origin':'*' On the ractjs

You need to set your headers in backend side like req.setHeader... — Prakash Karena, Nov 06 '19 at 15:37
You can control your request with the DevTools of chrome. You need to put the header on server and on the another server you do the request. What do you use of server type ? — Kubadev, Nov 06 '19 at 16:29
Possible duplicate of [How does Access-Control-Allow-Origin header work?](https://stackoverflow.com/questions/10636611/how-does-access-control-allow-origin-header-work) — Heretic Monkey, Nov 06 '19 at 17:50

iLiA · Accepted Answer · 2019-11-06T17:53:58.550

2

you can use pretty good library called cors which can do all your configs for you. here check it cors. you can configure it in your app.js like so:

const express = require('express');
const app = express();
const cors = require('cors')
app.use(cors());

if this does not work, you probably forgot to add proxy to your client's package.json

edited Nov 06 '19 at 17:53

answered Nov 06 '19 at 16:12

iLiA

3,053
4
23
45

You have a syntax error in your code (no comma after the URL), and setting the header on the client side doesn't help... – Heretic Monkey Nov 06 '19 at 17:43
and if it not working too, then he may forgot to add "proxy" to client's `package.json` – iLiA Nov 06 '19 at 17:46
That's on the server side. – Heretic Monkey Nov 06 '19 at 17:47
yes, he must configure cors on the server like `app.use(cors())` – iLiA Nov 06 '19 at 17:48
[Edit] your answer to include what the OP should do. My comment was about the code in the current answer, which indicates adding a header to the client request, which will not resolve the CORS error. – Heretic Monkey Nov 06 '19 at 17:50

Reactjs: No 'Access-Control-Allow-Origin' header is present on the requested resource

1 Answers1