Setting Error Pages for a specific path - amazon-cloudfront

I am using ECS for a webapp, and i setup an Error Pages definitions for codes 404 and 502. My current setup returns a static maintenance.html file (hosted on S3) and returns a code of 200. I have to return 200, otherwise Outlook (which hosts my app) will not render the returned html, and show an ugly error page instead.
The problem I'm having with it, is that a later API call from my clientside app to my server, might also return 404. With the current setup, CloudFront intercepts this reply, and returns the maintenance.html with code 200. So now my app doesn't know anything is wrong, and later fails on parsing the reply.
Is there a way to define the Error Pages to only handle specific requests? For my usage, I'd like them to only handle calls to my /static/index.html files. If some other file/API call is actually missing from the server, I'd like my client to get the 404, so it can handle it properly.

So to answer your question according to the documentation I read there is currently no way to do this from cloudfront Error Pages Config.
However, We had a similar problem, but in our case API calls were returning a 500 Error with a s3 custom error html instead of the actual server error that I expected only for API calls.
What we ended up doing in this case was a handler in the back end for 500 errors that would return a response code that we were not using in the cloudfront Error Pages if the request Url had the pattern of API calls (we used http Error Code 406) and then the handler will reply with the 406 response code and the whole error instead of the 500 with the s3 response html only when failed over the api url pattern. I know this does not solve the problem the way you would have like to, but probably you may find it helpful until cloudfront allows a custom error response based in a Path Pattern.

Related

axios network error with cors activated still returns error

the link to the code link
I am using axios and nodejs.
All routes work and give a response except one. which returns Network error.
that route is /api/ads/myads.
The route works on its own but when used with redux actions it doesn't
The network tab says that this request was blocked.
So I tried to add cors but that didn't solve the issue.
The file in question is .../actions/adActions this one is producing the error while others don't
I will be uploading the code in a minute
This turned out to be my adblocker thinking this was actual ads

Browser not showing Internal Server Error HTML Page with status 500

I've two components in my application. A frontend which is built on Angular and backend built using express. I'm using the Nest.js framework in the backend.
I have an http-exception.filter.ts file which takes care of any thrown exception. So far, I've been handling Internal Server Error in the application this way.
if(exception.getStatus() === 500) {
response
.status(500)
.json({
status: '500',
code: 'INTERNAL_SERVER_ERROR',
message: 'Internal Server Error'
});
}
But, now an HTML page has been designed showing Internal Server Error message. All I need to do to render that page is to hit the URL /ui/internal-server-error. So, I tried to that using the code below.
response
.status(500)
.redirect('/ui/internal-server-error');
The page loads when a case of internal server error occurs, but the problem is I'm not getting 500 status when I'm reading the network logs in the browser. Instead, I'm getting 304 Not modified status.
Could anyone please point me in the right direction? I want to show the error page along with status code 500 and the UI page needs to come from Frontend only as I've no access over it.
When redirect is called, it sets the status, so the 500 is replaced.
From the express docs (relevant as NestJS uses Express by default):
Redirects to the URL derived from the specified path, with specified status, a positive integer that corresponds to an HTTP status code . If not specified, status defaults to “302 “Found”.
res.redirect('/foo/bar')
res.redirect('http://example.com')
res.redirect(301, 'http://example.com')
res.redirect('../login')
Add the desired status as an argument to redirect.

Unable to get redirect response from Node server using res.writeHead() and .end()

I'm writing a server in Node.js. I've been using the send-data/json package to send responses, with much success. For example, at the end of my API call I use this code:
sendJson(res, res, {some: content})
This works great. However, I have a need to implement a URL redirect in one of my API endpoints. The code I am seeing everywhere to do this looks like this:
res.writeHead(302, {Location: 'http://myUrl.com'})
res.end()
However, this change causes my server to stop sending responses on this endpoint.
What am I missing?
Note: this is vanilla Node without Express.
Update: to clarify, based on contributions in the comments, this is the result of a GET request, so I expect that redirects should be enabled by default. I am still curious why no response is coming back from the server at all, regardless of whether it is an erroneous redirect attempt or a successful one.

204 error code then 500 error code responses

So I have an application which needs to send data to the API which is created by our team leader using NodeJS with Express.js.
On my end I have laravel application which using VueJS for the UI. Inside the Vue JS component. I am using axios to request to the API.
axios.post('https://clearkey-api.mybluemix.net/sendcampaign', request)
.then(function(response) {
//console.log(response);
})
However, it returns 204 which means according to this https://www.w3.org/Protocols/rfc2616/rfc2616-sec10.html.
204 No Content
The server has fulfilled the request but does not need to return an
entity-body, and might want to return updated metainformation. The
response MAY include new or updated metainformation in the form of
entity-headers, which if present SHOULD be associated with the
requested variant.
If the client is a user agent, it SHOULD NOT change its document view
from that which caused the request to be sent. This response is
primarily intended to allow input for actions to take place without
causing a change to the user agent's active document view, although
any new or updated metainformation SHOULD be applied to the document
currently in the user agent's active view.
The 204 response MUST NOT include a message-body, and thus is always
terminated by the first empty line after the header fields.
Then next it returns 500 Internal Server Error. So in my opinion it returns this error because there is no content to be returned from the server?
Can you tell me other possible problems why it return that response?
Check if the "HTTP method" of the 204 is OPTIONS and if the method of the 500 is POST.
If both are like that, then you are seeing first a CORS pre-flight request (the OPTIONS that returns 204) and then the actual request (the POST that returns 500).
The CORS pre-flight request is a special HTTP message your browser sends to the server when the webpage and the backend are hosted at different addresses. For example, if your website is hosted at http://localhost but the backend you are trying to access is hosted at https://clearkey-api.mybluemix.net.
The reason of the 204 just means your backend endpoint is correctly setup to handle requests for /sendcampaign (you can ignore it). The reason of the 500 is because of some exception in the implementation of the function that handles that endpoint.

Error handling in express based on how a resource is called?

I am using express.
I am handling a Get request like below.
router.get('/user', user.getSessionInfo);
On client side I am using Angularjs.
I want to customize my error handling in nodejs based upon how a resource is being called, i.e. when /user is called via an $http call or directly from browser url so that I can return(if an error happens) either a json error obj or an error page(html).
I tried using req.xhr to decide whether the call is an ajax or not but I am getting false in both cases(not getting X-Requested-With header via $http.get)
So to achieve my functionality Can I depend upon
req.headers['accept'];
as from ajax call it will be
"application/json, text/plain, */*"
and when called from the browser url bar it will be
"text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,*/*;q=0.8"
Is my way the best or there is a better way of handling it?
There is another way,use query param(dot extension) to decide resource type:
GET /api/user.json
GET /api/user.html
GET /api/user.xml
and it seems than this solution is more complicated to achieve in Express.
req.xhr was removed in angular. Read here why removed and how to get it back
https://github.com/angular/angular.js/commit/3a75b1124d062f64093a90b26630938558909e8d

Resources