一般一个发生在线上的问题,一定是躲过了测试,并且躲过了开发环境开发者的监视,才逃逸到了线上,但是如果测试阶段也没发现,一般也不是什么太严重的问题,所以看到线上问题不要慌,建议先撸撸猫🐈再解决;
但是如果你集成了sentry,那么一切就变得容易很多了,首先是issues列表里会列出该问题,发生了几次,以及发生的页面:
问题现象:
这典型是一个水合问题,做SSR的时候,如果不小心就会写出这种代码,server上运行时返回了一套html,然后本地react渲染完成后有一套html,两套又不一致,欧吼,水合错误!
问题页面:
很显然是首页:
并且因为是reddit来源的用户,大概率也是未登录用户;
分析原因:
很舒服的是,sentry对于水合错误的监控也很到位,sever渲染时候:
客户端渲染阶段:
简单而直观,右上角的按钮出现了抖动,server阶段并没有,客户端有;
ojbk,检查下你的代码,这个组件有没有什么判断逻辑,要保证客户端和服务端渲染的UI要一直,要不然就会出现水合错误;
好了,问题解决!