Uncaught SyntaxError: Unexpected token
想必前端同学对这个很熟悉, 造成这个错误的原因, 大多数情况下是JS语法不规范—即只有开始的符号, 没有结束的符号.
很可惜, 我不是一小部分人, 所以, 我也遇到了这个问题, 并且被它困扰了三个月. 当然, 于我而言, 错误的原因跟其他人不一样. 我不知道有多少同学知道SSO(单点登录)的概念, 如果不清楚, 请点击链接.
首先说一下我遇到的情形:
上线大半年了, 页面突然之间崩了(包括样式文件丢失, JS文件丢失). 而且这种情况只发生在极少数的电脑上面. 而且因为某些原因, 我既不能去现场查看, 也无法远程操控, 因此效率极其低下. 关键是大领导还发话了, 要尽快弄好. 对于浏览器而言, 清缓存是个神器, 大多数页面问题都可以通过这个操作被解决. 同样, 我尝试过很多次, 但是没有任何效果. 然后就开始调样式, 晚上回家后, 照着出问题的页面调整样式, 后来综合得出, 是因为有几个样式文件丢失了. 紧接着, 查看 DevTools 的 NetWork 面板, 发现本该是CSS的文件, 里面却是JS代码—window.location.href=internetSite/sso/.
好, 问题找到了, 就该找原因. 看了下SSO的代码, 里面有个过滤器文件, 把所有的文件都过滤了(身份验证通过的不会被过滤)—
登陆后, 附带一个校验码, 把这个校验码带到外部文件的请求中, 如果第一次验证失败, 会有一次页面重定向(到登录页), 再验证校验码, 如果通过, 再重定向(到文件URL), 获取相应文件.如下:
css文件URL–>internetSite/sso/–>获取CSS文件
第二部分: 图片无法加载
图片加载失败可能有三个原因:
1. 网络问题, 请求超时
2. 资源路径有误
3. DOM加载错误
而我要说的是DOM加载错误. 这种情况也出现的很少, 但是一旦出现, 很难排查. 虽说浏览器能够只能识别部分标签的开闭, 但是某些多余的标签, 很可能会导致其后(或其中)的资源加载失败. 检验的方法也很简单, 对比DevTools中的Element和Sources面板, 后者是浏览器解析前的文件, 在那里面可以找到多余的标签.