When i tries to create a new data entry from my create form… it shows CORS error
Expected behavior
Excepting the message added success
Hi @Amith_T_R,
Welcome to the ForestAdmin community support and thank you for sharing your issue with us!
In order to assist you, can you share with me:
- The request sent to your admin backend (you can find it on the network tab of your browser’s console
- The exact response from your admin backend for that request
- Your backend logs when receiving the request (if any)
Thank you
1 Like
HI @lamatt_v
Thanks for the reply
This is the request sent from frontend
and no response from backend
@Amith_T_R, it seems that your environment has been created a while ago, is that the first time you encounter this issue? Have you made any recent changes in your admin backend that might have caused this issue? (upgrading dependencies for example)
Also, does that issue only happens on the home sliders creation? Or also everywhere else on the app? You can check that by accessing the data on any of your collections
2 Likes
@anon37102731
yes we created this project months before but now we are started working on it. Now im facing this issue .
This error is not happening everywhere. this issue have only in two or three forms only , thats im also confused.
Thanks for your help
1 Like
@Amith_T_R, if that’s not happening on all queries going to your admin backend, that means that the CORS issue you reported is probably not the real cause of the issue you’re facing.
Could you try to stop/restart your admin backend and log out/log in? Then try to perform the create query once again (and share with me the HTTP query sent, the server’s response and the backend logs please)
2 Likes
@anon37102731
actually we uploading a file in this from , may be that is the issue. When we changing the filed type file to text filed its working. is there any config required for file upload ?
Uploading a file should not result in a a CORS issue (or any other issue), could you please share with me the exact headers and response for the 2 queries, the one with the file picker (that results in an error) and the one without (that performs correctly).
You can get those headers and response for a given a query by right clicking on the query in your browser’s network console:
Don’t forget to remove the Authorization header for security reasons
1 Like
@lamatt_
With file upload
request header :
POST /forest/homepageSliders HTTP/1.1
Host: localhost:3310
Connection: keep-alive
Content-Length: 506435
sec-ch-ua: “Google Chrome”;v=“87”, " Not;A Brand";v=“99”, “Chromium”;v=“87”
Accept: application/json
Authorization:
sec-ch-ua-mobile: ?0
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/87.0.4280.88 Safari/537.36
Content-Type: application/json
Origin: https://app.forestadmin.com
Sec-Fetch-Site: cross-site
Sec-Fetch-Mode: cors
Sec-Fetch-Dest: empty
Referer: https://app.forestadmin.com/
Accept-Encoding: gzip, deflate, br
Accept-Language: en-US,en;q=0.9
response header:
HTTP/1.1 413 Payload Too Large
Server: nginx/1.14.0 (Ubuntu)
Date: Fri, 18 Dec 2020 04:28:13 GMT
Content-Type: application/json; charset=utf-8
Content-Length: 63
Connection: keep-alive
X-Powered-By: Express
ETag: W/“3f-MbXXHBpPXTPdK1EycwSAL6o3jco”
Without file upload
req headers:
POST /forest/homepageSliders HTTP/1.1
Host: localhost:3310
Connection: keep-alive
Content-Length: 138
sec-ch-ua: “Google Chrome”;v=“87”, " Not;A Brand";v=“99”, “Chromium”;v=“87”
Accept: application/json
Authorization:
sec-ch-ua-mobile: ?0
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/87.0.4280.88 Safari/537.36
Content-Type: application/json
Origin: http://app.forestadmin.com
Sec-Fetch-Site: cross-site
Sec-Fetch-Mode: cors
Sec-Fetch-Dest: empty
Referer: http://app.forestadmin.com/
Accept-Encoding: gzip, deflate, br
Accept-Language: en-US,en;q=0.9
response headers:
HTTP/1.1 200 OK
X-Powered-By: Express
Access-Control-Allow-Origin: http://app.forestadmin.com
Vary: Origin
Access-Control-Allow-Credentials: true
Content-Type: application/json; charset=utf-8
Content-Length: 974
ETag: W/“3ce-7uTj1CcnIZ8dlDbcrEs00OApUmE”
Date: Fri, 18 Dec 2020 04:36:43 GMT
Connection: keep-alive
I got this error too. My app works on Chrome but not on Brave. I’m trying both on my localhost server. The Brave browser fails the XMLHttpRequests.
Why I test out the same request through curl the requests are fulfilled, so there is not server related problem.
1 Like
Hello @Amith_T_R ,
Given the 413 error code, can I ask you to try and update your nginx server configuration?
This could help: "413 Request Entity Too Large" in Nginx with "client_max_body_size" set - Server Fault
1 Like
Can you please describe your installation?
The request shown is targeting localhost:3310 which is the default target when in a forest development mode, ok.
But the response header shows an nginx server.
1 Like
@Sliman_Medini
Showing nginex because i copied that header from Production mode. not from development
Below the headers i copied from Development mode
Reponse header:
HTTP/1.1 413 Payload Too Large
X-Powered-By: Express
Content-Type: application/json; charset=utf-8
Content-Length: 63
ETag: W/“3f-MbXXHBpPXTPdK1EycwSAL6o3jco”
Date: Tue, 22 Dec 2020 14:04:53 GMT
Connection: keep-alive
req header:
POST /forest/homepageSliders HTTP/1.1
Host: localhost:3310
Connection: keep-alive
Content-Length: 506434
sec-ch-ua: “Google Chrome”;v=“87”, " Not;A Brand";v=“99”, “Chromium”;v=“87”
Accept: application/json
Authorization:
sec-ch-ua-mobile: ?0
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/87.0.4280.88 Safari/537.36
Content-Type: application/json
Origin: http://app.forestadmin.com
Sec-Fetch-Site: cross-site
Sec-Fetch-Mode: cors
Sec-Fetch-Dest: empty
Referer: http://app.forestadmin.com/
Accept-Encoding: gzip, deflate, br
Accept-Language: en-US,en;q=0.9
When i am uploading a 300kb image it showing this error
But now i tried with a 20kb image its worked
Ok, so your express is returning 413 because the size is limited. I presume the culprit is bodyParser.
Can you look for “bodyParser.json(” in your code and replace it by “bodyParser({limit: '50mb'}”?
As described here it may helps.
Best,
1 Like
@Sliman_Medini Thanks It worked
I set bodyparser limit in app.js as below. Now file upload as base64 format is worked. Now i neeed to change file uplaod to AWS s3.
app.use(bodyParser.json({limit: ‘50mb’, type: ‘application/json’}));