标签: websocket

与“ws://localhost:8000/”的 WebSocket 连接失败:WebSocket 握手期间出错:意外的响应代码:403

我正在尝试服务器和客户端之间的套接字连接。我的服务器在 python 中。我为后端创建了一个 Fast API WebSocket,Vue.js 位于客户端。后端服务器正在按预期运行。但是每当我尝试加载前端时,我总是在控制台中收到此错误。我搜索了很多网站,但没有找到合适的解决方案。有人可以建议如何解决此错误以通过套接字连接前端和后端吗?

这是我的代码

var socket = new WebSocket("ws://localhost:8000")
socket.onmessage = function(e){
console.log(e.data)
}

socket.onerror = function(e){
console.log(e.data)
}

------------------------------backend--------------------------
@app.websocket("/ws")
async def websocket_endpoint(websocket: WebSocket):
    await websocket.accept()
    while True:
        await websocket.send_text(f"Message text was: {data}")

Run Code Online (Sandbox Code Playgroud)

javascript python sockets websocket

1
推荐指数
1
解决办法
9177
查看次数

useState 未使用 socket.io 正确更新

我正在通过 socket.io 提取数据,但是当侦听来自服务器的传入消息时,我的状态未正确更新。

我可以看到数据正在从套接字中正确提取(每秒 50 个请求),但setQuotes 只是用从服务器返回的新项目替换现有项目(因此我的状态的长度始终为 1)。

  const [quotes, setQuotes] = useState([])
 const subscribe = () => {
    let getQuote = 'quote.subscribe';
    socket.emit(getQuote, {});
    socket.on('listenAction', function (msg) {
        setQuotes([...quotes, msg]) // This just replace the entire state instead of adding items to the existing array
    }); 
}
Run Code Online (Sandbox Code Playgroud)

Subscribe // 打开网络套接字流

state websocket socket.io reactjs react-hooks

1
推荐指数
1
解决办法
1505
查看次数

使用“setFoo”作为 websocket“onmessage”事件的回调时无法更新状态

目标:

我正在尝试通过 websocket 连接从服务器获取消息,并将它们添加到名为 的对象数组中outgoingMessages

问题:

调用outgoingMessages时仅保存最新消息。receive()

我怀疑会发生这种情况,因为仅使用我致电时Websocket.onmessage的值。我已经尝试摆弄它很多次,但我无法解决这个问题。outgoingMessagesconnect()

我怎样才能receive()使用当前状态,而不是初始状态?

提前致谢。

const Dashboard = () => {
  const [incomingMessages, setIncomingMessages] = React.useState([]);
  const ws = React.useRef(null);

  const receive = (message) => {
    setIncomingMessages([...incomingMessages, message]);
  };

  const connect = () => {
    ws.current = new WebSocket(WS_URL + "mqtt/ws/messages");
    ws.current.onopen = () => setWsConnected(true);
    ws.current.onclose = () => setWsConnected(false);
    ws.current.onmessage = (event) => receive(event);
  };

  return (<>Stuff</>)
}
Run Code Online (Sandbox Code Playgroud)

closures websocket reactjs react-state-management react-hooks

1
推荐指数
1
解决办法
1385
查看次数

在Connect Websockets 上传递多个查询参数

我需要在连接时将多个查询参数 (QP) 传递到 WS URL。

wscat -c wss://abcd.us-east-1.amazonaws.com/dev/?a=1&b=1
Run Code Online (Sandbox Code Playgroud)

当我尝试传递多个参数时,wscat使用 exit code 退出[10] 96027。然而,当仅通过 1 个 QP 时,效果非常好。

我搜索了多个 SO 线程,所有线程都通过了 1 QP。我在这里缺少什么?

websocket wscat

1
推荐指数
1
解决办法
1539
查看次数

状态变量钩子不适用于 useEffect 回调

尝试在 React 功能组件中建立 WebSocket 连接,并使用钩子更新状态变量,如下所示 [参考 1]:

export default function foo() {
    const [ arr, setArr ] = useState([])
    ws = useRef(null)

    useEffect( () => {
        ws.current = new Websocket('ws://example.com:1234')
        ws.current.onmessage = (m) => {
            setArr([...arr, m])
        })
    }, []) // Runs once at mount
}
Run Code Online (Sandbox Code Playgroud)

的状态arr未保留。它被覆盖。

注意我也尝试传递arr到效果中,就像这样,但这导致了无限循环。[参考文献 2]。随着 arr 的更新,效果被称为...

        })
    }, [arr])
}
Run Code Online (Sandbox Code Playgroud)

举一个更具体的例子,取三个 websocket 消息:

['a']
['b']
['c']
Run Code Online (Sandbox Code Playgroud)

更新后每条消息的预计到达时间

['a']
['a', 'b']
['a', 'b', 'c']
Run Code Online (Sandbox Code Playgroud)

结果:

['a']
['b']
['c']
Run Code Online (Sandbox Code Playgroud)

为什么不与回调中的钩子arr一起存储? …

javascript state websocket reactjs react-hooks

