sending data as json from ajax to express server causes preflight cors error
up vote
0
down vote
favorite
This question has been asked a gazillion times. I've read the mozilla documentation and looked through so many answers my eyes hurt.
In my ajax call I have this:
$.ajax({
type: 'POST',
dataType: 'json',
data: name: "test",
contentType: 'application/json',
url: 'https://example.com:8443',
success: function (data)
alert(data);
in my express server my server.js file is this:
app.post('/', function (req, res)
console.log(req.body.myData);
res.header('Access-Control-Allow-Origin: *');
res.header('Access-Control-Allow-Methods: GET, POST, PATCH, PUT, DELETE, OPTIONS');
res.header('Access-Control-Allow-Headers: Origin, Content-Type, X-Auth-Token');
return res.end('<h1>Hello, Secure World!</h1>');
);
from my understanding I'm properly making the ajax call with dataType: 'json', and contentType 'application/json'.
Also I'm setting acess control allow origin to * which should allow me to have any domain hit my server. I can't figure out what I'm doing wrong. I get this error:
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.
Any help would be appreciated!
ajax express
add a comment |
up vote
0
down vote
favorite
This question has been asked a gazillion times. I've read the mozilla documentation and looked through so many answers my eyes hurt.
In my ajax call I have this:
$.ajax({
type: 'POST',
dataType: 'json',
data: name: "test",
contentType: 'application/json',
url: 'https://example.com:8443',
success: function (data)
alert(data);
in my express server my server.js file is this:
app.post('/', function (req, res)
console.log(req.body.myData);
res.header('Access-Control-Allow-Origin: *');
res.header('Access-Control-Allow-Methods: GET, POST, PATCH, PUT, DELETE, OPTIONS');
res.header('Access-Control-Allow-Headers: Origin, Content-Type, X-Auth-Token');
return res.end('<h1>Hello, Secure World!</h1>');
);
from my understanding I'm properly making the ajax call with dataType: 'json', and contentType 'application/json'.
Also I'm setting acess control allow origin to * which should allow me to have any domain hit my server. I can't figure out what I'm doing wrong. I get this error:
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.
Any help would be appreciated!
ajax express
add a comment |
up vote
0
down vote
favorite
up vote
0
down vote
favorite
This question has been asked a gazillion times. I've read the mozilla documentation and looked through so many answers my eyes hurt.
In my ajax call I have this:
$.ajax({
type: 'POST',
dataType: 'json',
data: name: "test",
contentType: 'application/json',
url: 'https://example.com:8443',
success: function (data)
alert(data);
in my express server my server.js file is this:
app.post('/', function (req, res)
console.log(req.body.myData);
res.header('Access-Control-Allow-Origin: *');
res.header('Access-Control-Allow-Methods: GET, POST, PATCH, PUT, DELETE, OPTIONS');
res.header('Access-Control-Allow-Headers: Origin, Content-Type, X-Auth-Token');
return res.end('<h1>Hello, Secure World!</h1>');
);
from my understanding I'm properly making the ajax call with dataType: 'json', and contentType 'application/json'.
Also I'm setting acess control allow origin to * which should allow me to have any domain hit my server. I can't figure out what I'm doing wrong. I get this error:
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.
Any help would be appreciated!
ajax express
This question has been asked a gazillion times. I've read the mozilla documentation and looked through so many answers my eyes hurt.
In my ajax call I have this:
$.ajax({
type: 'POST',
dataType: 'json',
data: name: "test",
contentType: 'application/json',
url: 'https://example.com:8443',
success: function (data)
alert(data);
in my express server my server.js file is this:
app.post('/', function (req, res)
console.log(req.body.myData);
res.header('Access-Control-Allow-Origin: *');
res.header('Access-Control-Allow-Methods: GET, POST, PATCH, PUT, DELETE, OPTIONS');
res.header('Access-Control-Allow-Headers: Origin, Content-Type, X-Auth-Token');
return res.end('<h1>Hello, Secure World!</h1>');
);
from my understanding I'm properly making the ajax call with dataType: 'json', and contentType 'application/json'.
Also I'm setting acess control allow origin to * which should allow me to have any domain hit my server. I can't figure out what I'm doing wrong. I get this error:
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.
Any help would be appreciated!
ajax express
ajax express
asked Nov 9 at 20:39
FabricioG
316314
316314
add a comment |
add a comment |
1 Answer
1
active
oldest
votes
up vote
0
down vote
accepted
My error was a dumb one. In express js this is incorrect:
res.header('Access-Control-Allow-Origin: *');
res.header('Access-Control-Allow-Methods: GET, POST, PATCH, PUT, DELETE, OPTIONS');
res.header('Access-Control-Allow-Headers: Origin, Content-Type, X-Auth-Token');
The settings should actually be like this '',''
not ':'
The correct syntax that worked is this:
res.header('Access-Control-Allow-Origin', '*');
res.header('Access-Control-Allow-Methods', 'GET, POST, PUT');
res.header('Access-Control-Allow-Headers', 'X-Requested-With, Content-Type');
EDIT: Using * is a security risk but in this case it's one server testing on another both of which I own. When going live I would set * to example.com
setting ` Access-Control-Allow-Origin: *` is security risk for your app. Consider using npmjs.com/package/cors in order to allow only your trusted origins.
– Pranay Tripathi
Nov 16 at 21:09
Updated @Pranay Tripathi
– FabricioG
Nov 16 at 21:16
add a comment |
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
up vote
0
down vote
accepted
My error was a dumb one. In express js this is incorrect:
res.header('Access-Control-Allow-Origin: *');
res.header('Access-Control-Allow-Methods: GET, POST, PATCH, PUT, DELETE, OPTIONS');
res.header('Access-Control-Allow-Headers: Origin, Content-Type, X-Auth-Token');
The settings should actually be like this '',''
not ':'
The correct syntax that worked is this:
res.header('Access-Control-Allow-Origin', '*');
res.header('Access-Control-Allow-Methods', 'GET, POST, PUT');
res.header('Access-Control-Allow-Headers', 'X-Requested-With, Content-Type');
EDIT: Using * is a security risk but in this case it's one server testing on another both of which I own. When going live I would set * to example.com
setting ` Access-Control-Allow-Origin: *` is security risk for your app. Consider using npmjs.com/package/cors in order to allow only your trusted origins.
– Pranay Tripathi
Nov 16 at 21:09
Updated @Pranay Tripathi
– FabricioG
Nov 16 at 21:16
add a comment |
up vote
0
down vote
accepted
My error was a dumb one. In express js this is incorrect:
res.header('Access-Control-Allow-Origin: *');
res.header('Access-Control-Allow-Methods: GET, POST, PATCH, PUT, DELETE, OPTIONS');
res.header('Access-Control-Allow-Headers: Origin, Content-Type, X-Auth-Token');
The settings should actually be like this '',''
not ':'
The correct syntax that worked is this:
res.header('Access-Control-Allow-Origin', '*');
res.header('Access-Control-Allow-Methods', 'GET, POST, PUT');
res.header('Access-Control-Allow-Headers', 'X-Requested-With, Content-Type');
EDIT: Using * is a security risk but in this case it's one server testing on another both of which I own. When going live I would set * to example.com
setting ` Access-Control-Allow-Origin: *` is security risk for your app. Consider using npmjs.com/package/cors in order to allow only your trusted origins.
– Pranay Tripathi
Nov 16 at 21:09
Updated @Pranay Tripathi
– FabricioG
Nov 16 at 21:16
add a comment |
up vote
0
down vote
accepted
up vote
0
down vote
accepted
My error was a dumb one. In express js this is incorrect:
res.header('Access-Control-Allow-Origin: *');
res.header('Access-Control-Allow-Methods: GET, POST, PATCH, PUT, DELETE, OPTIONS');
res.header('Access-Control-Allow-Headers: Origin, Content-Type, X-Auth-Token');
The settings should actually be like this '',''
not ':'
The correct syntax that worked is this:
res.header('Access-Control-Allow-Origin', '*');
res.header('Access-Control-Allow-Methods', 'GET, POST, PUT');
res.header('Access-Control-Allow-Headers', 'X-Requested-With, Content-Type');
EDIT: Using * is a security risk but in this case it's one server testing on another both of which I own. When going live I would set * to example.com
My error was a dumb one. In express js this is incorrect:
res.header('Access-Control-Allow-Origin: *');
res.header('Access-Control-Allow-Methods: GET, POST, PATCH, PUT, DELETE, OPTIONS');
res.header('Access-Control-Allow-Headers: Origin, Content-Type, X-Auth-Token');
The settings should actually be like this '',''
not ':'
The correct syntax that worked is this:
res.header('Access-Control-Allow-Origin', '*');
res.header('Access-Control-Allow-Methods', 'GET, POST, PUT');
res.header('Access-Control-Allow-Headers', 'X-Requested-With, Content-Type');
EDIT: Using * is a security risk but in this case it's one server testing on another both of which I own. When going live I would set * to example.com
edited Nov 16 at 21:16
answered Nov 16 at 21:00
FabricioG
316314
316314
setting ` Access-Control-Allow-Origin: *` is security risk for your app. Consider using npmjs.com/package/cors in order to allow only your trusted origins.
– Pranay Tripathi
Nov 16 at 21:09
Updated @Pranay Tripathi
– FabricioG
Nov 16 at 21:16
add a comment |
setting ` Access-Control-Allow-Origin: *` is security risk for your app. Consider using npmjs.com/package/cors in order to allow only your trusted origins.
– Pranay Tripathi
Nov 16 at 21:09
Updated @Pranay Tripathi
– FabricioG
Nov 16 at 21:16
setting ` Access-Control-Allow-Origin: *` is security risk for your app. Consider using npmjs.com/package/cors in order to allow only your trusted origins.
– Pranay Tripathi
Nov 16 at 21:09
setting ` Access-Control-Allow-Origin: *` is security risk for your app. Consider using npmjs.com/package/cors in order to allow only your trusted origins.
– Pranay Tripathi
Nov 16 at 21:09
Updated @Pranay Tripathi
– FabricioG
Nov 16 at 21:16
Updated @Pranay Tripathi
– FabricioG
Nov 16 at 21:16
add a comment |
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53232968%2fsending-data-as-json-from-ajax-to-express-server-causes-preflight-cors-error%23new-answer', 'question_page');
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown