使用React和.htaccess处理地址栏URL_.htaccess_Reactjs_Mod Rewrite

使用React和.htaccess处理地址栏URL

.htaccess reactjs mod-rewrite

使用React和.htaccess处理地址栏URL,.htaccess,reactjs,mod-rewrite,.htaccess,Reactjs,Mod Rewrite,我正在学习ReactJS，在创建测试应用程序时，我遇到了一个问题。我正在使用.htaccess将所有无效URL重定向到index.html以进行进一步处理。但每次我输入一个包含多个斜杠的URL时，总会有一些东西坏掉如何复制 .htaccess： index.html： app.jsx：我正在用巴别塔进行运输。出于测试目的，您可以在那么,参观的时候,http://localhost/anything 它很好用。但是，如果我去http://localhost/anything/somethi

我正在学习ReactJS，在创建测试应用程序时，我遇到了一个问题。我正在使用.htaccess将所有无效URL重定向到index.html以进行进一步处理。但每次我输入一个包含多个斜杠的URL时，总会有一些东西坏掉

如何复制

.htaccess：

index.html：

app.jsx：

我正在用巴别塔进行运输。出于测试目的，您可以在

那么,参观的时候,http://localhost/anything 它很好用。但是，如果我去http://localhost/anything/something 或http://localhost/anything/something/else 然后它就坏了。服务器仍然通过在浏览器中加载的方式返回index.html

我做错什么了吗？

可能是几个小问题的组合，但请查看您的“网络”选项卡，查看加载是否有任何问题。从您的示例来看，app.js似乎是相对加载的，而不是在重写过程中处理的。请尝试将所有指向资产的链接设置为绝对链接，例如/app.js

，它的效果非常好！我检查了网络标签，你是对的。由相对路径提供服务的资产不受重写的影响。我将尝试了解更多关于它的方式和原因。谢谢。

RewriteEngine On
RewriteBase /
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteCond %{REQUEST_FILENAME} !-l
RewriteRule ^.*$ / [L,QSA]

<!DOCTYPE html>
<html lang="en">
<head>
    <title>Test App</title>
</head>
<body>
    <div id="react-root"></div>
    <script src="app.js"></script>
</body>
</html>

import React from 'react'
import ReactDOM from 'react-dom'

const TestPage = () => <span>{window.location.href}</span>

ReactDOM.render(
    <TestPage />
    ,document.getElementById('react-root')
)