Question

我在.htaccess文件中使用以下配置来启用对网站上HTML5 pushState导航的支持：

# HTML5 pushstate support
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^ / [L]

当网站的网址如下所示时，此作品效果很好：

www.example.com/foo

但是，在使用更复杂的URL时，我开始遇到错误，例如：

www.example.com/foo/bar

我找到了this StackOverflow posts which directly addresses my issue。建议的解决方案确实有效，但对我来说，似乎是解决问题的错误方法。建议的解决方案是为给定页面提供<base>标记，例如：

<!DOCTYPE html>

<html>
    <head>
        <title></title>
        <base href="/" />
    </head>

    <body>
    </body>
</html>

这是有效的，因为according to documentation <base>标记会更正相对链接。

好的，公平的，但这就是.htaccess文件应该为我做的，对吗？

这是可以/应该在服务器级别而不是在每页上配置的东西吗？或者以这种方式使用<base>标签是否标准？

Answer 1

实际上是一个HTML源问题正在使用以下方法解决：

<base href="/" />

以便从该基本网址解析每个相对网址，而不是从当前网页的网址解析。

当前网址为：

http://www.example.com/foo/bar

并使用相对路径包含您的css / js / image，例如：

<img src="images/header.jpg">
<link rel="stylesheet" type="text/css" href="styles/site.css">

然后，浏览器将解析当前网址中的上述相对网址：

http://www.example.com/foo/images/header.jpg
http://www.example.com/foo/styles/site.css

因此导致上面的图像和css路径为404。

根据上面定义的<base>，浏览器正确请求上述网址为：

http://www.example.com/images/header.jpg
http://www.example.com/styles/site.css

当然可以重写一些重写规则，通过使用扩展来识别这些资源，将每个image / css / js重定向到根路径，但这些资源最好是补丁。

Answer 2

<ifModule mod_rewrite.c>
 RewriteEngine On


# Required to allow direct-linking of pages so they can be processed by Angular
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteCond %{REQUEST_URI} !index
RewriteRule (.*) index.html [L]

</ifModule>

.htaccess配置为pushState支持;多参数URL上的页面错误

2 个答案: