Nginx配置React项目Url后直接输入路由路径时报404问题的解决

 更新时间:2017年11月03日 10:53:38   作者:xiaotuni  
这篇文章主要给大家介绍了关于Nginx配置React项目Url后面直接输入路由路径时报404问题的解决方法,文中通过示例代码将解决的方法介绍的非常详细,需要的朋友可以参考借鉴,下面随着小编来一起学习学习吧。

前言

如今react应用普遍,最近在配置react项目中遇到了一个问题,通过查找相关的资料终于找到了解决的方法,所以想着总结一下分享出来给有需要的朋友们,下面话不多说了,来一起看看详细的介绍吧。

发现问题

大家都知道,当我们写完项目后,要对项目进行部署,我的配置很简单

location /demo {
 root E:/;
 index index.html index.htm;
}

这样配置的有一个问题,只能 http://localhost/demo/来访问。

如果想访问里面的其它界面如 http://localhost/demo/page1的话,就报404找不到页面。

可我在开发的时候,确实没有问题,可以进行访问的,于就想难道必须得用node来项目吗?不会吧,也许是我自己不会配置所致。

解决方法

终于找到办法了,在其它人的nginx.config里发现多加了一行东西。

location /demo {
 root E:/;
 #加上了这个,就可以在url后面直接加路由上配置path了。
 try_files $uri /demo/index.html;
 index index.html index.htm;
}

致于为什么,不清楚,但是功能实现了。

在此标记一下,以备后需之用。

总结

以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作具有一定的参考学习价值,如果有疑问大家可以留言交流,谢谢大家对脚本之家的支持。

相关文章

  • nginx日志配置指令详解

    nginx日志配置指令详解

    这篇文章主要介绍了nginx日志配置指令详解,nginx有一个非常灵活的日志记录模式,每个级别的配置可以有各自独立的访问日志,需要的朋友可以参考下
    2014-07-07
  • Nginx反向代理多域名的HTTP和HTTPS服务的实现

    Nginx反向代理多域名的HTTP和HTTPS服务的实现

    这篇文章主要介绍了Nginx反向代理多域名的HTTP和HTTPS服务的实现,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2020-06-06
  • nginx https反向代理tomcat的2种实现方法

    nginx https反向代理tomcat的2种实现方法

    这篇文章主要给大家介绍了关于nginx https反向代理tomcat的2种实现方法,第一种方法是nginx配置https,tomcat也配置https,第二种方法是nginx采用https,tomcat采用http,文中通过示例代码介绍的非常详细,需要的朋友可以参考下。
    2017-12-12
  • nginx屏蔽指定接口(URL)的操作方式

    nginx屏蔽指定接口(URL)的操作方式

    这篇文章主要介绍了nginx屏蔽指定接口(URL)的操作方式,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2020-05-05
  • Nginx limit 限制访问模块的方法

    Nginx limit 限制访问模块的方法

    本篇文章主要介绍了Nginx limit 限制访问模块的方法,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2018-03-03
  • 详解Nginx限流配置

    详解Nginx限流配置

    本文以示例的形式,由浅入深讲解Nginx限流相关配置,是对简略的官方文档的积极补充,感兴趣的朋友跟随小编一起看看吧
    2019-09-09
  • nginx经过多层代理后获取真实来源ip过程详解

    nginx经过多层代理后获取真实来源ip过程详解

    这篇文章主要介绍了nginx经过多层代理后获取真实来源ip过程详解,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
    2019-09-09
  • 详解Nginx反向代理实现会话(session)保持的两种方式

    详解Nginx反向代理实现会话(session)保持的两种方式

    这篇文章主要介绍了详解Nginx反向代理实现会话(session)保持的两种方式,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2019-08-08
  • linux上nginx安装部署及使用过程详解

    linux上nginx安装部署及使用过程详解

    这篇文章主要介绍了linux上nginx安装部署及使用过程,非常不错,具有一定的参考借鉴价值,需要的朋友参考下吧
    2019-11-11
  • nginx设置上传目录无执行权限的方法

    nginx设置上传目录无执行权限的方法

    在windows+iis下,可以设置上传目录,类似:upload,uploadfile,attachments,这样的目录下面无脚本执行权限,从而防止非法用户上传脚本得到webshell
    2010-11-11

最新评论