zoukankan      html  css  js  c++  java
  • HTTP请求头引发的诡异BUG

    简介

    项目是去年的项目,用的前端框架是AngularJS+gulp构建。

    因为知道AngularJS有模板缓存机制,所以在之前的项目里,如果修改了模板想要查看最新的效果,一般都是刷新按钮右键,清空缓存并硬性重新加载。

    或者就是配置个轻量级的本地服务器http-server,执行命令强制禁用缓存,就不需要每次刷新。

    http-server -c-1

    但是发布到线上以后就会有问题了,因为用的是IIS服务,又没有配置缓存。每次更新服务器上的模板后,领导总是说他哪里看不到。还有更神奇的,领导说有时候打开页面会显示一片空白???这怎么可能,怎么可能会有这种事。我一直跟她强调不可能,我的电脑都没有这种情况!随即被叫到她的电脑前查看,并告诉她要强制刷新就好了,边说边给她演示。强制刷新后跟他说,看吧没问题吧。

    再刷新,卧槽!真的空白了。

    随即回去在自己的电脑上试,偶尔会出现这样的情况,可是为什么呢,以前都这样用没有问题啊!

    问题还是要解决的???!!!

    没办法,老老实实的回去查找问题。

    查找问题

    分析问题第一步

    先要看看有没有异步请求,毕竟我的所有页面(模板)都是异步调用的。打开控制台,在network->XHR里查看页面空白时的response。获取页面时有请求,但请求的内容让窝大吃一惊,完全不是我写的模板该有的内容。随后去网上查找了这些代码的意思,百度找不到相关的内容。随即翻墙Google。找到的讨论说可能是网络劫持,页面空白时响应的内容里包含一个IP地址,查询IP后得知这是网络运行商的服务器地址。又联想到公司对上网有限制,所以怀疑是公司的防火墙引发的问题。

    但是,在自己家里的时候偶尔也会出这样的问题。这就让我丈二和尚摸不着头脑,问公司的后台,其他同事,都说没有遇到过这样的情况。这就神奇了啊!!

    好在我加过一个AngularJS的QQ群,把我的问题发到群里,结果没人鸟我。无奈只能求助群主(破狼--AngularJS的布道者),希望他能帮我解答一二。当我把问题发给群主,恳切希望他可以帮我分析下是什么原因,可群主说他忙没有时间,我谢过以后指望他有空的时候能帮我看下,结果也没有下文了。

    分析问题第二步

    无奈只能自己动手,丰衣足食了。我分析原因可能是处在HTTP请求上,随即把异步请求HTML页面的请求头和请求接口的请求头拿出来做比较

    并没有发现什么不同。随即重新做了一个DEMO,异步请求一个HTML页面,然后看到了不一样的地方

    在Request Headers里看到了不一样的请求头,X-Requested-With!随即搜索这是个什么请求头,得到的结果是用来区分发送到服务器的请求是异步请求,还是同步请求!但这好像不是个标准的请求头,也不准确,因为在我异步请求接口的时候也没有这个请求头。维基百科上关于这个请求的解释是用来设置异步请求,部分框架会设置这个请求头

    X-Requested-With: XMLHttpRequest

    在我把这个请求头加到angular-ui-router的源代码里(用来配置路由,页面,控制器等),页面打开出现空白的问题才算解决了!无论在公司还是在家里,都没有再出现过。

    总结

    究其原因我也是百思不得其解,一个小小的请求居然会导致请求的页面内容为空。难道对HTML文档来说,通常只能够是同步请求,异步请求的话就会出问题?在我本地使用http-server配置的本地服务上就从来没有这样的问题,但在IIS上部署就会有。这本身也就说明了IIS上的某些配置,确切来说是对静态资源做了某些限制。

  • 相关阅读:
    创建类以及引用一个类
    修改hosts文件
    微信第三方登录接口开发
    Android定位
    Leetcode 102. Binary Tree Level Order Traversal
    Leetcode 725. Split Linked List in Parts
    Leetcode 445. Add Two Numbers II
    Leetcode 328. Odd Even Linked List
    Leetcode 237. Delete Node in a Linked List
    Leetcode 234. Palindrome Linked List
  • 原文地址:https://www.cnblogs.com/zhang-jian/p/8784596.html
Copyright © 2011-2022 走看看