配置.htaccess文件以提供angular和api路由

时间:2016-08-27 21:13:47

标签: angularjs .htaccess url-rewriting

我迷失了.htaccess文件的配置。我有一个网站服务于客户端部分(angular.js应用程序)和api路由,这些路由使用超薄框架处理。

我的html页面是用ui-router提供的,但是为了处理页面刷新,我必须重写一个url。

到目前为止我的文件:

DirectoryIndex index.html index.php

#
# Redirect all to index.php
#
RewriteEngine On

# if a directory or a file exists, use it directly (static assets)
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d

#if route starts with "api", route to index.php (slim framework)
RewriteRule ^api/ index.php [L]
#else (it means we are serving the angular routes)
RewriteRule ^(.*) /index.html [NC,L]

当然,它不起作用。真正的问题是,我不知道我的逻辑一开始是不是很好(或者我距离很远......),然后如何编写它(我是apache语法的新手,我不是&# 39;真的了解一切。

1 个答案:

答案 0 :(得分:1)

有2个虚拟主机

API htaccess:

RewriteEngine On

# Redirect Trailing Slashes
RewriteRule ^(.*)/$ /$1 [L]

# Redirect Root
RewriteRule ^$ api.php [L]

# Handle API Requests
RewriteCond %{REQUEST_FILENAME} !-d
RewriteCond %{REQUEST_FILENAME} !-f
RewriteRule ^ api.php [L]

前端虚拟主机:

RewriteEngine On  
# If an existing asset or directory is requested go to it as it is
RewriteCond %{DOCUMENT_ROOT}%{REQUEST_URI} -f [OR]
RewriteCond %{DOCUMENT_ROOT}%{REQUEST_URI} -d
RewriteRule ^ - [L]

# If the requested resource doesn't exist, use index.html (html5mode)
RewriteRule ^ /index.html

# Redirect /api to API virtual host
<Location /api>
  ProxyPass http://127.0.0.1:8090 # Change here to the API virtual host binding
</Location>

前端虚拟主机将为所请求的文件(如果/ api / *除外)提供服务,否则将提供index.html(如果不存在)。所有/ api请求都将转发到API虚拟主机。 API虚拟主机将为任何现有文件提供服务,或者将重写为api.php,后者将处理您的API调用。

使用1个虚拟主机

<IfModule mod_negotiation.c>
  Options -MultiViews
</IfModule>

RewriteEngine On


# If an existing asset or directory is requested go to it as it is
RewriteCond %{DOCUMENT_ROOT}%{REQUEST_URI} -f [OR]
RewriteCond %{DOCUMENT_ROOT}%{REQUEST_URI} -d
RewriteRule ^ - [L]


RewriteCond %{REQUEST_URI} ^/api/
RewriteRule ^ api.php [L]

# If the requested resource doesn't exist, use index.html (html5mode)
RewriteRule ^ /index.html [L]

与上述行为相同

警告:尝试将不存在的文件包含到角度应用程序中可能会产生无限加载循环(index.html将加载,然后它将加载不存在的文件,这将是index.html由于html5mode等...)