<script
data-src="https://cdn.com/step1.js"
data-line-start="1"
>
// code for step 1
</script>
<script data-line-start="1001">
// '\n' * 1000
// code for step 2
</script>
<script
data-src="https://cdn.com/step3.js"
data-line-start="2001"
>
// '\n' * 2000
// code for step 3
</script>
经过这样处理后，如果一个错误的 error.line 是 3005 的话，那意味着实际的 error.script 应该是 'https://cdn.com/step3.js'，而实际的 error.line 则应该是 5。我们可以在之前提到的 reportError 函数里面完成这项行号反查工作。
当然，由于我们没办法保证每一个脚本文件只有 1000 行，也有可能有些脚本文件明显小于 1000 行，所以其实不需要固定分配 1000 行的区间给每一个 <script> 标签。我们可以根据实际脚本行数来分配区间，只要保证每一个 <script> 标签所使用的区间互不重叠就可以了。
crossorigin 属性
浏览器对于不同源的内容进行的安全限制当然不仅限于 <script> 标签。既然 XMLHttpRequest 可以通过 CORS 来突破这个限制，为什么直接通过标签引用的资源就不可以呢？这当然是可以的。
针对 <script> 标签引用不同源脚本文件的限制同样作用于 <img> 标签引用不同源图片文件。如果一个 <img> 标签是不同源的话，一旦在 <canvas> 绘图时用到了，该 <canvas> 将变为只写状态，保证网站不能通过 JavaScript 窃取未授权的不同源图片数据。后来 <img> 标签通过引入 crossorigin 属性解决了这个问题。如果使用 crossorigin="anonymous"，则相当于匿名 CORS；如果使用 `crossorigin=“use-credentials”，则相当于带认证的 CORS。
既然 <img> 标签能这样做，为什么 <script> 标签就不能这样做？于是浏览器厂商就为 <script> 标签加入了同样的 crossorigin 属性用于解决上述安全限制问题。现在 Chrome 和 Firefox 对这个属性的支持是完全没有问题的。Safari 则会把 crossorigin="anonymous" 当做 crossorigin="use-credentials" 处理，结果是如果服务器只支持匿名 CORS 则 Safari 会当做认证失败。由于 CDN 服务器出于性能的考虑被设计为只能返回静态内容，不可能动态的根据请求返回认证 CORS 所需的 HTTP Header，Safari 相当于不能利用此特性来解决上述问题。
总结
JavaScript 异常处理看起来很简单，跟其它语言没什么区别，但真的要把异常都捕获了然后对属性做分析，其实还不是那么容易的事情。现在尽管有一些第三方服务提供捕获 JavaScript 异常的类 Google Analytics 服务，但如果要弄明白其中的细节和原理还是必须自己亲手做一次。
您可能感兴趣的文章: