javascript - WebSocket:调用 close() 不会触发 onclose 处理程序？

Question

我正在阅读 Andrew Lombardi 的书“WebSocket”，它说

You can manually trigger calling the onclose event by exe‐ cuting the close() method on a WebSocket object,

第 15 页

但是当我调用 close() 方法时，它没有触发 onclose 事件...

在 Chrome 上:当调用 close() 时，服务器停止发送帧，几秒钟后 (可能 6-7 秒)，我的 onclose 处理程序被调用.

在 iOS 11 上:当调用 close() 时，服务器停止发送帧，但从未调用 onclose 处理程序。

那么，websocket关闭事件的真相是什么？

我在 React 中的演示应用程序代码

import React, { Component } from 'react'
class App extends Component {
  constructor(props) {
    super(props)
    this.state = {
      log: [],
    }
    this.ws = null
  }

  render() {
    return (
      <div>
        <button type="button" onClick={this._open}>
          open
        </button>
        <button type="button" onClick={this._close}>
          close
        </button>

        <div
          style={{
            padding: 10,
            backgroundColor: '#ddd'
          }}
        >
          {this.state.log.map((item, index) => {
            return <div key={index}>{item}</div>
          })}
        </div>
      </div>
    )
  }

  _open = () => {
    this.ws = new WebSocket('wss://cmb.100jc.net/answer/ws')
    this.ws.onopen = () => {
      alert('open')
      this.setState(prevState => {
        return {
          log: prevState.log.concat('open')
        }
      })
    }
    this.ws.onclose = () => {
      alert('close')
      this.setState(prevState => {
        return {
          log: prevState.log.concat('close')
        }
      })
    }
    this.ws.onerror = () => {
      this.setState(prevState => {
        return {
          log: prevState.log.concat('error')
        }
      })
    }
  }

  _close = () => {
    this.ws.close()
  }
}

export default App

Answer 1

close() 方法尝试正常关闭 websocket。它在实际关闭套接字之前等待 closeTimeout 秒(默认为 30 秒)，在此期间另一个对等点可以关闭一个帧。在此期间之后，套接字关闭并发出事件。您可以在 this great stack overflow answer 中阅读更多相关信息.