背??景最近在公司做一个内部项目。测试的时候发现接口请求完成后，并没有带上相关的数据。然后打开控制台查看是不是接口问题。发现界面报如下异常，状态码为200.，但是无法显示返回内容，控制台提前打开Preserve日志。理论上应该记录之前发送的request，结果是看不到Response。经过排查，发现对Preserve日志的理解有偏差，引发了接下来的探索。Preservelog介绍要跨页面加载保存请求，请选中Network面板上的Preservelog复选框。DevTools会保存所有请求，直到您禁用保留日志。根据Chrome官方文档，如果勾选了Preservelog，那么在跨页面加载请求时，会保留之前的所有请求，目的是方便开发同学排查一些跨站请求是接口的一些问题，比如数据比较等等但是官网没有写的是，如果要看返回的Response，必须在页面跳转前提前点击查看界面，这样之后才能看到之前界面返回的信息跳跃。对于那些没有被点击过的界面，返回的结果是无法在下一页查看的。Response看到的信息类似于上图，会出现常见错误“Failedtoloadresponsedata”。所有浏览器都是这样吗？或者这只是Chrome家族？接下来分析Preserve日志的兼容性。保留日志兼容性我们选择了三个浏览器作为示例，即Chrome、Safari和Firefox。验证步骤如下：选择一个可以从A网站跳转到B网站的页面打开控制台，勾选Preservelog选项刷新页面，在A页面找到任何请求打开，点击A网站跳转对任何其他请求B网站的链接，在B网站查看之前A网站的请求数据实验结果如下：在Chrome中，实验结果和我们之前看到的一样，只有点击的请求将被保留，未点击的请求不会被删除。将显示响应。Safari在Safari中，Preservelog的性能与Chrome相同。只有点击后的界面才会保留Response。如果不点击，会显示“尝试加载资源时发生错误”，并且无法查看相应的结果。Safari有一个优点是，跳转到B网站后，控制台所有来自A网站的请求都是灰色的，方便观察和操作。Firefox在Firefox中，如果勾选PersistLogs，请求会被完整保留，在下一页可以看到上一页的完整请求和返回信息，说明Firefox是无限制的。为什么Preservelog并没有完整的保留请求日志呢？通过以上分析，我们可以发现，不同的浏览器对于保存日志的处理方式是不同的。Chrome的这种处理方式也引发了对该问题的广泛讨论，是一个由来已久的问题。总之，一般有两种思想流派。反对者：NetWork中的错误很容易让别人误认为错误发生在服务器端，造成误解。如果重定向发生的很快，用户很难点击链接，所以必须借助第三方工具来帮助保留日志歧义，明明是为了保留日志，但实际结果不如Charles等工具完整.同意方（chromium开发者）：这是“低开销”的结果，Response不会发送到DevTools，除非用户想要查看并点击它，目的是避免扭曲测量结果。如果把所有的Response都保留在DevTools中，会增加很多不必要的内容。如果用户大量点击跨站链接，后果不堪设想。这是折扣中最好的解决方案，兼顾了易用性和灵活性。双方都有自己的理由，但我认为Chrome应该把这个权限放开给开发者，因为DevTools本来就是为开发者服务的。有用，Preservelog并没有解决开发者跨站请求需要查看原始链接的问题。保留日志的初衷应该是保留所有的Request和Response信息，而不应该是一个阉割版。它应该由开发人员控制。此选项，并承担相应的结果。否则，有时你不得不使用第三方工具来抓包，或者像issue中提到的，需要在代码层面进行处理，这无疑让一个原本简单的功能复杂化了。Chromium在浏览器厂商的改进节奏问题上也有一些反馈。本来以为这个需求没有必要，优先级比较低。2017年因为优先级和资源问题关闭了，不过最近好像重启了。Status已经变成Open，预计以后的版本可以改善这个问题。综上所述，以上就是对Preservelog的简单介绍。如果在开发中确实遇到以上问题，可以考虑以下解决方案：使用火狐浏览器（目前好像很少人用）比如issue上面提到的，在代码中通过打点的方式进行调试，"window.onunload=function(){debugger;}"，但是在实际中使用Charles等抓包工具抓包并不方便
