未捕获的 DOMException：在访问可用变量时尝试使用不可用或不再可用的对象

Question

我正在编写一个与 websocket 服务器通信的客户端。目前，套接字服务器向客户端发送生成的“令牌”，然后客户端将其设置为存储：

      localStorage.setItem('token', json.token);

并重定向到下一页，该页面在加载时运行此代码：

token = localStorage.getItem('token')


console.log(token)



socket.send(JSON.stringify({"type": "getplayerinfo", "token": token}));

当执行 console.log(token) 时，我得到令牌。然而，当通过套接字发送令牌时，我得到：

Uncaught DOMException: An attempt was made to use an object that is not, or is no longer, usable

我已经调试了三天并且伤透了我的大脑。有什么建议吗？

Answer 1

当您在连接完全连接到服务器之前尝试通过 Websocket 连接发送某些内容时，通常会发生这种情况。因此，您应该做的是当服务器发送连接信号时运行代码，您可以使用事件侦听器“open”。在你的情况下，这将是：

const socket = new Websocket(url);
socket.addEventListener("open", (ev) => {
  socket.send(JSON.stringify({"type": "getplayerinfo", "token": token}));
  });

Answer 2

为了任何新访问者的缘故，这是我作为一个更实际的示例所做的（因为在 open 事件内发送消息并不总是这种情况）：

let ws;    //Global var

async function connect_ws()
{
    return new Promise( resolve =>
    {
        ws = new WebSocket("ws://localhost:12345");

        ws.addEventListener("open", event => {
            console.log("Connected to WS server!");
            resolve();
        });

        ws.addEventListener("message", ( {data} ) => {
            console.log("WS server says: ", JSON.parse(data) );
        });
    });
}

function send_ws(msg)
{
    console.log("Sending message:", msg);
    ws.send(msg);
}

然后，按如下方式使用它（或者也许，使用 .then())：

await connect_ws();
send_ws( JSON.stringify(obj) );

---

注意：

我在 connect_ws() 函数中添加 eventHandlers 的原因是，因为 ws 是一个全局变量，添加全局范围内（函数外部）的 eventHandlers 将在 ws 初始化之前运行！

ps：我不是 Node.js 的专业人士，请随时纠正我。