NGINX and Gatsby: Setting up nginx to route to Gatsby 404 page - nginx

I have a Gatsby site set up with nginx. I know that Gatsby uses whatever component that exists in the pages/404.js as the 404 page. If I navigate to www.mysite.com/404 I can see the custom Gatsby 404 page I created, however this is the only time I see the Gatsby 404 component. If I navigate to www.mysite.com/blahblahblah or any other non-existent page I see the default white nginx 404 page.
I'm familiar with Gatsby but a noob when it comes to nginx. How can I set up my nginx config to redirect my users to my custom Gatsby 404 component when the user navigates to a non-existent page instead of showing the default nginx 404 page?
Here is my nginx config:
server {
listen 80;
sendfile on;
default_type application/octet-stream;
root /usr/share/nginx/html;
location / {
try_files $uri $uri/ /index.html =404;
}
}

I was just in the same situation. I'll share what (seems to have) worked for me. Like you, I'm using Gatsby and I have a file at pages/404.js that I'd like to use as a catch-all for missing routes. I found the answer given by #ivo-gelov here helpful: How nginx process =404 fallback in try_files
Specifically, I just added an error_page definition to match up with the =404 error code:
error_page 404 /404.html;
location / {
try_files $uri $uri/ /index.html =404;
}

Related

Configuring NGINX location to include subpaths

I have an NGINX location block configured as below. This redirects to an angular Application and works fine. However, when I navigate to a subpath in the angular application such as /path/subdir, then NGINX returns 404.
Apparently this location block only sends requests to /path but not /path/other to Angular.
location /path {
try_files $uri $uri/ =404;
}
I've tried variations such as these with the same result
location /path/
location /path/.*
How do I get NGINX so send all traffic sent to anything under /path to the same Angular application, so that the Angular application can then handle routing to sub-directories such as/path/subdir?
Well I ended up with this little horror show, but it seems to work.
location ~ ^/path(?:/(.*))?$ {
root /usr/share/nginx/html;
index index.html;
try_files $uri $uri/ /path/index.html =404;
}

Dokku redirects to another domain when requested site is down

I have Dokku installed on a server, with multiple sites/domains deployed to it. When one of my sites goes down, all HTTP requests to it get redirected (for some reason) to another site. This is confusing. I'm expecting Dokku to show some error page in this case. Is it the default behavior or I did something wrong?
PS. This is the problem: https://github.com/dokku/dokku/issues/2602
How about adding a custom error page based on the error code by editing vhost file:
server{
server_name www.foo.com;
root /srv/www/foo/public_html;
expires 1M;
access_log /srv/www/foo/logs/access.log;
error_log /srv/www/foo/logs/error.log;
error_page 404 /404.html;
location / {
index index.html;
rewrite ^/(.*)/$ /$1 permanent;
try_files "${uri}.html" $uri $uri/ =404;
}
location = /404.html {
internal;
}
}
Your server error might be caught from codes 404 or 500

How to correct my nginx configuration if it is wrong?

I am new to nginx. I try to learn using search www and stackoverflow. Mostly I get help to understand how to build my nginx configuration.
I have my domain as www.mysite.com. Everything; landing page, the error and server error must be redirect to default index.html. I also define my access and error log. All this done (below code) inside the /etc/nginx/conf.d/default.conf.
I need to redirect (proxy_pass) /admin, /user and anything related to them. Example the /admin has also different folder like /admin/login/. I need to everything after /admin must be redirected. The same goes also for the /user as well.
1) Looking at my code am I redirect the location /admin and location /user correctly?
2) I also use try_files $uri $uri/ =404; in redirection. which also redirects the 404 to default index.html. Am I doing right?
3) I am also denying access to some file and folder. Am I doing right?
My main question is How to correct my nginx configuration if it is wrong? So to understand the correct nginx configuration I divide my question to 3 different question above. I hope I didnt brake stackoverflow how to ask question guidelines.
Thank you.
UPDATE:
server {
charset UTF-8;
listen 80;
listen [::]:80;
server_name www.mysite.com;
access_log /var/log/nginx/host.access.log main;
error_log /var/log/nginx/host.error.log main;
# define a root location variable and assign a value
set $rootLocation /usr/share/nginx/html;
# define www.mysite.com landing page to the static index.html page
location / {
root rootLocation;
index index.html index.htm;
}
# define error page to the static index.html page
error_page 404 /index.html;
location = /index.html {
root rootLocation;
internal;
}
# redirect server error pages to the static index.html page
error_page 500 502 503 504 /index.html;
location = /index.html {
root rootLocation;
internal;
}
# redirect www.mysite.com/admin to localhost
# /admin or /admin/ or /admin/**** must be redirect to localhost
location /admin {
proxy_set_header X-Forwarded-For $remote_addr;
proxy_set_header Host $http_host;
proxy_pass "http://127.0.0.1:3000";
}
# redirect www.mysite.com/user to localhost
# /user or /user/ or /user/**** must be redirect to localhost
location /user {
proxy_set_header X-Forwarded-For $remote_addr;
proxy_set_header Host $http_host;
proxy_pass "http://127.0.0.1:3001";
}
}
It is usual to place the root statement once in the server block, rather than repeat the same value in multiple location blocks.
You are using proxy_pass to change the URI before passing it upstream. In this case, the location value and the URI part of the proxy_pass value should either both end with / or neither end with /. See this document for details.
Usually you do not want to place try_files and proxy_pass in the same location. This causes Nginx to check for the existence of the file in its document root before allowing the request to pass upstream.
You should not need to deny access to the configuration files, as these file should not be within the document root in the first place.

