解决浏览器端 globalThis is not defined 报错

2023年1月4日386

AI 生成的摘要

在开发过程中，生产运维人员报告说页面打开时出现空白，无法进入系统。经过排查发现是print-template-designer报错，报告了一个globalThis is not defined的错误。之前也遇到过类似的错误，一般是由于浏览器版本太低。通过查看Can I Use网站，发现globalThis在chrome70版本之前都不支持。解决方法有两种：让客户升级浏览器版本或者前端进行兼容低版本的升级。最后决定让客户先升级浏览器版本，而在代码层面只需要在head添加一行代码即可解决。此外，还介绍了globalThis是什么的问题。

阅读原文

今日开发时，生产运维人员上报说页面打开一片空白，无法进入系统。排查一下发现是我的print-template-designer报的错，报了一个 globalThis is not defined。

其实之前好像印象中也遇到过此类错误，一般就是浏览器版本太低了。

上 Can I Use 查一下，发现 globalThis 在 chrome70 版本之前都不支持的。

那么解决方法就俩：

让客户升级浏览器版本
前端升级下，兼容下低版本

最后还是让客户先升级浏览器版本了，win7 系统用最新版 108 就好了。（话说今年 chrome 停止支持 win7 了，108 应该是最后一个版本）

另外代码层面怎么解决呢？只需要在 head 添加下面的代码即可。

<head>
  <script>
    this.globalThis || (this.globalThis = this)
  </script>
</head>

再有就是了解下 globalThis 是什么的问题：