I finally understood where I was coming from a problem that I could not understand about the recovery of the Location of my header.
I found on this page that the problem comes from CORS. I need to specify: Access-Control-Expose-Headers: Location.
However after looking at several forums I still do not understand where I have to put: Access-Control-Expose-Headers: Rental.
Can you help me understand please? Note that I work with ReactJs.
Do you actually NEED access to the Location header? Is there any way to achieve what you want without it? Your redirects should still function just fine - it's simply that by not being 'exposed' (via the Access-Control-Expose-Headers: Location) response header, you can't do anything with it in your client-side JavaScript.
Related
I am trying to make a POST request to an AWS Lambda Python Script I have set up.
I have already heard about solving the issue of Access-Control-Allow-Origin by adding a header to the Response from AWS lambda, that looks like Access-Control-Allow-Origin:*, and I implemented this in the code I was working on for the get request. Then when I begun creating a POST request, I did the same thing, so that the new POST request originally looked like this:
def post(event, context):
try:
return dict(
statusCode=200,
headers= {'Access-Control-Allow-Origin': "*"},
body="test"
)
except Exception as ex:
return dict(
statusCode=500,
body=str(ex)
)
And this works, in Chrome's Network-Tab I see that we pass a post request and there is no issue, and the header is recognized properly, allowing Cross-Origin calls. But this is pretty much just the GET request I have which is already set up and working. So when I update it to be more similar to a POST METHOD and do what I want the problems begin.
So my code, that I want to be performed in the POST request is simple, I should be able to make the request like such,
def post(event, context):
try:
result=str(event.get("inputOne") + event.get("inputTwo"))
return dict(
statusCode=200,
headers= {'Access-Control-Allow-Origin': "*"},
body=result
)
except Exception as ex:
return dict(
statusCode=500,
body=str(ex)
)
When I test this in the AWS Lambda Management console, my code works, and I get the expected response back in the body.
But then when I try and call the POST endpoint from my React Site, I once again am getting the error:
Access to XMLHttpRequest at 'THE_POST_URL' from origin
'http://localhost:XXX' has been blocked by CORS policy: No 'Access-
Control-Allow-Origin' header is present on the requested resource.
So for some reason, when the body variable is not just a simple string in quotes like "this" <- it fails. I believe this has to do with the Content-Type in the request being of the form application/json;charset=UTF-8 while my request only accepts (as it says in dev-tools) application/json however even when trying to add the headers to accept this format for content-type, I am still getting the same issues.
I am not entirely sure why the header worked on the GET request, but not the POST request, and would appreciate anyone being able to help teach me, thank you!
EDIT: I have also tried adding 'Access-Control-Allow-Methods': "OPTIONS,GET,POST" to the headers of the post response, but this did not work either.
So after reading through the comments on my question, I decided it was worth going and taking a harder look at the way I had my API Gateway, and Lambda service set up on AWS.
I began using the curl utility in order to try and test my post-call from a terminal utility and found that there it was also failing, but I was able to use CloudWatch to debug, the issue and finally get it working.
The problem that I was facing with my curl Request was that I was not properly formatting the JSON input, but even when I was the Lambda was transforming the event improperly, not resulting in a Dict, as expected.
The curl call I was using can be seen:
curl -X POST https://myURL.execute-api.myREGION.amazonaws.com/stage/yourPOST \
-d '{"inputOne":80000,"inputTwo":85}'
But in order to read that input properly, and then work with it, I had to update my code in the Lambda to reflect parsing the input properly, this updated lambda code can be found here. The event object that you are passing to this lambda is a DICT object, so on the first line, we use JSON.loads to decode the "body" value of the event, into a dict that we store as body. Then to get the value of the two attributes, we use the command body.get("yourKey").
def yourPOST(event, context):
body=json.loads(event["body"])
a=body.get("inputOne")
c=body.get("inputTwo")
After making these changes the call from my React site works without error! If anyone has any questions feel free to comment, I hope this helped!
Im trying to implement an Oauth1 login to garmins using Angular2 and regular http calls, but on the first call to oauth/request_token path i get a pre-flight OPTIONS call error seems not having CORS enabled or something.
It may anyone tried or did this before?
Thanks
You have to set Origin in your header (my suggestion is to do it with an interceptor) and then in your server config allow your domain or localhost:port to access it.
I am currently trying to get some documents from CouchDB with AngularJS. My server is running locally on localhost:5984, ans I cannot access it from Brackets' renderer.
The error is the following one:
XMLHttpRequest cannot load http://127.0.0.1:5984/generator/_all_docs. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://127.0.0.1:54142' is therefore not allowed access.
This error sounds well known and a real pain to deal with, and I already tried methods from this question and searched some other sources, but nothing seems to work. My CouchDB server looks like it is well configurated, with the following members inside its configuration properties:
[cors]
credentials = false
headers = accept, authorization, content-type, origin, referer, cache-control, x-requested-with
methods = GET,PUT,POST,HEAD,DELETE
origins = http://localhost
[httpd]
enable_cors = true
I do not need credentials, at the moment, to access my data, I just need to access them from AngularJS. I would like to know what did I do / where did I go wrong, and if ever I did something wrong with my configuration or anything, how to finally allow my application to access those data. I know this is a CORS problem but as far as I tried, I found no way of doing so.
Thank you in advance !
EDIT
I am using CouchDB 1.6.1 and AngularJS, with Windows Seven. I did not try on other web browsers, but the problem currently happens with Google Chrome.
Okay, so I solved the problem.
The solutions proposed in this topic are correct and solved the problem, but you must not fail while editing your fail. I'll explain:
When I first tried, I forgot a 's' in 'origins', and then suppressed my mistake it from the control panel. The control panel just suppresses the value, and not the original tag. When I tried again, this time by editing manually the local.ini file, I found this line:
origin =
Which was, I guess, interfering with the good interpretation of the rest of the file.
When I removed it, everything went smoothly
Problem solved, thanks to The Head Rush which pushed me on the way to victory with his commentary.
I mocking my API using Apiary.io. But somehow I cannot read any headers from response object using angularJS. And I am sure i have at least Content-Type: application/json correctly set-up by checking in firebug. Code in Angular should read headers correctly too as i can print them when sending request to somewhere else than apiary.io...
$http.get('http://ies.apiary.io/some').then(function(response) {
console.log("ok",response.headers('Content-Type'));
},function(response){console.log("err",response);});
http://plnkr.co/edit/zMO0pXGsIdJkV0fZdBdw
It all boils down to a bug in firefox: https://bugzilla.mozilla.org/show_bug.cgi?id=608735
For CORS request, firefox is not returning anything for req.getAllRequestHeaders(), although req.getRequestHeader('Content-Type') returns properly.
Either FF bug has to be fixed or Angular must work around it (as jQuery does) or you must go deeper and use XmlHttpRequest instance directly.
This was maybe also related, but probably not the core issue:
However, few days ago, Apiary.io was not setting Max-Age in CORS headers. Thus, if you had a minimal blueprint, you might have CORS pre-flight response cached and thus subsequent requests may be disallowed even if you added additional resources to your blueprint.
Max-Age is now set to 10 seconds, so it should work properly. However, depending on your browser, pre-flight cache might still affect you. Try purging it or test this app in another browser.
I'm trying to better understand Cross Site Scripting and lets use:
http://api.beatport.com/crossdomain.xml as the example.
The XML lists that all domains are allowed access. However when I make the request from within my HTML page (or from within the console) it will fail with an error similar to:
XMLHttpRequest cannot load http://api.beatport.com/catalog/tracks. Origin <mydomain> is not allowed by Access-Control-Allow-Origin.
What I find weird though, is if I put the request in the address bar of my browser, the request goes through.
Can someone please explain what is going on and what I need to do to fix this because clearly the API allows access from any domain.
XMLHttpRequest doesn't look at crossdomain.xml, it looks at Access-Control-Allow-Origin header as mentioned in the error message.
So the server needs to send a header like this:
Access-Control-Allow-Origin: *
If they don't send that header (http://api.beatport.com/catalog/tracks doesn't), it will be denied.