IIS部署Angular及配置反向代理

为了实现前后端分离并且能灵活切换数据接口的地址，通常在前端不会写绝对的请求地址而是按一定格式。比如统一在请求地址以api/开头，后面跟上二级地址及各种参数。然后通过反向代理来将所有URL带有api/的请求反向代理到数据接口的地址。
Angular编译后得到静态文件可以直接部署到IIS,Nginx, Apache等web容器中，然后用户即可直接访问。

IIS中部署Angular

IIS是微软作为windows功能提供的Web容器，只需要在控制面板→程序→打开或关闭Windows功能找到Internet Information Services，然后选择需要的功能保存后IIS即会自动安装。
安装完成后打开浏览器访问localhost即可看到欢迎页。
打开IIS控制台，选中默认的网站，停掉它，然后选择添加网站，物理路径指向Angular编译后的文件目录，端口设置为80保存后重启容器，再访问localhost即可看到自己的网站主页。

IIS配置反向代理

要使用反向代理，必须先安装ARR（Application Request Routing）
然后打开ARR,点击右侧边栏的proxy，打上Enable proxy前的√。
关于IIS的反向代理，搜索引擎得到的解决方案有很多坑。比如基本建议选择空白规则自己配置，使用正则匹配字符串等。因为我不会正则，所以采用通配符匹配，结果也是多次配置无果。
尝试添加规则的时候直接选择反向代理，然后用通配符进行匹配因为我们需要代理的只是对数据接口的请求，所以匹配*api*，匹配条件不填，重写规则写上自己数据接口的地址比如http://localhost:8080｛R2｝
这里的｛R2｝是匹配到的api后的字符串，比如请求localhost：8080/api/login，匹配到的{R2}就是/login具体可以在配置匹配规则时点测试模式然后贴上自己的请求url查看。
配置好后重启网站即可看到效果，如果不能正常访问则可以F12查看Angular应用发出的请求链接，并且复制到IIS 的 URL重写规则配置里点测试，粘贴请求链接，检查实际重写后的地址是否正确。

为什么不把前后端都部署在一起？

原因很简单，如果部署到同一个容器同一个地址的话会造成各种不可预期的错误，比如

spring mvc会拦截到前端的路由跳转
静态资源要单独映射
不方便分别进行调试和维护
etc.

PS：IIS部署好后可能会出现比如明明网站都已经更新甚至本地目录都删除了，浏览器访问内容却没变，这可能是浏览器的缓存的缘故，可以禁用掉缓存再进行测试，如何浏览器渲染旧的内容待解决。