Using try_files with uwsgi

I am trying to use the nginx try_files directive with uwsgi_pass and having a ton of difficulty.
Basically what I want is for try_files to ask the uWSGI container if the request URI is valid and if not, then serve up the index.html file instead. My nginx config is as follows:
server {
listen 80;
access_log /tmp/nginx.log;
location / {
try_files $uri $uri/ /index.html;
include uwsgi_params;
uwsgi_pass 127.0.0.1:5001;
}
}
But what this does is check the docroot for every request and if its not there, it simply bails and returns the index.html file.
What I want instead is the following:
Request comes in for www.myapp.com
nginx forwards this request onto the uWSGI container
If that is invalid, then return the index.html
Is there a way to 'ask' uWSGI to try the files instead?
What I'm ultimately trying to accomplish here is HTML5 Pushstate with React Router. I'm running a Flask app with a React front-end. If the user refreshes the browser at www.myapp.com/preferences/userid, then I want nginx to forward that to the container and if its invalid, to return the index.
So, after talking with #Chamindu, I realized I was probably going about this the wrong way. I prevented uWSGI from serving my index.html (even though it could) and instead relied on nginx to serve that instead.
server {
listen 80;
access_log /tmp/nginx.log;
location / {
root /var/www/myapplication/;
try_files $uri $uri/ /index.html;
}
location /api {
include uwsgi_params;
uwsgi_pass 127.0.0.1:5001;
}
}

403 forbidden on wordpress index with nginx, the rest of the pages work fine

I'm setting up my blog on a new EC2 instance because one of the sites on the server that's currently hosting it is being DDoSed.
I'm having some trouble with nginx, because I can either see all the pages fine but 403 on the index, or see the index but 404 on the pages (depending on the config I'm using)
Here's my nginx config:
server {
listen 80;
server_name www.test.com;
server_name test.com;
root /www/blog;
include conf.d/wordpress/simple.conf;
}
And simple.conf:
location = /favicon.ico {
log_not_found off;
access_log off;
}
location = /robots.txt {
allow all;
log_not_found off;
access_log off;
}
location / {
# This is cool because no php is touched for static content.
# include the "?$args" part so non-default permalinks doesn't break when using query string
try_files $uri $uri/ /index.php?$args;
}
location ~ \.php$ {
#NOTE: You should have "cgi.fix_pathinfo = 0;" in php.ini
include fastcgi.conf;
fastcgi_intercept_errors on;
fastcgi_pass unix:/var/run/php-fpm/php-fpm.sock;
}
location ~* \.(js|css|png|jpg|jpeg|gif|ico)$ {
expires max;
log_not_found off;
}
if I change the try_files $uri $uri/ /index.php?$args; to index index.php, the front page will work fine and the rest will be 404. If I leave it like that, the front page is 403.
Here's the error log:
2013/08/07 19:19:41 [error] 25333#0: *1 directory index of "/www/blog/" is forbidden, client: 64.129.X.X, server: test.com, request: "GET / HTTP/1.1", host: "www.test.com"
That directory is 755 on the nginx user:
drwxr-xr-x 6 nginx nginx 4096 Aug 7 18:42 blog
Is there anything obvious I'm doing wrong ?
Thanks !
Add index index.php; In the server block, if it doesn't work then you need to remove the $uri/ because you don't want to do a autoindex on
EDIT: Just noticed that you already figured out your problem, so I'll add the reasoning behind it, the reason why you needed autoindex on; is because without it nginx will follow the try_files rules,
Check if there's a file called /, and of course it fails.
Check if there's a directory called / (by adding root it would = /www/blog/), this check will succeed, so it tries to list the content of the folder.
Since you didn't specify autoindex on; so by default nginx should forbid directory listing, thus it would return a 403 forbidden error.
The rest of the site works fine because it fails the $uri/ test or doesn't reach it, because you probably don't have a folder called image.jpg or stylesheet.css etc.
Looks like I needed the inded index.php in the server {} definition and not in the location {}
It seems that you are not allowing arguments to be sent to the CMS so this will not show this uris that would bring information from the database and redirect you to the 403 page.

Resources