sockjs 是一個(gè)為瀏覽器和服務(wù)器之間建立持久連接的庫。Vue.js 是一個(gè)流行的 JavaScript 框架，它提供了一些非常有用的工具，可以創(chuàng)建交互式 Web 應(yīng)用程序。如果你想在 Vue 應(yīng)用程序中使用 sockjs，需要先安裝 sockjs-client。下面是如何在 Vue 應(yīng)用程序中安裝 sockjs-client。

npm install sockjs-client --save

運(yùn)行此命令后，sockjs-client 將被安裝到項(xiàng)目的 node_modules 文件夾中，并添加為項(xiàng)目的依賴項(xiàng)。現(xiàn)在你可以在 Vue 組件中使用該庫了。下面是一個(gè)簡單的 Vue 組件示例，展示了如何使用 sockjs 客戶端庫與服務(wù)器建立連接：

<template>
<div>
<p>Connected: {{ connected }}</p>
<p>Messages: {{ messages }}</p>
</div>
</template>
<script>
import SockJS from 'sockjs-client';
export default {
data() {
return {
connected: false,
messages: []
}
},
mounted() {
const sock = new SockJS('http://localhost:8080/sockjs');
sock.onopen = () => {
console.log('SockJS connection open');
this.connected = true;
};
sock.onmessage = (e) => {
console.log('Received message:', e.data);
this.messages = [...this.messages, e.data];
};
sock.onclose = () => {
console.log('SockJS connection closed');
this.connected = false;
};
}
}
</script>

上面的示例中，我們使用 SockJS 創(chuàng)建了與服務(wù)器的連接。此連接包括在消息傳遞期間保持打開狀態(tài)并跨多個(gè)請求/響應(yīng)周期保持持久性。當(dāng)連接成功建立時(shí)，連接狀態(tài)為“connected”并在組件中設(shè)置為 true。在接收到新消息時(shí)，我們將其添加到 messages 數(shù)組中以便呈現(xiàn)到 UI 中。