1
推荐指数
1
解决办法
1064
查看次数

在 NestJs 中使用 Socket IO 连接并发送到房间

我正在尝试使用 socketio 在 Nestjs 中创建一个简单的房间,但无法掌握房间的概念。我想要的是客户端将 id 发送到通用端点,然后服务器将该套接字加入到特定房间,然后开始从其他地方向该房间发送消息。我目前遇到的是客户加入一个名为“会议”的活动,然后收到一个假会议,但我不知道如何让多个客户加入同一个房间并同时收到相同的信息。

客户端(html)

  <script src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/2.3.1/socket.io.js"></script>
  <script>
    const url = 'http://localhost:4001';
    const socket = io(url); 
      socket.on('connect', function() {
        console.log('Connected');
        socket.emit('meeting', { roomId: '12345' });
      });
      socket.on('meeting', function(data) {
        console.log('you have joined the meeting: ', data);
      });
      socket.on('exception', function(data) {
        console.log('event', data);
      });
      socket.on('disconnect', function() {
        console.log('Disconnected');
      });
  </script>
Run Code Online (Sandbox Code Playgroud)

服务器(NestJS):

@WebSocketGateway(4001)
export class PackGateway implements OnGatewayConnection {

  constructor(private otherService: OtherService) {}

  @WebSocketServer()
  server: Server;

  handleConnection() {
    console.log('new connection!');
  }

  @SubscribeMessage('meeting')
  joinUserToMeeting(@MessageBody() data: any, @ConnectedSocket() client: Socket): Observable<WsResponse<any>> …
Run Code Online (Sandbox Code Playgroud)

sockets websocket node.js socket.io nestjs

1
推荐指数
1
解决办法
1万
查看次数

HTTP 服务器推送:服务到服务,无需浏览器

我正在开发一个基于云的后端 HTTP 服务,该服务将公开用于与一些本地系统集成。客户端系统是由外部供应商定制的,它们是具有自己的数据库的后端系统。这些系统部署在我们客户的公司中,我们无权访问它们,也无法控制它们。我们向供应商提供我们的 API 规范,他们实施客户端代码。

我的服务与客户端交换的数据格式基于XML并遵循一定的标准。供应商用不同的编程语言实现他们的客户端系统,随着时间的推移,新的供应商将会出现。我希望尽可能多的客户能够使用我的服务。

我的大部分服务 API 都是类似 REST 的:它接收 HTTP 请求,处理它们,然后发回 HTTP 响应。

此外,我的服务积累了一些数据状态变化,需要定期将这些数据推送到客户端系统。由于以下限制,此用例似乎不适合传统的客户端-服务器 HTTP 请求-响应模型。

  1. 由于业务的性质,客户端系统无法打开自己的 HTTP API 端点,因此我的服务无法与它们建立出站 HTTP 连接来传递数据状态通知。即使用 WebHooks 不是一种选择。

  2. 同时,我的服务利益相关者需要记录确认数据状态通知已被客户端系统接受,因此像 Amazon SNS 这样的即发即忘系统似乎不适用。

我正在考虑解决这个问题的几种方法,但我不确定我是否错过了一些简单的选项或一些已经解决问题的技术。于是就有了这个问题。

问题文本已更新:选项移至我自己的答案。

相关问题和资源

http message-queue server-push websocket grpc

1
推荐指数
1
解决办法
1342
查看次数

Socket.io 3 和 PHP 集成

我使用 PHP SocketIO 类连接 NodeJS 应用程序并发送消息。Socket.io 2 一切都运行得很好,但升级到版本 3 后,PHP 集成停止工作。

当我发送请求时,我收到以下回复:

HTTP/1.1 101 Switching Protocols
Upgrade: websocket
Connection: Upgrade
Sec-WebSocket-Accept: hNcappwZIQEbMz7ZGWS71lNcROc=
Run Code Online (Sandbox Code Playgroud)

但即使我尝试使用“连接”事件记录与服务器的任何连接,我也没有在 NodeJS 端看到任何内容。

这是 PHP 类:

class SocketIO
{
    /**
     * @param null $host - $host of socket server
     * @param null $port - port of socket server
     * @param string $action - action to execute in sockt server
     * @param null $data - message to socket server
     * @param string $address - addres of socket.io on socket …
Run Code Online (Sandbox Code Playgroud)

php sockets websocket node.js

1
推荐指数
1
解决办法
5374
查看次数

Binance API 如何使用 Javascript 连接网络套接字?

我使用 binance 来获取有关以太坊的数据。我通过对 API 的 GET 请求进行了单个 kLine 响应,因此我获得了旧数据,但现在我想保持 kLine 和价格自动更新。

为此,我需要连接币安网络套接字。我该怎么做呢?我正在使用 JavaScript。

javascript websocket binance

1
推荐指数
1
解决办法
8415
查看次数

Python 中的 Websockets 服务器推送

如何用 Python 编写一个 websockets 服务器,它只按时间间隔向所有连接的客户端推送数据,而不等待任何传入消息?

python websocket

1
推荐指数
1
解决办法
2151
查看次数