Unable to make CORS request in ExtJS 6
So, I have my localhost with a page, which sends request to a remote site. I try to do it like so:
Ext.Ajax.cors = true;
Ext.Ajax.request(
url: "http://remoteaddress.com",
method: "GET",
headers:
"Access-Control-Allow-Origin": "*"
,
cors: true,
useDefaultXhrHeader: false,
success: function (result, request)
console.log("success!!!");
);
So, I followed dozens of threads and set these parameters - cors, useDefaultXhrHeader etc, but to no avail.
However, if I build the same request in postman (request to the same remoteaddress.com), then it's ok.
So, what I'm doing wrong and how can I fix it?
ajax extjs cors
asked Nov 13 '18 at 8:05
JacobianJacobian
2,018951120
add a comment |
So, I have my localhost with a page, which sends request to a remote site. I try to do it like so:
Ext.Ajax.cors = true;
Ext.Ajax.request(
url: "http://remoteaddress.com",
method: "GET",
headers:
"Access-Control-Allow-Origin": "*"
,
cors: true,
useDefaultXhrHeader: false,
success: function (result, request)
console.log("success!!!");
);
So, I followed dozens of threads and set these parameters - cors, useDefaultXhrHeader etc, but to no avail.
However, if I build the same request in postman (request to the same remoteaddress.com), then it's ok.
So, what I'm doing wrong and how can I fix it?
ajax extjs cors
asked Nov 13 '18 at 8:05
JacobianJacobian
2,018951120
1
As I see, the whole problem is withOPTIONSmethod, but I'm not sure how can I switch toGETrequest. I thought,cors: trueanduseDefaultXhrHeader: falseshould do the trick, but they do not.
– Jacobian
Nov 13 '18 at 8:22
1
Remove ` headers: "Access-Control-Allow-Origin": "*" ` from your frontend code. Access-Control-Allow-Origin is a response header, not a request header. Trying to set it as request header is what’s triggering the browser to do that OPTIONS request.
– sideshowbarker
Nov 13 '18 at 22:48
add a comment |
So, I have my localhost with a page, which sends request to a remote site. I try to do it like so:
Ext.Ajax.cors = true;
Ext.Ajax.request(
url: "http://remoteaddress.com",
method: "GET",
headers:
"Access-Control-Allow-Origin": "*"
,
cors: true,
useDefaultXhrHeader: false,
success: function (result, request)
console.log("success!!!");
);
So, I followed dozens of threads and set these parameters - cors, useDefaultXhrHeader etc, but to no avail.
However, if I build the same request in postman (request to the same remoteaddress.com), then it's ok.
So, what I'm doing wrong and how can I fix it?
ajax extjs cors
asked Nov 13 '18 at 8:05
JacobianJacobian
2,018951120
So, I have my localhost with a page, which sends request to a remote site. I try to do it like so:
Ext.Ajax.cors = true;
Ext.Ajax.request(
url: "http://remoteaddress.com",
method: "GET",
headers:
"Access-Control-Allow-Origin": "*"
,
cors: true,
useDefaultXhrHeader: false,
success: function (result, request)
console.log("success!!!");
);
So, I followed dozens of threads and set these parameters - cors, useDefaultXhrHeader etc, but to no avail.
However, if I build the same request in postman (request to the same remoteaddress.com), then it's ok.
So, what I'm doing wrong and how can I fix it?
ajax extjs cors
ajax extjs cors
asked Nov 13 '18 at 8:05
JacobianJacobian
2,018951120
asked Nov 13 '18 at 8:05
JacobianJacobian
2,018951120
asked Nov 13 '18 at 8:05
JacobianJacobian
2,018951120
asked Nov 13 '18 at 8:05
JacobianJacobian
2,018951120
asked Nov 13 '18 at 8:05
JacobianJacobian
2,018951120
2,018951120
1
As I see, the whole problem is withOPTIONSmethod, but I'm not sure how can I switch toGETrequest. I thought,cors: trueanduseDefaultXhrHeader: falseshould do the trick, but they do not.
– Jacobian
Nov 13 '18 at 8:22
1
Remove ` headers: "Access-Control-Allow-Origin": "*" ` from your frontend code. Access-Control-Allow-Origin is a response header, not a request header. Trying to set it as request header is what’s triggering the browser to do that OPTIONS request.
– sideshowbarker
Nov 13 '18 at 22:48
add a comment |
1
As I see, the whole problem is withOPTIONSmethod, but I'm not sure how can I switch toGETrequest. I thought,cors: trueanduseDefaultXhrHeader: falseshould do the trick, but they do not.
– Jacobian
Nov 13 '18 at 8:22
1
Remove ` headers: "Access-Control-Allow-Origin": "*" ` from your frontend code. Access-Control-Allow-Origin is a response header, not a request header. Trying to set it as request header is what’s triggering the browser to do that OPTIONS request.
– sideshowbarker
Nov 13 '18 at 22:48
1
1
As I see, the whole problem is with
OPTIONS method, but I'm not sure how can I switch to GET request. I thought, cors: true and useDefaultXhrHeader: false should do the trick, but they do not.– Jacobian
Nov 13 '18 at 8:22
As I see, the whole problem is with
OPTIONS method, but I'm not sure how can I switch to GET request. I thought, cors: true and useDefaultXhrHeader: false should do the trick, but they do not.– Jacobian
Nov 13 '18 at 8:22
1
1
Remove ` headers: "Access-Control-Allow-Origin": "*" ` from your frontend code. Access-Control-Allow-Origin is a response header, not a request header. Trying to set it as request header is what’s triggering the browser to do that OPTIONS request.
– sideshowbarker
Nov 13 '18 at 22:48
Remove ` headers: "Access-Control-Allow-Origin": "*" ` from your frontend code. Access-Control-Allow-Origin is a response header, not a request header. Trying to set it as request header is what’s triggering the browser to do that OPTIONS request.
– sideshowbarker
Nov 13 '18 at 22:48
add a comment |
2 Answers
2
active
oldest
votes
The request with the OPTIONS-method is a preflight request.
From msdna:
A CORS preflight request is a CORS request that checks to see if the
CORS protocol is understood.
It is an OPTIONS request, using three HTTP request headers:
Access-Control-Request-Method, Access-Control-Request-Headers, and the
Origin header.
A preflight request is automatically issued by a browser, when needed.
In normal cases, front-end developers don't need to craft such
requests themselves.
The webserver has to answer it with the headers to allow the browser to do the actual request.
HTTP/1.1 200 OK
Content-Length: 0
Connection: keep-alive
Access-Control-Allow-Origin: localhost
Access-Control-Allow-Methods: POST, GET, OPTIONS, DELETE
Access-Control-Max-Age: 86400
answered Nov 13 '18 at 15:02
And-yAnd-y
1,33921729
add a comment |
Here is a quick fix for that
Open terminal and run this code
open -n -a /Applications/Google Chrome.app/Contents/MacOS/Google Chrome --args --user-data-dir="/tmp/chrome_dev_sess_1" --disable-web-security
Then just use that new chrome window for development and once you host your website somewhere it will not cause an issue anymore
*note this is MacOs chrome *
answered Nov 13 '18 at 12:23
SundeepSundeep
40012
add a comment |
Your Answer
StackExchange.ifUsing("editor", function ()
StackExchange.using("externalEditor", function ()
StackExchange.using("snippets", function ()
StackExchange.snippets.init();
);
);
, "code-snippets");
StackExchange.ready(function()
var channelOptions =
tags: "".split(" "),
id: "1"
;
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function()
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled)
StackExchange.using("snippets", function()
createEditor();
);
else
createEditor();
);
function createEditor()
StackExchange.prepareEditor(
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader:
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
,
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
);
);
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%2f53276397%2funable-to-make-cors-request-in-extjs-6%23new-answer', 'question_page');
);
Post as a guest
Required, but never shown
2 Answers
2
active
oldest
votes
2 Answers
2
active
oldest
votes
active
oldest
votes
active
oldest
votes
The request with the OPTIONS-method is a preflight request.
From msdna:
A CORS preflight request is a CORS request that checks to see if the
CORS protocol is understood.
It is an OPTIONS request, using three HTTP request headers:
Access-Control-Request-Method, Access-Control-Request-Headers, and the
Origin header.
A preflight request is automatically issued by a browser, when needed.
In normal cases, front-end developers don't need to craft such
requests themselves.
The webserver has to answer it with the headers to allow the browser to do the actual request.
HTTP/1.1 200 OK
Content-Length: 0
Connection: keep-alive
Access-Control-Allow-Origin: localhost
Access-Control-Allow-Methods: POST, GET, OPTIONS, DELETE
Access-Control-Max-Age: 86400
answered Nov 13 '18 at 15:02
And-yAnd-y
1,33921729
add a comment |
The request with the OPTIONS-method is a preflight request.
From msdna:
A CORS preflight request is a CORS request that checks to see if the
CORS protocol is understood.
It is an OPTIONS request, using three HTTP request headers:
Access-Control-Request-Method, Access-Control-Request-Headers, and the
Origin header.
A preflight request is automatically issued by a browser, when needed.
In normal cases, front-end developers don't need to craft such
requests themselves.
The webserver has to answer it with the headers to allow the browser to do the actual request.
HTTP/1.1 200 OK
Content-Length: 0
Connection: keep-alive
Access-Control-Allow-Origin: localhost
Access-Control-Allow-Methods: POST, GET, OPTIONS, DELETE
Access-Control-Max-Age: 86400
answered Nov 13 '18 at 15:02
And-yAnd-y
1,33921729
add a comment |
The request with the OPTIONS-method is a preflight request.
From msdna:
A CORS preflight request is a CORS request that checks to see if the
CORS protocol is understood.
It is an OPTIONS request, using three HTTP request headers:
Access-Control-Request-Method, Access-Control-Request-Headers, and the
Origin header.
A preflight request is automatically issued by a browser, when needed.
In normal cases, front-end developers don't need to craft such
requests themselves.
The webserver has to answer it with the headers to allow the browser to do the actual request.
HTTP/1.1 200 OK
Content-Length: 0
Connection: keep-alive
Access-Control-Allow-Origin: localhost
Access-Control-Allow-Methods: POST, GET, OPTIONS, DELETE
Access-Control-Max-Age: 86400
answered Nov 13 '18 at 15:02
And-yAnd-y
1,33921729
The request with the OPTIONS-method is a preflight request.
From msdna:
A CORS preflight request is a CORS request that checks to see if the
CORS protocol is understood.
It is an OPTIONS request, using three HTTP request headers:
Access-Control-Request-Method, Access-Control-Request-Headers, and the
Origin header.
A preflight request is automatically issued by a browser, when needed.
In normal cases, front-end developers don't need to craft such
requests themselves.
The webserver has to answer it with the headers to allow the browser to do the actual request.
HTTP/1.1 200 OK
Content-Length: 0
Connection: keep-alive
Access-Control-Allow-Origin: localhost
Access-Control-Allow-Methods: POST, GET, OPTIONS, DELETE
Access-Control-Max-Age: 86400
answered Nov 13 '18 at 15:02
And-yAnd-y
1,33921729
edited Nov 13 '18 at 15:09
answered Nov 13 '18 at 15:02
And-yAnd-y
1,33921729
answered Nov 13 '18 at 15:02
And-yAnd-y
1,33921729
answered Nov 13 '18 at 15:02
And-yAnd-y
1,33921729
1,33921729
add a comment |
add a comment |
Here is a quick fix for that
Open terminal and run this code
open -n -a /Applications/Google Chrome.app/Contents/MacOS/Google Chrome --args --user-data-dir="/tmp/chrome_dev_sess_1" --disable-web-security
Then just use that new chrome window for development and once you host your website somewhere it will not cause an issue anymore
*note this is MacOs chrome *
answered Nov 13 '18 at 12:23
SundeepSundeep
40012
add a comment |
Here is a quick fix for that
Open terminal and run this code
open -n -a /Applications/Google Chrome.app/Contents/MacOS/Google Chrome --args --user-data-dir="/tmp/chrome_dev_sess_1" --disable-web-security
Then just use that new chrome window for development and once you host your website somewhere it will not cause an issue anymore
*note this is MacOs chrome *
answered Nov 13 '18 at 12:23
SundeepSundeep
40012
add a comment |
Here is a quick fix for that
Open terminal and run this code
open -n -a /Applications/Google Chrome.app/Contents/MacOS/Google Chrome --args --user-data-dir="/tmp/chrome_dev_sess_1" --disable-web-security
Then just use that new chrome window for development and once you host your website somewhere it will not cause an issue anymore
*note this is MacOs chrome *
answered Nov 13 '18 at 12:23
SundeepSundeep
40012
Here is a quick fix for that
Open terminal and run this code
open -n -a /Applications/Google Chrome.app/Contents/MacOS/Google Chrome --args --user-data-dir="/tmp/chrome_dev_sess_1" --disable-web-security
Then just use that new chrome window for development and once you host your website somewhere it will not cause an issue anymore
*note this is MacOs chrome *
answered Nov 13 '18 at 12:23
SundeepSundeep
40012
answered Nov 13 '18 at 12:23
SundeepSundeep
40012
answered Nov 13 '18 at 12:23
SundeepSundeep
40012
answered Nov 13 '18 at 12:23
SundeepSundeep
40012
40012
add a comment |
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
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%2f53276397%2funable-to-make-cors-request-in-extjs-6%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
1
As I see, the whole problem is with
OPTIONSmethod, but I'm not sure how can I switch toGETrequest. I thought,cors: trueanduseDefaultXhrHeader: falseshould do the trick, but they do not.– Jacobian
Nov 13 '18 at 8:22
1
Remove ` headers: "Access-Control-Allow-Origin": "*" ` from your frontend code. Access-Control-Allow-Origin is a response header, not a request header. Trying to set it as request header is what’s triggering the browser to do that OPTIONS request.
– sideshowbarker
Nov 13 '18 at 22:48