I use the nginx for Vue.js dist server.
my Nginx config is bellow:
server {
listen 80;
server_name qy.abc.xyz;
charset utf-8;
access_log /var/log/nginx/qy.abc.xyz.access.log main;
location / {
access_log /data/nginx_log/access.log main;
error_log /data/nginx_log/error.log error;
root /data/ldl/repo/vue_user_site/dist;
index index.html;
try_files $uri $uri/ /index.html;
}
...
I can access the qy.abc.xyz in browser success, but I can you know in my Vue.js there are many routes, if I access qy.abc.xyz/index or qy.abc.xyz/xxx/xxx, Nginx will get the 404 Not Found error.
You know the dist directory is constituted by many hashed-name.js and a index.html.
How to config my Nginx for my project?
EDIT-1
I tried use this config, but not work.
location / {
access_log /data/nginx_log/access.log main;
error_log /data/nginx_log/error.log error;
#root /data/ldl/repo/vue_user_site/dist;
#index index.html;
#try_files $uri $uri/ /index.html;
return 200 /index.html;
}
I need to configurate URL Rewrite
you can try this
location ~* \.(gif|jpg|jpeg|png|css|js|ico)$ {
root <your static file root>
}
location / {
return 200 /index.html
# or use rewrite
rewrite ^.*$ /index.html
}
Or use some server code that has route like node , asp.net core to send your html
Follow my settings of single-page application config in Nginx:
server {
listen 80;
server_name qy.abc.xyz;
#access_log /var/log/logs/qy.abc.xyz.access.log main;
charset utf-8;
index index.html;
root /data/ldl/repo/vue_user_site/dist;
location / {
try_files $uri $uri/ #rewrites;
}
location #rewrites {
rewrite ^(.+)$ /index.html last;
}
location = /50x.html {
root /usr/share/nginx/html;
}
}
Related
------- Technologies I'm using ---------
Debian 10
Nginx server
PHP8.0
--------- The scenario ------------
I have exmaple.com which has an HTML static website
and I have a subdomain, blog.example.com I installed WP on it and it's working fine
but I want to make the wp-admin access on login.blog.example.com.
-------- What I tried -------------
1- I tried redirecting any /wp-* URL to login.blog.example.com, but that isn't useful if there are no files/folders of wp-admin on login.blog.example.com.
2- I followed this, but it wasn't handy since they are redirecting to 404 and a static page
https://403.ie/how-to-serve-wp-admin-from-a-separate-subdomain/
-------- The nginx configuration -----------
example.com:
server{
listen 80;
listen [::]:80;
server_name IP_ADDRESS;
return 301 http://example.com;
}
server {
listen 80;
listen [::]:80;
server_name example.com;
root /var/www/example.com;
index index.html;
location / {
try_files $uri $uri/ =404;
}
}
blog.example.com:
server {
listen 80;
listen [::]:80;
server_name blog.example.com;
root /var/www/blog.example.com;
index index.html index.php index.htm;
location = /favicon.ico { log_not_found off; access_log off; }
location = /robots.txt { log_not_found off; access_log off; allow all; }
location ~* \.(css|gif|ico|jpeg|jpg|js|png)$ {
expires max;
log_not_found off;
}
location / {
#try_files $uri $uri/ =404;
try_files $uri $uri/ /index.php$is_args$args;
}
# location /wp-admin{
# rewrite ^/wp-(.*)$ http://login.blog.example.com redirect;
# }
location ~ \.php$ {
try_files $uri /index.php;
include fastcgi_params;
fastcgi_pass unix:/var/run/php/php8.1-fpm.sock;
fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name;
}
}
The first step is to create a server to handle requests to login.blog.example.com. This is identical to blog.example.com except for the server_name and any "login" bits you want to add.
Then add a redirect in the blog.example.com server block:
location ^~ /wp-admin {
return 302 $scheme://login.blog.example.com$request_uri;
}
WordPress may insist on redirecting you back to blog.example.com. This is because of the settings for site URL in the Dashboard configuration or the wp-config.php configuration file.
You should be able to drop the hostname from the HOME and SITEURL values and use / instead of http://blog.example.com.
Is it possible to have a suburl that point to a different root? For example:
www.domain.com/ -> /home/ubuntu/project1
www.domain.com/project2 -> /home/ubuntu/project2
I have this configuration at this moment but I'm getting a 404 when resolving domain.com/project2
server {
listen 80;
server_name domain.com;
root /home/ubuntu/project1;
location /project2 {
root /home/ubuntu/project2;
index index.html;
}
location / {
try_files $uri $uri/ /index.html;
}
}
It's because nginx will append the uri to root directive.
In your example config, accessing domain.com/project2 would try to look for a file named project2 in /home/ubuntu/project2 which is not found and return 404.
To solve your problem, try using alias directives.
server {
listen 80;
server_name domain.com;
root /home/ubuntu/project1;
location /project2 {
alias /home/ubuntu/project2;
index index.html;
}
location / {
try_files $uri $uri/ /index.html;
}
}
I have created several subdomain so that i can serve the subdomain related specific content. But the problem i am facing is that when i am trying to access the content related directly to my domain am not getting anything in return in nginx. Below is my configuration file
http {
include mime.types;
default_type application/octet-stream;
server {
listen 80;
server_name example.com www.example.com;
root /usr/share/nginx/myfile/dev/web;
index index.html index.htm;
location / {
try_files $uri $uri/ /index.html;
}
}
server {
listen 80;
server_name dev.example.com;
root /usr/share/nginx/myfile/dev/mobile;
index index.html index.htm;
location / {
try_files $uri $uri/ /index.html;
}
}
server {
listen 80;
server_name qa-crm.example.com;
root /usr/share/nginx/myfile/qa-crm;
index index.html index.htm;
location / {
try_files $uri $uri/ /index.html;
}
}
server {
listen 80;
server_name qa.example.com;
root /usr/share/nginx/myfile/qa;
index index.html index.htm;
location / {
try_files $uri $uri/ /index.html;
}
}
}
All server block are serving perfectly except the first one which contains the main domain name i.e. (example.com www.example.com)
No idea what i am doing wrong here. I am new to nginx world
I met a problem about Nginx really make me confused.
if I set the server as blow :
server {
listen 80;
server_name _;
root /usr/project/exchange/front/build;
index index.html;
location = /{
try_files $uri $uri/ =404;
}
}
if I add location / in the server. the page shows error.
server {
listen 80;
server_name _;
root /usr/project/exchange/front/build;
index index.html;
location = /{
try_files $uri $uri/ =404;
}
location / {
proxy_pass http://127.0.0.1:8088;
}
}
That's really make confused. Nginx match the url from =/ to /?Why add location / leads to mistake?
I am setting up vue(2.1.x) with nginx(1.10.2), I have following configuration:
location / {
root /var/lib/myRepo/dist/;
index index.html;
}
This works when I hit 'http://localhost:8080/', but when I hit other URLs like: 'http://localhost:8080/products/home', I get:
404 Not Found
I also tried following:
root /var/lib/myRepo/dist/;
location / {
try_files $uri $uri/ index.html$query_string;
}
What can be wrong here and how to correct this.
you can follow like this:
server {
listen 80;
server_name localhost;
#charset koi8-r;
#access_log logs/host.access.log main;
location / {
try_files $uri $uri/ #router;
index index.html;
}
location #router {
rewrite ^.*$ /index.html last;
}
}