javascript - 为什么我在 Hostinger 上的 ReactJS 项目在打开新选项卡或刷新页面时会出现 404 错误?

标签 javascript node.js reactjs react-hooks domain-driven-design

我已经在托管商上部署了reactjs项目,我在其中打开任何新选项卡或刷新页面时都会出现错误404

我使用了最新版本的react router dom

Index.js
<Browserrouter>
<App/>
<Browserrouter/>


App.js

<Routes>
<Route path="/" element={<Home/>}/>
        <Route path="/about-us" element={<Aboutus/>}/>
        <Route path="/contact-us" element={<Contactus/>}/>
        <Route path="/career" element={<Career/>}/>
        <Route path="/work" element={<Work/>}/> 
        <Route path="/services" element={<ServicesMain/>}/>

<Routes/>

最佳答案

问题不在于 React,而在于你的托管配置。您需要通过使用以下代码在“public”文件夹中添加 .htaccess 文件来添加重写规则。

<IfModule mod_rewrite.c>
  RewriteEngine On
  RewriteBase /
  RewriteRule ^index\.html$ - [L]
  RewriteCond %{REQUEST_FILENAME} !-f
  RewriteCond %{REQUEST_FILENAME} !-d
  RewriteCond %{REQUEST_FILENAME} !-l
  RewriteRule . /index.html [L]
</IfModule>

关于javascript - 为什么我在 Hostinger 上的 ReactJS 项目在打开新选项卡或刷新页面时会出现 404 错误?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/76390677/

相关文章:

javascript - 在 Node.js Web 应用程序中使用用户名和密码在 Azure AD 上进行身份验证

javascript - React AppendChild 组件不起作用

javascript - 返回未定义的 json 对象 [nodejs, fs]

javascript - Angular8 充满了 HttpClient 响应头

node.js - gRPC Node 服务器: how to load protobuf file from a different Git repo?

javascript - Nightmare JS 中 click() 和 wait() 之后获取 POST 请求 header

reactjs - 使用 React/Redux 进行服务器端渲染,获取 url 参数传递到 loadData

ReactJs - Axios - 如何获取分段文件上传进度

javascript - 制作一个 float :left div sticky

javascript - Masonry & LazyLoad 不想一起工作