Nginx route with single page app - nginx

I'm starting to go nuts at this. For some reason, routing wont work on my single page application. So www.example.com works, but not www.example.com/service. I read a lot of posts on how to fix it, but nothing seems to work.
This is my config file at /etc/nginx/conf.d/App.conf
server {
listen 80;
server_name example.com *.example.com;
return 301 https://example.com$request_uri;
}
server {
listen 443 ssl;
server_name www.example.com;
ssl_certificate /path/to/certificate/;
ssl_certificate_key /path/to/certificate/key;
root /var/www/App/public;
index index.html;
location / {
try_files $uri /index.html;
}
ssl_session_timeout 5;
}
I have tried all kind of different "location" routes, and nothing seems to work. I do also restart the service with "sudo service nginx restart" everytime I change.
Any clues?

In the comments you said there's a small fixed set of possible routes. In that case you can add a location block for each route, with an alias to the top-level, for example,
location / {
try_files $uri $uri/ =404;
}
location /services {
alias /var/www/App/public;
try_files $uri $uri/ =404;
}
Edit: Or, if you want to serve the top-level index.html in response to any request at all,
location / {
try_files /index.html =404;
}

Related

nginx path based routing

I would like to to route requests based on a path to two different Angular applications. So when i request http://example.com/admin is routes to one app http://example.com/client routes to the second app. I have the following config but all requests are always sent to the nginx default page. Configuration is as follows:
server {
listen 80 default_server;
listen [::]:80 default_server;
server_name _;
location /admin {
root /home/ubuntu/apps/admin/;
index index.html;
try_files $uri $uri/ /index.html?$args;
}
location /client {
root /home/ubuntu/apps/client;
index index.html;
try_files $uri $uri/ /index.html?$args;
}
}
No other confs are in /etc/nginx/sites-enabled and nginx.conf is default post install on Ubuntu. Any help is appreciated.
You were using the wrong value for the root directive. In both locations the correct value for the root directive is /home/ubuntu/apps, which means you can simplify the configuration by using just one root directive by moving it into the server block.
Of course you can use the alias directive - but as the manual states :
When location matches the last part of the directive’s value ... it is better to use the root directive instead.
The other problem is that your try_files statements are pointing to the wrong index.html file.
For example:
server {
listen 80 default_server;
listen [::]:80 default_server;
root /home/ubuntu/apps;
location /admin {
try_files $uri $uri/ /admin/index.html;
}
location /client {
try_files $uri $uri/ /client/index.html;
}
}
Note that server_name _; is not necessary - see the Server Names document.
Also, index index.html; is not necessary being the default value for the index directive.
It appears that you cannot use multiple root directives but instead need to use alias (Configure nginx with multiple locations with different root folders on subdomain). With that, I would still get 404s until I took off $args from the index.html. After that everything worked fine (don't ask how long it took to figure that out). Working config:
server {
listen 80 default_server;
listen [::]:80 default_server;
server_name _;
index index.html;
location /admin {
alias /home/ubuntu/apps/admin;
try_files $uri /index.html =404;
}
location /client {
alias /home/ubuntu/apps/client;
try_files $uri /index.html =404;
}
}

URI setup in Nginx for Next Js export

I have a static website with Next-Js export, and my Nginx setting is like -
server {
server_name www.example.com;
root /var/www/example;
index index.html index.htm;
location / {
try_files $uri $uri.html /$uri /index.html;
}
listen 80;
}
This works well but I can not get a 404 error page if we manually update the wrong URL on the client side.
Can anyone explain how to get an error 404 page for not matching URL.
For now, if a manually update URL on the browser, the same page opens which was opened from before.
Thanks
Maybe this help someone -
After reading about uri and how Nginx manages order of uri, here is what I came up with :
Ps - I'm still experimenting with this code for now)
server {
server_name www.example.com;
root /var/www/example;
index index.html index.htm;
location / {
try_files $uri.html $uri/ /$uri /404.html;
# $uri # /index.html;
}
listen 80;
}

How do I add text to a response from a remote URL in NGINX?

I have the following server in NGINX and it works fine. But, I am wondering is it possible to add text to a response from a remote URL where hosts my before_body.txt and after_body.txt? Is there any way to tackle this?
server {
listen 80;
root /storage/path;
index index.html;
server_name test.domain.com;
location / {
try_files $uri $uri/ =404;
add_before_body /src/before_body.txt;
add_after_body /src/after_body.txt;
autoindex on;
}
location /src/ {
alias /storage/path/content/;
}
}
I have resolved with replacing the alias as follows:
location /src/ {
proxy_pass https://externalserver.com/;
}

Nginx is serving the default content instead of my content

I have a nginx version: nginx/1.10.3 (Ubuntu) running on Ubuntu 16.04.2 LTS.
I use nginx to serve static files, bundles generated by webpack, but that's irrelenvant.
What I want to achieve is this:
On example.com I want to serve /home/bundles/main/index.html. I can do this.
On projects.example.com/project_1 I want to serve /home/bundles/project_1/index.html.
On projects.example.com/project_2 I want to serve /home/bundles/project_2/index.html.
The last two, I can't do. When I go to projects.example.com/project_1 or projects.example.com/project_2 I am served the default nginx page.
To make things more confusing /etc/nginx/sites-enabled/default is entirely commented out.
Additionally, if in the location block of projects.example.com I replace, for example, project_1 with /, I will be served that specific project, but then I will have no way of serving the other.
Bellow, I will show you my nginx configuration
server {
listen 80;
server_name example.com;
location / {
root /home/bundles/main;
try_files $uri /index.html;
}
if ($scheme != "https") {
return 301 https://$host$request_uri;
}
}
server {
listen 443 ssl;
server_name example.com;
location / {
root /home/bundles/main;
try_files $uri /index.html;
}
ssl_certificate ...
ssl_certificate_key ...
}
server {
listen 80;
server_name projects.example.com;
location /project_1 {
root /home/bundles/project_1;
try_files $uri /index.html;
}
location /project_2 {
root /home/bundles/project_2;
try_files $uri /index.html;
}
if ($scheme != "https") {
return 301 https://$host$request_uri;
}
}
server {
listen 443 ssl;
server_name projects.example.com;
location /project_1 {
root /home/bundles/project_1;
try_files $uri /index.html;
}
location /project_2 {
root /home/bundles/project_2;
try_files $uri /index.html;
}
ssl_certificate ...
ssl_certificate_key ...
}
Thank you for your help!
EDIT
My Answer
The solution I found was to change the root with alias.
server {
listen 80;
server_name example.com;
location / {
root /home/bundles/main;
try_files $uri /index.html;
}
if ($scheme != "https") {
return 301 https://$host$request_uri;
}
}
server {
listen 443 ssl;
server_name example.com;
location / {
root /home/bundles/main;
try_files $uri /index.html;
}
ssl_certificate ...
ssl_certificate_key ...
}
server {
listen 80;
server_name projects.example.com;
location /project_1 {
alias /home/bundles/project_1;
index index.html;
}
location /project_2 {
alias /home/bundles/project_2;
index index.html;
}
if ($scheme != "https") {
return 301 https://$host$request_uri;
}
}
server {
listen 443 ssl;
server_name projects.example.com;
location /project_1 {
alias /home/bundles/project_1;
index index.html;
}
location /project_2 {
alias /home/bundles/project_2;
index index.html;
}
ssl_certificate ...
ssl_certificate_key ...
}
The solution is based on these two answers. The first answer showing how to solve the problem and the second answer providing a explanation as to why alias works and root does not.
To quote #treecoder
In case of the root directive, full path is appended to the root including the location part, whereas in case of the alias directive, only the portion of the path NOT including the location part is appended to the alias.
In my particular case, this would translate like this;
With root, the path nginx would try to access would be /home/bundles/project_1/project_1.
With alias it accesses the correct path, /home/bundles/project_1.
Going back one level, for example, saying:
root /home/bundles/ is not really a option either. That is because my projects are not actually called project_1 and project_2. The actual structure is more similar to this.
In /bundles I have the directories project_a and project_b. I want to route project_1 to the project_a directory and project_2 to the project_b directory.
That is why I used alias.
I hope this helps.
You have:
location /project_1 {
root /home/bundles/project_1;
try_files $uri /index.html;
}
So the root is only defined for URIs that begin with /project_1. For any other URI, the default root will be used.
If you present the URI /project_1/ (with a trailing /), assuming that the default index directive is in force, nginx should return your /project_1/index.html content.
However, the URI /project_1 is not found - so /index.html is returned instead. The URI /index.html does not begin with /project_1, so the default root is used.
If you want the URI /project_1 to work as expected, and the default action to go to the project's index.html file, change the try_files directive.
location /project_1 {
root /home/bundles/project_1;
try_files $uri $uri/ /project_1/index.html;
}
See this document for more.
As both projects share a common root, you could simplify as follows:
server {
listen 80;
server_name projects.example.com;
root /home/bundles
index index.html;
location /project_1 {
try_files $uri $uri/ /project_1/index.html;
}
location /project_2 {
try_files $uri $uri/ /project_2/index.html;
}
location / {
deny all;
}
}
I added the index directive to avoid relying on the default value (which is the same), and a location block to deny access to areas outside of the projects.
I had the same problem...and it turned out, for me, that the default site that was "overtaking" my desired secondary site and serving the default files...well it allowed IP6 requests, and my new site didn't.
Here's an example of my access.log:
::1 - - [05/Sep/2020:15:05:16 -0600] "GET / HTTP/1.1" 200 40 "-" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/85.0.4183.83 Safari/537.36"
Notice the ::1 bit? That's an IP6 request that I guess my browser was defaulting to. So I just made sure to enable local IP6 requests for the site in question in my site config file by changing:
listen 80;
server_name example.local;
to:
listen 80;
listen [::]:80;
server_name example.local;
That was it.

Nginx: 2 servers on same root, different index. Server 2 getting 403 forbidden

I have two servers that have the same root but different indexes. The second server is a subdomain of the first server, so I want to serve all the same files except the only thing I want different is the index.
Everything works fine except for the second location part on the second server giving me 403 forbidden error on every page I visit, yet it works just fine on the first server.
If I go to domain.com/foo/ then I get the 403 forbidden. If I go to domain.com/foo/index.html, then I don't get the 403 forbidden and get served the correct files.
Any help would be appreciated.
Here is my nginx.conf:
server {
listen 80;
listen 443 ssl;
root C:\Users\Lansana\Documents\Github\foo;
index index.html;
server_name domain.org;
location ~ /.+ {
try_files $uri $uri/ /app.html =404;
}
location / {
try_files $uri $uri/ /index.html =404;
}
}
server {
listen 80;
listen 443 ssl;
root C:\Users\Lansana\Documents\Github\foo;
index subdomain.html;
server_name subdomain.domain.org;
location ~ /.+ {
try_files $uri $uri/ /app.html =404;
}
location / {
try_files $uri $uri/ /index.html =404;
}
}
The solution to this was to add a second file for the index on my second server.
Replace:
index subdomain.html
with:
index subdomain.html index.html

Resources