IIS部署angular在Web.config增加rewrite规则,解决深链接问题

 遇到的问题

带路由的应用应该支持“深链接”。 所谓深链接就是指一个 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 模块中

IIS部署angular在Web.config增加rewrite规则,解决深链接问题_第1张图片

第二: 在web.config中增加一条重写规则




 
    
      
        
        
          
          
        
        
      
    
  

这样就可以直接将深链接(http://www.mysite.com/heroes/42)粘贴到浏览器上就可以访问了。

注:如果不生效,可以重置IIS,或者重启服务器,以便RewriteModule生效

参考地址:https://angular.cn/guide/deployment

你可能感兴趣的:(Angular,JavaScript)