Chrome不允许在页面关闭或导航跳转时发送同步请求_chrome 发送请求后关闭页面

Fetch keepalive

Fetch API提供了一种处理服务器交互的强大方法，以及一个跨平台API使用的一致接口。keepalive选项设置为true，则即使发起该请求的页面已经终止，也能确保请求继续执行。
chrome浏览器有负载限制：64KB。请求为"高"优先级。
window.addEventListener('unload', {
    const data = { username: 'example' };
    fetch('/xxxurl', {
        method: 'POST',
        headers: {
            'Content-Type': 'application/json',
        body: JSON.stringify(data),
        keepalive: true
        Body可以是如下任意类型：ArrayBuffer，ArrayBufferView，Blob/File，string，URLSearchParams，FormData 
var postdata = {};
postdata["username"] = "example";
postdata["password"] = "123";
formBody = new URLSearchParams();
for(let k in postdata) {
    if(typeof(postdata[k]) === 'object') {
        formBody.append(k, JSON.stringify(postdata[k]));
    } else {
        formBody.append(k, postdata[k]);
const options = {
    credentials: 'include',
    method: 'POST',
    headers: {
        "Content-type": "application/x-www-form-urlencoded; charset=UTF-8",
    body: formBody,
    keepalive: true
fetch('/url', options); 
Navigator.SendBeacon() 
        SendBeacon实际底层使用的是Fetch API。所以可以确保页面卸载后请求继续，也同样具有chrome浏览器有64KB的负载限制。只能发送POST请求。请求为"最低"优先级。
         数据可以是如下任意类型：ArrayBuffer，ArrayBufferView，Blob，DOMString，FormData，URLSearchParams。
         自定义请求头Content-Type必须是以下三种之一：
         "text/plain"，"application/x-www-form-urlencoded"，"multipart/form-data" 
        如果数据类型是DOMString，则默认Content-Type为"text/plain"： 
navigator.sendBeacon(url, data); 
       如果数据类型是Blob，则Content-Type一般设置为"application/x-www-form-urlencoded"： 
const blob = new Blob([JSON.stringify(data), {
    type: 'application/x-www-form-urlencoded',
navigator.sendBeacon(url, blob); 
        如果想要以"application/json"的形式发送数据，则需要使用Blob适当调整： 
const blob = new Blob([JSON.stringify({ some: "data" })], {
    type: 'application/json; charset=UTF-8'
navigator.sendBeacon('/log', blob)); 
        如果数据类型是FormData，则直接创建FormData，此时Content-Type会自动设置为"multipart/form-data"： 
const formData = new FormData();
for(let k in postdata) {
    if(typeof(postdata[k]) !== 'string') {// formData只能append string 或 Blob
        formData.append(k, JSON.stringify(postdata[k]));
    } else {
        formData.append(k, postdata[k]);
navigator.sendBeacon(action, formData); 
参考：
https://zhuanlan.zhihu.com/p/532162177
https://blog.csdn.net/qq_29722281/article/details/125553696
  
				前言最近需要做一个阻挡用户关闭页面的功能，大概流程是当用户关闭页面，弹出“确定关闭提示”，点击“离开此页“关闭页面，点击“留在此页”关闭提示框。而当用户下次再关闭的时候不在给予提示。减少用户厌恶感。为了实现功能需要用到了onbeforeunload,onunload和onunloadcancel。 简单说明图：var text = "真的离开?"
window.onbeforeunload = fu
window.addEventListener('beforeunload', function (e) {
    // Cancel the event
    e.preventDefault();
    // ...
在 unload / beforeunload 中发送同步请求
报错：Uncaught DOMException: Failed to execute ‘send’ on ‘XMLHttpRequest’: Failed to load ‘https://xxxx/’: Synchronous XHR in page dismissal.
chrome 不支
				beforeunload
当浏览器窗口关闭或者刷新时，会触发beforeunload事件。当前页面不会直接关闭，可以点击确定按钮关闭或刷新，也可以取消关闭或刷新。
能够触发请求（谷歌）
如果处理函数为Event对象的returnValue属性赋值非空字符串，浏览器会弹出一个对话框，来询问用户是否确定要离开当前页面（如下示例）。没有赋值时，该事件不做任何响应。
有些浏览器会将返回的字符串展示在弹...
				unload和beforeunload是在窗口卸载的时候会触发，可以在用户刷新或者关闭窗口的时候处理一些逻辑，如果在两个事件监听中添加 alert、confirm、prompt会忽略，所以我们想提示用户或者想调试一下这种方法是不可行的，要是在事件中添加debugger，窗口关闭的时候可以跟进断点，但是刷新的时候断点也被忽略了。废话少说直接上测试代码
//以两种方式去绑定事件，事件触发写...
				在使用chrome headless模式的时候，设置了代理，结果界面死活不进行跳转
解决方法：
chromeOptions.setCapability(CapabilityType.ACCEPT_INSECURE_CERTS, true);
加上此句后，就可以正常跳转了。。。
相关文章：https://stackoverflow.com/questions/48979520/chrome-hea...
				`requests` 库在发送 HTTP 请求时，可以使用 `headers` 参数来携带 HTTP 请求头信息。HTTP 请求头中包含了有关请求的元数据，比如浏览器类型、编码方式等。
例如，在使用 `requests` 库发送 GET 请求时，可以使用如下代码：
```python
import requests
headers = {'User-Agent': 'Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_2) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/79.0.3945.117 Safari/537.36'}
response = requests.get('https://www.example.com', headers=headers)
在这个例子中，我们指定了 `User-Agent` 请求头，告诉服务器我们使用的浏览器是 Chrome 79。
使用 `headers` 参数携带的 HTTP 请求头信息，可以帮助服务器更好地理解请求，并作出更合适的响应。