“我正在参加「掘金·启航计划」”

关于一名前端人踩到IIS发布的坑

背景

天又塌了，实施小哥跑过来说公司官网有个界面的样式乱码了，样式消失了；之前还好好的，今天不知道怎么了，点进去的时候样式和布局全乱了。身为一名前端人，听到“样式”，“布局”等字眼，好吧，那我来处理吧，谁叫俺是搞前端的

了解问题

好家伙啊，PHP，jQuery，（都是我不熟悉的领域）由此可见，这官网已经有一段历史了
一直都好好的，突然出问题，一开始我以为是不是谁改过代码，询问后，也说没人改过代码

着手解决

访问官网打开浏览器调试，发现样式、字体等静态资源文件无法加载；
直接访问服务器中的静态资源，没有毛病，很快很通畅（会不会路径被代码改变了）；
拿到这份历史级别的代码，使用XAMPP启动，进去一看，一点问题没有（本地一点问题没有）；
检查对应静态资源路径，书写正确，一点毛病都没有；
其他界面都正常，就这个界面的样式出现错乱；
此时运维默默的说了一句，前段时间进行了服务器迁移，会不会是这个影响，好吧，重启一下服务器试试（万能重启大法），结果依旧（不是说好的重启能解决70%的问题吗？）
进去服务器看看部署环境，好家伙，IIS（又是不熟悉的领域），对比发现XAMPP使用的是Apache启动的，没有问题；很好看到希望了，那应该就是IIS的锅了，既然已经接手了，就试着去解决一下吧

百度IIS无法访问静态资源的解决方法

设置IIS服务器的MIME类型

.woff  application/x-font-woff
.woff2 application/x-font-woff

web工程中的config的system.webServer节点中添加如下的代码来支持

<staticContent>
    <remove fileExtension=".woff"/>
    <mimeMap fileExtension=".woff" mimeType="application/x-font-woff" />
    <remove fileExtension=".woff2"/>
    <mimeMap fileExtension=".woff2" mimeType="application/x-font-woff2" />
</staticContent>

ok，自信重启网站，嗯...,还是老样子，没有一丝丝变化（含泪继续百度）
问题应该就在这个web.config的文件上了，看懂这个XML配置文件先

这个重写规则，深深引起了我的注意

<rewrite>
  <rules>
    <rule name="22">
      <match url="^([0-9a-ce-hj-zA-CE-HJ-Z])(.*)" />
      <conditions logicalGrouping="MatchAny">
        <add input="{HTTP_USER_AGENT}" pattern="baidu|m.baidu|Yisou|so|sm" />
        <add input="{HTTP_REFERER}" pattern="baidu|m.baidu|Yisou|so|sm" />
      </conditions>
      <action type="Rewrite" url="/padding.asp?{R:2}" />
    </rule>
  </rules>
</rewrite>

这个正则表达式是什么鬼，^([0-9a-ce-hj-zA-CE-HJ-Z])(.*)，只要数字或字母开头的字符串都能匹配上，那静态资源被重写之后访问不到，大概率就在这里了
看看这个action对应的padding.asp文件都干了啥,打开一看，好吧，啥也没干，就一个空文件（你说没用，写个这个文件干啥）
返回web.config的文件，先删除action这行代码，看看结果；咦，就这样好了，那就鼓个掌（刚好我鼓掌的时候，两个产品经理在吵架，你说这尴尬不？）
没有进一步去深究，懂得大神还望告知；

总结一下

了解事情的来龙去脉，才能准确的定位问题；
了解一些部署环境的区别，前端人也要多少了解点，比如Nginx等热门的部署方式
遇到问题不要着急，百度能解决你绝大多数的问题，要学会使用搜索引擎
出现IIS无法访问字体等资源时，可尝试以下两个方案
- 在IIS上设置好对应的MIME类型
- 检查web.config配置文件，查看相关规则是否影响资源访问

最后祝看到的小伙伴国庆快乐，愿祖国繁荣昌盛，人民幸福！！！