Apache重写规则不适用于angularjs答案

【问题标题】：Apache rewrite rules not being applied for angularjsApache重写规则不适用于angularjs
【发布时间】：2013-03-01 09:47:49
【问题描述】：

我正在尝试使用 AngularJS 设置 apache 2.2，其结构与以下封闭问题中的结构几乎完全相同。

rewrite rules for apache 2 to use with angular js

我想将所有请求重定向到 app/index.html，但对 /api 的请求除外。

我的目录结构如下

/
/app
/app/index.html
/app/css
/app/js
/api

我正在尝试在 httpd-vhosts 文件中应用这些重定向规则，该文件已发布为问题的正确答案 https://stackoverflow.com/a/15284848/671095。

<VirtualHost *:80>
ServerName www.test.com
DocumentRoot "C:/websites/test"
Alias /CFIDE "C:/websites/CFIDE"

RewriteEngine On

# if a directory or a file exists, use it directly
RewriteCond %{REQUEST_FILENAME} -s [OR]
RewriteCond %{REQUEST_FILENAME} -l [OR]
RewriteCond %{REQUEST_FILENAME} -d
RewriteCond %{REQUEST_URI} !/api

# otherwise forward it to index.html 
RewriteRule ^.*$ - [NC,L]
RewriteRule ^app/. /app/index.html [NC,L]

</VirtualHost>

但是，当我尝试在浏览器中访问 / 时，我会看到一个空白屏幕。如果我在浏览器中输入 /app/index.html，但是我可以在浏览器中查看 html 页面，但无法访问任何 css.or js 并返回 404。

我一直在发疯，这似乎是作为 apache 重写完成的一件简单的事情。

任何帮助将不胜感激

【问题讨论】：

标签： apache mod-rewrite rewrite

【解决方案1】：

现在在 Apache 2.2.16+ 中使用 FallbackResource 指令要容易得多。

FallbackResource /app/index.html

http://httpd.apache.org/docs/2.2/mod/mod_dir.html#fallbackresource

根据您转发对 API 的访问的方式，您可能还需要利用附件来禁用专门针对 API 请求 (2.2.24+) 的回退资源。

<Directory /api>
    FallbackResource disabled
</Directory>

【讨论】：

使用 apache 2.4.x 就像一个魅力！

【解决方案2】：

This 为我工作：

<ifModule mod_rewrite.c>
    RewriteEngine On
    RewriteCond %{REQUEST_FILENAME} !-f
    RewriteCond %{REQUEST_FILENAME} !-d
    RewriteCond %{REQUEST_URI} !index
    RewriteRule (.*) index.html [L]
</ifModule>

【讨论】：

只是添加到此评论中，如果您的 Angular 应用程序不在主机的根目录中，即内容位于 example.com/moo 之类的目录中，则需要添加适当的 <base> 标签.对于example.com/moo 的示例，您的标签需要为<base href="/moo/"> - 这样您的资产和模板才能正确加载
@BahamutWC：不鼓励使用基本标签； docs.angularjs.org/guide/dev_guide.services.$location
@Daan 仅当 Angular 建议您从根文档中提供它时，才不鼓励这样做。但是，如果由于某种原因不能，则必须使用<base> 标签。
我使用这种方法不断收到错误请求。修复它的方法是在 index.html 前面加上一个斜线，就像 RewriteRule (.*) /index.html [L]
这个对我来说是完美的，因为前端（角度）是 index.html 而 subfolder/ 是后端 laravel index.php，所以定义 index.html 使它对我有用。

【解决方案3】：

我也有同样的问题。但是我对mod_rewrite一无所知，所以不得不谷歌很多。我在这封电子邮件中找到了解决方案：

https://groups.google.com/d/msg/angular/GmNiNVyvonk/mmffPbIcnRoJ

所以我认为你的 .htaccess 应该如下所示：

Options +FollowSymLinks
IndexIgnore */*

RewriteEngine on

# if a directory or a file exists, use it directly
RewriteCond %{REQUEST_FILENAME} -s [OR]
RewriteCond %{REQUEST_FILENAME} -l [OR]
RewriteCond %{REQUEST_FILENAME} -d
RewriteCond %{REQUEST_URI} !/api
RewriteRule ^.*$ - [NC,L]

# otherwise forward it to index.html 
RewriteRule ^app/(.*) /app/#/$1 [NC,L]

注意(.*) 和#/$1

注意：您必须在包含的 CSS、JS 等中使用绝对路径，否则您会收到错误：

资源被解释为脚本，但使用 mime 类型 text/html 传输

【讨论】：

我已将这些规则应用于 httpd-vhosts 文件，但是当我尝试访问 mywebsite.com 时，它现在也没有传递到 index.html 文件，当我访问 mywebsite.com/app/ 时，我看到了浏览器中的 404
我使用了您的代码，但看到“内部服务器错误”消息。有关如何解决此问题的任何想法？

【解决方案4】：

不知道你是否还有这个问题，但我在使用 AngularJS 和 Apache 2 时遇到了同样的症状。

我的问题实际上是我使用的是 IE，它会自动进入兼容模式。我在我的 HTML 中使用了下面的行并且它有效。

<meta http-equiv="X-UA-Compatible" content="IE=edge" />

在此处进一步描述：What does <meta http-equiv="X-UA-Compatible" content="IE=edge"> do? >.

【讨论】：