使用HTML5推送状态URL配置单页网站的nginx [英] Configuring nginx for single page website with HTML5 push state URL's

问题描述

如何配置nginx将所有URL（不是前缀 / api 或某些静态资源（如JS /图像））重定向到索引。 HTML ？原因是我使用HTML5推送状态URL与单个页面应用程序。无论是AJAX还是JS，意义内容都会根据URL进行更改

我当前的nginx配置如下所示：

  server {
 listen 2000; 
 server_name localhost; 
 
 location / {
 root / labs / Projects / Nodebook / public; 
 index index.html; 
} 
 
 location / api / {
 proxy_set_header X-Real-IP $ remote_addr; 
 proxy_set_header X-Forwarded-For $ proxy_add_x_forwarded_for; 
 proxy_set_header主机$ http_host; 
 proxy_set_header X-NginX-Proxy true; 
 
 proxy_pass http：// localhost：3000 /; 
 proxy_redirect off; 
 
 
 $ / code $ / pre 
 
解决方案
 
  location / {
 try_files $ uri /index.html; 
} 
  
这将检查请求的文件是否存在并返回。如果文件不存在，它将返回index.html。
 
 
 
  http://nginx.org/en/docs/http/ngx_http_core_module.html#try_files  
 
How can I configure nginx to redirect all URL's (not prepended with /api or some static resource eg. JS/images) to index.html? Reason is I am using HTML5 push state URL's with a single page application. Meaning content is changed whether AJAX or JS depending on the URL

My current nginx config looks like: 
server {
    listen 2000;
    server_name localhost;

    location / {
        root    /labs/Projects/Nodebook/public;
        index   index.html;
    }

    location /api/ {
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header Host $http_host;
        proxy_set_header X-NginX-Proxy true;

        proxy_pass http://localhost:3000/;
        proxy_redirect off;
    }
}

解决方案
location / {
  try_files $uri /index.html;
}
This will check if the requested file exists and return it. If the file doesn't exist, it will return index.html.

http://nginx.org/en/docs/http/ngx_http_core_module.html#try_files

                        
这篇关于使用HTML5推送状态URL配置单页网站的nginx的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！