GET query missing with apollo-server-lambda in CloudFront Behaviors - apollo

I used the apollo-server-lambda package to create my lambda function with the serverless framework, as we can see, everything went well.
https://28d1lielb9.execute-api.us-east-1.amazonaws.com/prod
Now I working to place graphql in the same subdomain as my application in CloudFront and I am getting the error GET query missing.
https://forms.ciro-maciel.me/g/p/
I did several tests with the path, but I was not successful.
When did we receive the message GET query missing?
How can I correctly configure my environment?
Thank you

try to understand the codes and note that a playground presentation is conditioned by the code:
const acceptHeader = event.headers ['Accept'] || event.headers ['accept'];
with a log of the CloudFront call make sure the Accept header was not passed to a source.
then in Behaviors, obtain a configuration to be able to pass this header, as you can see below.
CloudFront - Behaviors - Accept
Configured and working!

Thanks to Ciro Cesar Maciel.
I had to add the header as following:
text/html,application/xhtml+xml,application/xml;q=0.9,image/avif,image/webp,image/apng,*/*;q=0.8,application/signed-exchange;v=b3;q=0.9
Edit the origin and add the header:

Related

Unable to set Access-Allow-Control-Origin in AWS api-gateway for CORS - returns invalid format error

I am having trouble with setting up CORS on AWS API-Gateway.
To provide a bit of background, CORS on API_gateway supports 6 fields as below.
Access-Allow-Control-Origin - supports 'https://www.example.com', '*', 'https://*', and 'http://*'
I got this from https://docs.aws.amazon.com/apigateway/latest/developerguide/http-api-cors.html
When I try '*' and 'https://www.domain-name.com', I get the following errors:
I am not sure what format to follow. Also, the '*' seems to be referenced in various links.
Any help greatly appreciated.
If you have enabled cors on your api gateway, the next place to look is the application code such as lambda.
Make sure the Lambda is returning the correct cross origin headers in both successful and failure scenarios. please check if your code is returning cross origin headers all the time.
To troubleshoot,
Method 1:
Check if the request is reaching the lambda from the cloud watch logs. You can find some useful information such as exceptions thrown by the code.
Method 2:
Point the Api gateway target to the Mock integration type. If the mock integration works, then the problem is the application code. otherwise the problem is in your api gateway end point.
Also note that any headers you use should be white listed in the Access-Control-Allow-headers section when you enable to cors for your method/resource.

How do I ensure 'Automatically follow redirects' setting is always disabled?

I'm truing to verify that 301 redirects are configured correctly in my webapp. When I send a request I want to receive 301 response with new expected location header.
It appeared that instead of 301 I receive 200 because of the Postman setting 'Automatically follow redirects' which is enabled OOTB. Disabling the setting fixes my tests.
I'm just wondering how to store this configuration somewhere in the collection? I do not want any other dev (or CI?) to know that there is some setting in the Postman tool that needs to be changed. What if I work on two collections simultaneously where one requires the setting to be disabled and the other one is not?
If you're using Newman, in your CI system, there is a setting for this that you can pass as an argument from the command line. --ignore-redirects.
https://github.com/postmanlabs/newman#newman-options
There are changes coming in to bring this down to the request level in the UI to make it more visible. Currently, there is not a programmatic way to do this in the Collection.
You could include this requirement in the Collection or Request Description, so others would know this needed to be disabled. Likewise, if this was a feature that you enabled without telling these external folks, how would they know that?
If it's something that you would like to see included in the app, you could create a feature request for it on the GH issue tracker repo, it's the only sure-fire way to tell the Postman Team, that this would be a cool feature to include.
https://github.com/postmanlabs/postman-app-support/issues

Setting CORS via API Gateway for Serverless Architecture Model Proxy Endpoint

I am working on a C#/.Net serverless application using the AWS Visual Studio Toolkit, and I am having a bit of trouble figuring out what I am missing as far as CORS configuration. I based my project off of the ASP.Net example included with the toolkit, which configured API Gateway to have a single API endpoint that works as a proxy into the ASP.Net Web API framework.
In testing this application in chrome (serving a local node project) I am getting No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:8080' is therefore not allowed access.
I know this means I have to configure CORS on the API Gateway endpoint, but I seem to be missing something. I use the actions dropdown to enable CORS as such...
But I get some errors and the problem persists.
I used a chrome extension to disable CORS (temporarily) and have confirmed that the API endpoint works normally without CORS.
So what am I missing here? The examples of setting CORS online don't usually have instructions of a catch-all endpoint like this is set up to use, and even breaking GET into its own method didn't seem to help.
As an additional question, if there is some CORS configuration I am missing, is there a good way to get it integrated into the serverless.template file or some other automated deploy step?
It has to do with your ANY proxy method. As stated here: http://docs.aws.amazon.com/apigateway/latest/developerguide/how-to-cors.html
Note
When applying the above instructions to the ANY method in a proxy integration, any applicable CORS headers will not be set. Instead, you rely on the integration back end to return the applicable CORS headers, such as Access-Control-Allow-Origin
So you will have to make your backend API return the appropriate CORS headers.
You need to have the header on your server as well as the api gateway.
See this sample: - The cors header is applied to the static bucket website
https://www.codeproject.com/Articles/1178781/Serverless-Architecture-using-Csharp-and-AWS-Amazo
For the APIs to work properly two things must be done:
1. The options method must be correctly setup - usually done using a mock method on the API gateway.
2. The HTTP method implementations in your code must return the CORS header correctly. There are quite a few articles about this if you search.
For me the problem was Point 1; using the API Gateway 'Enable CORS' button did not work for me when I was developing API-Gateway Lambda integration using .NET Core. I also didn't find a way to add creation of the options method in the serverless.template file.
Here's another way to do it; after publishing the lambdas from CLI or VisualStudio, fire a PUT request on the API endpoint and pass a swagger definition which contains the options method defs and ensure you set the query param mode=merge. You can use PostMan to do this.
or
You use a DotNet utility which does the same thing explained here:
http://sbytestream.pythonanywhere.com/blog/Enabling-APIGateway-CORS
The source code is available on GitHub too.

API Gateway - Get StatusCode

This should have been such a simple issue and I don't understand why it hasn't come up through all my searching (maybe it's just been a long day).
I have an API Gateway API setup, and I am adding a Body Mapping Template to my Integration Response for a 400* error group: see image -
All I would like to get is the StatusCode of the current response (as this is a 400* group - e.g. 401 / 403 / 404 etc.)
The closest I came was through this site: AWS help documentation and I thought I would be able to use something like $context.statusCode - but no luck.
Am I going crazy, or is this just not something required often?
PS - Making changes to any Lambda functions being called, is not an option.
Thanks
There's currently no mapping template variable in API Gateway dedicated to the integration response status code.
We will certainly add this as a feature request.
At current time you are limited to hardcoding the status code value in your response templates. You would either need to define generic status codes (i.e "4XX") or define integration responses for every status code you want to capture. While this seems tedious, this could be managed relatively easily in a Swagger template.
At current time the only way to see the integration response status code is via CloudWatch Logs.
Thanks,
Ryan / Amazon API Gateway
If you are sending error codes from your server then you can easily map them.
I have done something similar but I have used different trick to do. I used to send my own error entities and codes from server.
You have to map those error entities and error codes coming from server to the response that comes from amazon servers. I will try and explain what I mean by this. Api Gateway doesn't send response coming from your own server to the client automatically. You have to map those responses. For example, map 200 as a SUCESS and response entity will be default, that is whatever coming from server.
Now, we default success response is managed but what about error codes and error entities. You have to map them manually.
There are two ways you can do this,
One is manual, go to your api. Create error entities or models. Map them manually for each response code.
This one uses swaggger,
Solution is to import swagger specification of error entities. Add response templates to the swagger specification and let amazon do their job.
I can help you more with swagger. It depends how you are setting up your api on amazon.
Visit this for amazon extenstions to swagger,
http://docs.aws.amazon.com/apigateway/latest/developerguide/api-gateway-swagger-extensions.html#api-gateway-swagger-extensions-integration-response

API Gateway CORS Issue

So I have CORS enabled going through the basic setup given by AWS Gateway. However for this API I need to allow Control Origins for all requests and allow credentials.
Here is what it looks like
The issue as you may have guessed is this setup is not allowed by CORS, you can not have a wildcard for Origin and have credentials as true. Normally the work around for this is to just grab the requesting domain and add it into the Origin Header. Which is more or less what I want to do. But I don't know how to get that information and add it as a mapping value. Where does API Gateway store that information and how do i get it?
UPDATE:
I have to pass through HTTP Header Host to my Lambda Function which I should have mentioned earlier, I have tried implementing the Answer below but I cannot access the header to pass it to the Lambda function using the instructions provided. Any more assistance with this is greatly appreciated.
Okay After hours of research and finding bits of information across the internet I have a solution and hopefully it is useful for other people.
To pass an HTTP Header that is not a default value provided by AWS API Gateway and then access that data via a Lambda Function and return that data in the Response Header follow the steps below
In "Method Request" go to "HTTP Request Headers" and add your desired header to capture. ie. if we want to get the host value of the API url you can enter "Host" here. if you want to get the website host of the caller use "Origin"
In "Integration Request" go to mapping templates and create a new template if an "application/json" does not exist, if it does just update it.
This is the important part, pass the header value you set in step 1. To do that write something similar to the following in the Template Box.
{
"origin" : "$input.params().header.Origin",
"host" : "$input.params().header.Host"
}
You can also pass in any url parameters you have defined in the same JSON.
Access the data from Lambda, The integration request passed the information into the "Event" parameter if using Node as the Lambda Backend code. to retrieve the value of any header just use the following within your handler.
event.origin;
When sending back your response from Lambda to API Gateway, it is best to format the response in JSON. Something similar to this.
{
"origin" : event.origin,
"host" : event.host,
"nonHeaderOutput" : "Hello World"
}
In "Integration Response" go to "Header Mappings", if the header you need is not listed you may add it in "Method Response" and it will then appear here. For this example I used "Access-Control-Allow-Origin" and edited the Mapping Value to be integration.response.body.origin
now go to "Mapping Templates and select the content type you want to use, and then edit the template to access the non header responses by adding this to the Template Box
$input.path("$.nonHeaderOutput")
That is it now the header that was sent to the API can be used in your method Response.
Jurgen from API Gateway here.
Thanks for reporting this issue. There is currently no simple way to set it up via the "Enable CORS" feature in the console. However, we are looking into it to improve the user experience for this use case.
As a potential workaround, you could passthrough the Origin header from the client to your backend and parse / create the value for the Access-Control-Allow-Origin header there. Then you would map the Header in the Integration Response from 'integration.response.header.Access-Control-Allow-Origin' to Access-Control-Allow-Origin and return it to the client.
Hope this helps.
Best,
Jurgen