javascript - Redux-thunk dengan Websockets


Saya ingin mencipta websocket secara atas permintaan apabila komponen tertentu ingin melanggan data. Bagaimana saya boleh berkongsi contoh websocket dengan cara redux?

action.js

export function subscribeToWS(url) {
   return dispatch => {
      let websocket = new WebSocket(url)
      websocket.on('connect', () => {
         websocket.send("subscribe") 
      }
      websocket.on('message', (message) => {
        dispatch(storeNewData(message))
      }
   } 
}

Saya boleh melakukan sesuatu seperti ini, tetapi ini memerlukan satu contoh baru untuk setiap langganan baru.

Jawapan #1

Tempat standard untuk meletakkan perkara seperti objek sambungan berterusan adalah di dalam middleware. Malah, terdapat berpuluh-puluh middleware sedia ada yang menunjukkan pendekatan tersebut, dengan kebanyakan daripadanya disenaraikan di https://github.com/markerikson/redux-ecosystem-links/blob/master/middleware.md#sockets-and-adapters. Anda sepatutnya boleh menggunakan beberapa daripadanya seperti sedia ada, atau sekurang-kurangnya sebagai contoh.

Jawapan #2

Anda boleh melihat redux-websocket-bridge. Ia menguraikan mesej Web Socket ke dalam tindakan Redux, dan menyampaikan tindakan Redux ke Web Socket.

Kelebihan pendekatan ini: anda boleh menggunakan Redux di pelayan anda sebagai titik akhir API, menggantikan API REST standard dengan kod yang lebih sedikit.

Selain itu, jika pelayan anda tidak menghantar Flux Standard Action, anda masih boleh menggunakan redux-websocket-bridge untuk mesej mentah. Ia berfungsi dengan string, ArrayBuffer, dan Blob. Sudah tentu, anda sentiasa boleh menulis middleware kecil untuk menterjemahkannya ke dalam Flux Standard Action, contohnya mesej dari Slack RTM API.