未找到react生产版本 404

IT技术 apache reactjs
2021-05-10 19:46:14

您好，我需要部署 React 应用程序。

为了实现这一点，我运行：“npm run build”

之后在我的 vhost.conf 中我添加了 vhost 

<VirtualHost *:80>
ServerName hello.local
DocumentRoot c:/wamp64/www/hello_world/build
<Directory  "c:/wamp64/www/hello_world/build">
             Options Indexes FollowSymLinks MultiViews
             AllowOverride All
             Require all granted
</Directory>

我还添加到 etc/hosts hello.local

当然我已经在 httpd.conf 中启用了 mod rewrite

当我运行 hello.local/ 我的 react 应用程序的主页显示正确，但是当我想转到 react-react 路由路径 hello.local/example 时，我收到 404 not found 错误。请帮忙看看是什么？是 apache 配置有问题还是 react-router 有问题？问候

2个回答

这是 SPA 的常见问题。在 SPA 中，路由主要发生在客户端。在你的情况下，主要react-router应该做这项工作。由于整个 js 被捆绑为单个文件并在 中提供index.html，因此您需要为服务器中的index.html所有路径提供non-existing服务。

你必须添加这样的配置

RewriteEngine On  
RewriteCond %{DOCUMENT_ROOT}%{REQUEST_URI} -f [OR]
RewriteCond %{DOCUMENT_ROOT}%{REQUEST_URI} -d
RewriteRule ^ - [L]

RewriteRule ^ /index.html [L]

因此，如果您的服务器中没有匹配的路径，index.html 将被提供。然后 javascript 将执行并且react-router（客户端路由）将接管并显示路由的正确组件。

对于大多数 SPA 来说都是如此，其中路由发生在客户端。

为 IIS Window 10使用web.config

    <?xml version="1.0" encoding="utf-8"?>
<!--
  For more information on how to configure your ASP.NET application, please visit
  https://go.microsoft.com/fwlink/?LinkId=169433
  -->
<configuration>
  <system.webServer>
    <rewrite>
  <rules>
    <rule name="Imported Rule 1" stopProcessing="true">
      <match url="^" ignoreCase="false" />
      <conditions logicalGrouping="MatchAny">
        <add input="{DOCUMENT_ROOT}{URL}" matchType="IsFile" ignoreCase="false" />
        <add input="{DOCUMENT_ROOT}{URL}" matchType="IsDirectory" ignoreCase="false" />
      </conditions>
      <action type="None" />
    </rule>
    <rule name="Imported Rule 2" stopProcessing="true">
      <match url="^" ignoreCase="false" />
      <action type="Rewrite" url="/index.html" />
    </rule>
  </rules>
</rewrite>
  </system.webServer>
  <system.web>
    <customErrors mode="Off" />
    <httpRuntime targetFramework="4.6.1" executionTimeout="240" maxRequestLength="2048000" />
    <trace enabled="true" requestLimit="40" localOnly="false" />
  </system.web>
  <system.webServer>
    <defaultDocument>
      <files>
        <clear />
        <add value="Index.aspx" />
        <add value="Default.htm" />
        <add value="Default.asp" />
        <add value="index.htm" />
        <add value="index.html" />
        <add value="iisstart.htm" />
        <add value="default.aspx" />
      </files>
    </defaultDocument>
    <directoryBrowse enabled="false" />
  </system.webServer>
</configuration>
其它你可能感兴趣的问题
上一篇XYZPrinting 优质金属 PLA 电导率 下一篇Anet A8 不能在热床上打印