WebSocket connection to 'ws://localhost:3000/ws' failed: と言われたら<React>

Reactを使ってアプリを使っていると[WebSocket connection to 'ws://localhost:3000/ws' failed: ]と怒られた。
原因が分からなくて放置していたけど、流石にエラーがうるさいので対応することにした。

環境としてはDockerを使って、3000番ポートのReactアプリを8000番ポートに対応させ、Railsサーバーを3000番ポートで動かしていた。

原因はここにあった。React側は自分が3000番ポートで動いていると思っているため、何かしらの処理に必要なWebSocket通信を自分自身に要求している。
しかし、3000番ポートではRailsサーバーが動いているためWebSocketに接続できずよくわからない挙動をしていたのだ。
対応としては、Railsサーバーを3001番ポートとかで動かして、Reactを3000番ポートで動かす。
もしくはReactを最初から8000番ポートで動かす必要がある。