遇到的问题
带路由的应用应该支持“深链接”。 所谓深链接就是指一个 URL,它用于指定到应用内某个组件的路径。 比如,http://www.mysite.com/heroes/42
就是一个到英雄详情页面的深链接,用于显示 id: 42
的英雄。
当用户从运行中的客户端应用导航到这个 URL 时,这没问题。 Angular 路由器会拦截这个 URL,并且把它路由到正确的页面。
但是,当从邮件中点击链接或在浏览器地址栏中输入它或仅仅在英雄详情页刷新下浏览器时,所有这些操作都是由浏览器本身处理的,在应用的控制范围之外。 浏览器会直接向服务器请求那个 URL,路由器没机会插手。
静态服务器会在收到对 http://www.mysite.com/
的请求时返回 index.html
,但是会拒绝对 http://www.mysite.com/heroes/42
的请求, 并返回一个 404 - Not Found
错误,除非,它被配置成了返回 index.html
。
解决办法
第一:从网上下载RewriteModule 并安装到IIS 模块中
第二: 在web.config中增加一条重写规则
<?xml version="1.0" encoding="utf-8"?>
<configuration>
<system.webServer>
<rewrite>
<rules>
<rule name="Angular Routes" stopProcessing="true">
<match url=".*" />
<conditions logicalGrouping="MatchAll">
<add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
<add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" />
</conditions>
<action type="Rewrite" url="/index.html" />
</rule>
</rules>
</rewrite>
</system.webServer>
</configuration>
这样就可以直接将深链接(http://www.mysite.com/heroes/42
)粘贴到浏览器上就可以访问了。
注:如果不生效,可以重置IIS,或者重启服务器,以便RewriteModule生效