Getting 400 bad request when trying to access an API using Angular, but it works perfectly fine when using PostMan
I have already tested this API and have made a GET request on the API using PostMan and got the response. But when trying to implement it on my Angular 6 application I get a 401 unauthorized error. This is my angular code.
this.http.get('https://api.channeladvisor.com/v1/orders',headers:'Authorization':'Bearer *token*','Content-Type':'application/x-www-form-urlencoded','cache-control':'no-cache')
.subscribe((response)=>
this.channel=response;
console.log(this.channel)
)
}
I have the token and have not displayed it in the code for security reasons. I have a feeling it has something with the headers syntax but i'm not so sure.
angular api http postman http-status-code-400
add a comment |
I have already tested this API and have made a GET request on the API using PostMan and got the response. But when trying to implement it on my Angular 6 application I get a 401 unauthorized error. This is my angular code.
this.http.get('https://api.channeladvisor.com/v1/orders',headers:'Authorization':'Bearer *token*','Content-Type':'application/x-www-form-urlencoded','cache-control':'no-cache')
.subscribe((response)=>
this.channel=response;
console.log(this.channel)
)
}
I have the token and have not displayed it in the code for security reasons. I have a feeling it has something with the headers syntax but i'm not so sure.
angular api http postman http-status-code-400
Just check if the authentication mechanism is passed in headers in Postman where the header tab is different and you overlooked it... just in case...
– Ketan
Nov 14 '18 at 23:32
Under the headers in Postman the key is 'Authorization' and the value is 'Bearer token. Everything seems to be exactly the same in Postman
– Travis Poulose
Nov 14 '18 at 23:41
I just reallized that I was making a post request on the api rather than a get. But now i'm getting another error. 400 bad request.
– Travis Poulose
Nov 14 '18 at 23:56
add a comment |
I have already tested this API and have made a GET request on the API using PostMan and got the response. But when trying to implement it on my Angular 6 application I get a 401 unauthorized error. This is my angular code.
this.http.get('https://api.channeladvisor.com/v1/orders',headers:'Authorization':'Bearer *token*','Content-Type':'application/x-www-form-urlencoded','cache-control':'no-cache')
.subscribe((response)=>
this.channel=response;
console.log(this.channel)
)
}
I have the token and have not displayed it in the code for security reasons. I have a feeling it has something with the headers syntax but i'm not so sure.
angular api http postman http-status-code-400
I have already tested this API and have made a GET request on the API using PostMan and got the response. But when trying to implement it on my Angular 6 application I get a 401 unauthorized error. This is my angular code.
this.http.get('https://api.channeladvisor.com/v1/orders',headers:'Authorization':'Bearer *token*','Content-Type':'application/x-www-form-urlencoded','cache-control':'no-cache')
.subscribe((response)=>
this.channel=response;
console.log(this.channel)
)
}
I have the token and have not displayed it in the code for security reasons. I have a feeling it has something with the headers syntax but i'm not so sure.
angular api http postman http-status-code-400
angular api http postman http-status-code-400
edited Nov 15 '18 at 0:04
HDJEMAI
4,434144059
4,434144059
asked Nov 14 '18 at 23:14
Travis PouloseTravis Poulose
104
104
Just check if the authentication mechanism is passed in headers in Postman where the header tab is different and you overlooked it... just in case...
– Ketan
Nov 14 '18 at 23:32
Under the headers in Postman the key is 'Authorization' and the value is 'Bearer token. Everything seems to be exactly the same in Postman
– Travis Poulose
Nov 14 '18 at 23:41
I just reallized that I was making a post request on the api rather than a get. But now i'm getting another error. 400 bad request.
– Travis Poulose
Nov 14 '18 at 23:56
add a comment |
Just check if the authentication mechanism is passed in headers in Postman where the header tab is different and you overlooked it... just in case...
– Ketan
Nov 14 '18 at 23:32
Under the headers in Postman the key is 'Authorization' and the value is 'Bearer token. Everything seems to be exactly the same in Postman
– Travis Poulose
Nov 14 '18 at 23:41
I just reallized that I was making a post request on the api rather than a get. But now i'm getting another error. 400 bad request.
– Travis Poulose
Nov 14 '18 at 23:56
Just check if the authentication mechanism is passed in headers in Postman where the header tab is different and you overlooked it... just in case...
– Ketan
Nov 14 '18 at 23:32
Just check if the authentication mechanism is passed in headers in Postman where the header tab is different and you overlooked it... just in case...
– Ketan
Nov 14 '18 at 23:32
Under the headers in Postman the key is 'Authorization' and the value is 'Bearer token. Everything seems to be exactly the same in Postman
– Travis Poulose
Nov 14 '18 at 23:41
Under the headers in Postman the key is 'Authorization' and the value is 'Bearer token. Everything seems to be exactly the same in Postman
– Travis Poulose
Nov 14 '18 at 23:41
I just reallized that I was making a post request on the api rather than a get. But now i'm getting another error. 400 bad request.
– Travis Poulose
Nov 14 '18 at 23:56
I just reallized that I was making a post request on the api rather than a get. But now i'm getting another error. 400 bad request.
– Travis Poulose
Nov 14 '18 at 23:56
add a comment |
1 Answer
1
active
oldest
votes
May you can try add them to your headers:
'authorization': 'bearer ' + token,
'Authenticationtoken': 'bearer ' + token,
'X-Requested-With' : 'XMLHttpRequest'
My API used CakePHP3, same issue happen long ago, after added above 3 parameters everything ok :)
And more, please track your request by developer tools, and compare the difference between sucess and failed.
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%2f53310166%2fgetting-400-bad-request-when-trying-to-access-an-api-using-angular-but-it-works%23new-answer', 'question_page');
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
May you can try add them to your headers:
'authorization': 'bearer ' + token,
'Authenticationtoken': 'bearer ' + token,
'X-Requested-With' : 'XMLHttpRequest'
My API used CakePHP3, same issue happen long ago, after added above 3 parameters everything ok :)
And more, please track your request by developer tools, and compare the difference between sucess and failed.
add a comment |
May you can try add them to your headers:
'authorization': 'bearer ' + token,
'Authenticationtoken': 'bearer ' + token,
'X-Requested-With' : 'XMLHttpRequest'
My API used CakePHP3, same issue happen long ago, after added above 3 parameters everything ok :)
And more, please track your request by developer tools, and compare the difference between sucess and failed.
add a comment |
May you can try add them to your headers:
'authorization': 'bearer ' + token,
'Authenticationtoken': 'bearer ' + token,
'X-Requested-With' : 'XMLHttpRequest'
My API used CakePHP3, same issue happen long ago, after added above 3 parameters everything ok :)
And more, please track your request by developer tools, and compare the difference between sucess and failed.
May you can try add them to your headers:
'authorization': 'bearer ' + token,
'Authenticationtoken': 'bearer ' + token,
'X-Requested-With' : 'XMLHttpRequest'
My API used CakePHP3, same issue happen long ago, after added above 3 parameters everything ok :)
And more, please track your request by developer tools, and compare the difference between sucess and failed.
answered Nov 15 '18 at 0:01
Nick WangNick Wang
54925
54925
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%2f53310166%2fgetting-400-bad-request-when-trying-to-access-an-api-using-angular-but-it-works%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
Just check if the authentication mechanism is passed in headers in Postman where the header tab is different and you overlooked it... just in case...
– Ketan
Nov 14 '18 at 23:32
Under the headers in Postman the key is 'Authorization' and the value is 'Bearer token. Everything seems to be exactly the same in Postman
– Travis Poulose
Nov 14 '18 at 23:41
I just reallized that I was making a post request on the api rather than a get. But now i'm getting another error. 400 bad request.
– Travis Poulose
Nov 14 '18 at 23:56