不带哈希 (#) 的 React URL 重定向以包含哈希或循环，尽管 .htaccess 中存在前端控制器规则

Question

我的 React 网页与我的 HostGator 域中的下一个链接可以正常工作

my-web-page/#/admin

但是如果我尝试手动输入 URL

my-web-page/admin

它开始循环重新加载，直到我返回到正确的页面。有没有办法用

.htaccess

纠正这个事实，实际上我有这个内容

Options -MultiViews
RewriteEngine On
RewriteCond %{REQUEST_FILENAME} !-f
RewriteRule ^ index.html [QSA,L]

但还是不行

而是重定向到

my-web-page/#/admin

我尝试输入

my-web-page/admid

并获取正确的 URL。

Answer 1

它开始循环重新加载

这听起来像是 React 应用程序中的路由问题？

但是，要将

example.com/anything

（单路径段）的请求重定向到

example.com/#/anything

，您可以在根

.htaccess

文件顶部使用 mod_rewrite 执行类似以下操作：

RewriteEngine On

# Redirect "/anything" to "/#/anything"
RewriteRule ^([\w-]*)$ /#/$1 [R=301,NE,L]

其中“任何内容”是由字符

a-z

、

A-Z

、

0-9

、

_

（下划线）或

-

（连字符）的任意组合组成的单个路径段。

您应该首先使用 302（临时）重定向进行测试，以避免潜在的缓存问题，并且只有在完全测试后才更改为 301（永久）（如果这是意图）。

请注意，当 URL 的形式为

index.html

时，不会使用/不需要将请求路由到

example.com/#/something

的现有/原始 mod_rewrite 指令。