今天看啥  ›  专栏  ›  牧羊童鞋

IE8和IE9下的console.log

牧羊童鞋  · 简书  ·  · 2017-10-17 13:31

最近遇到一个IE9下js挂了的问题,我用IE11模拟着看的,没有任何问题,但是同事看页面确实是挂的,一脸懵逼。最后发现我两的区别就是:我开着devtool,而他木有,懵逼啊。搜了下发现:

Only supports console functions when developer tools are open, otherwise the console object is undefined and any calls will throw errors.

IE8和IE9下都是只有当developer tools打开的时候,才可以使用console.log,否则就会报错,😓

然而对我来说,最关键是监控系统sentry竟然对一个如此严重的线上bug完全失聪,这是大问题啊。为了弄清楚这个问题,我做了简单的测验,首先我在页面中写下如下代码:

window.onerror = function (argument) {
  alert(JSON.stringify(argument));
}
console.log('IE9 log')
意料之中的报错信息

可以看到IE9非常不出所料的报错了。后面我加上sentry的raven.js,发现后台监控始终收不到报错信息,而同样的页面我在chrome上访问,立马就能收到报错,去年买了个表啊,why?

好在IE9还有个dev tool,F12打开它,打开后自然不会报console.log的错了,所以需要主动抛出一个错误throw new Error('IE9 error')来测试了。首先看下IE9有没有发出上报请求,切换到network面板看下吧。

第一个http上报请求被301了,后面的https又被400了

可以看到,确实是上报了,但是你为啥要用http上报,我写的上报url明明是https的啊(问题一),http上报被301是因为我们sentry server不接受http的上报。后面被301后,换成正确的https了,那你又为啥要把我的POST改成GET(问题二),两个问题导致上报失败。

  • 问题一:我写的url中https被改成http了
    chrome下debugger跟踪上报流程的源码,最后我们可以看到问题出在了这里。


    凶手在这里

IE下上报,raven直接把协议名干掉,强制使用相对url,而目前我们的网站还是http的,最后自然就使用http上报了,然后就被301了

  • 问题二:http+post 301后为啥会变成https+get

查阅301会发现,301会存在修改http method的可能,301 code 只适合于 GET or HEAD methods ,其余应该使用308更好

The HTTP 301 Moved Permanently redirect status response code indicates that the resource requested has been definitively moved to the URL given by the Location headers. A browser redirects to this page, and search engines update their links to the resource (In SEO-speak, it is said that the link-juice is sent to the new URL).
Even if the specification requires the method, and the body, not to be altered when the redirection is performed, not all user-agents align with it, and you can still find buggy software out there. It is therefore recommended to the 301 code only as a response for GET or HEAD methods and to use the 308 Permanent Redirect instead, as the method change is explicitly prohibited with this status.

The HTTP 308 Permanent Redirect redirect status response code indicates that the resource requested has been definitively moved to the URL given by the Location headers. A browser redirects to this page, and search engines update their links to the resource (In SEO-speak, it is said that the link-juice is sent to the new URL).
The request method and the body will not be altered, whereas 301 may incorrectly sometimes be changed to a GET method.

既然都查到这了,顺便把302,307页温习下吧

重定向的各种30x码

结论:实战问题中的细节请不要随意忽略,它能让人学到好多且印象深刻




原文地址:访问原文地址
快照地址: 访问文章快照