Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
phoenix-to-redux is a redux-store middleware that integrates phoenix socket communication with the redux store using redux actions.
This example will quickly connect your phoenix socket, and show the simple basic socket events.
After installation and the setting up of the middleware, you can simply copy this code for your root Saga.
All the methods and events associated with the socket
All the events associated with the socket
You can install phoenix-to-redux with or
Using is recommended over npm.
Include the phoenix reducer into your combined reducer
Example below for including the phoenix-to-redux middleware into your application. see , for more info on setting up your store.
Please note the sagaMiddleware used below is not required, this is just what is being use in the example below to intercept all redux actions.
Below is just quick simple React App example
Dive into the specifics of each API endpoint by checking out our complete documentation.
See docs for more detailed information.
Please note all methods need to be dispatched to the redux store either using the
useDispatch hook, the dispatch store function or the put effect in a Saga
All the methods and events associated with the socket
All the methods and events associated with the socket channels
Should an error occur from the phoenix socket, the following redux event is dispatched
Parameter | Description |
---|
All the methods associated with the socket
Should the socket attempt to open, the following redux event is dispatched
Parameter | Description |
---|
Should the socket attempt to disconnect, the following redux event is dispatched
Parameter | Description |
---|
domainUrl
socket endpoint to connect to
string
params
optional parameters to pass when connecting to socket
any
options
optional configuration options
type | SOCKET_ERROR |
error | Error response from socket |
domainKey | endpoint url without socket details or protocol |
socketState | Connection state of socket |
type | SOCKET_OPEN |
socket | phoenix socket |
domainKey | endpoint url without socket details or protocol |
params | socket connection params |
type | SOCKET_DISCONNECT |
socket | phoenix socket |
domainKey | endpoint url without socket details or protocol |
params | socket connection params |
All the methods associated with the socket channels
Should the socket attempt to close, the following redux event is dispatched
Parameter | Description |
---|---|
All the methods and events associated with the socket channels
Should the socket attempt to connect, the following redux event is dispatched
Parameter | Description |
---|---|
Should an error occur from the phoenix socket channel, the following redux event is dispatched. Invoked if the socket connection drops, or the channel crashes on the server.
Parameter | Description |
---|---|
This method will subscribe phoenix channel for the given channelTopic and given events
Recommended that you already have made a socket connection by using connectPhoenix method before using this method.
Parameter | Description | Type | Required |
---|---|---|---|
All the events associated with the socket channels
Should an error occur from the phoenix socket channel, the following redux event is dispatched. Error response after joining the phoenix channel.
Parameter | Description |
---|---|
After phoenix channel is left. The following redux event is dispatched
Parameter | Description |
---|---|
This method will attempt to find the subscribed phoenix channel for the given channelTopic and push data to the channel for the eventName.
Recommended that you already have made a socket connection by using connectPhoenix method before using this method.
Parameter | Description | Type | Required |
---|---|---|---|
Should a phoenix channel be explicitly closed on the server or the channel was explicitly closed by calling channel.leave(). The following redux event is dispatched
Parameter | Description |
---|
After joining a phoenix channel, the following redux event is dispatched.
Parameter | Description |
---|
type
SOCKET_CLOSE
socket
phoenix socket
domainKey
endpoint url without socket details or protocol
params
socket connection params
channelTopic
Name of channel/Topic
string
events
Array of event names to unsubscribe to
string []
type
SOCKET_CONNECT
socket
phoenix socket
domainKey
endpoint url without socket details or protocol
channelTopic
Name of channel/Topic
string
type
CHANNEL_ERROR
channelTopic
Name of channel/Topic
channel
Phoenix channel
channelTopic
Name of channel/Topic
string
logPresence
Determines if presence should be tracked for the channel
boolean
token
private token for channel
string
additionalData
This data will be available for you as additionalData on the response
object
events
Array of event names to subscribe to and will dispatch response to eventActionType
{
eventName:string; eventActionType:string
} []
domainUrl
socket endpoint to connect to
string
channelTopic
Name of channel/Topic
string
event
Event name to unsubscribe to
string
type
CHANNEL_JOIN_ERROR
channelTopic
Name of channel/Topic
channel
Phoenix channel
additionalData
additionalData passed when using getPhoenixChannel
error
Phoenix channel error
type
CHANNEL_LEAVE
channel
Phoenix channel
channelTopic
Name of channel/Topic
string
eventName
Name of the event on channel to push to
string
requestData
Payload data to push on the channel
any
additionalData
This data will be available for you as additionalData on the response
object
loadingStatusKey
A unique identifier you can use to separate progress status
string
endProgressDelay
timeout in milliseconds if you want to delay the endProgress of your loadingStatusKey
number
channelResponseEvent
name of redux event to dispatch to reducer on response from pushing to channel
string
channelErrorResponseEvent
name of redux event to dispatch to reducer on error from pushing to channel
string
channelTimeOutEvent
name of redux event to dispatch to reducer on timeout from pushing to channel
string
dispatchChannelError
false by default, determines if should an on channel error occur dispatch PHOENIX_CHANNEL_ERROR to the reducer
boolean
channelPushTimeOut
timeout in milliseconds for pushing to the channel, default is 1500
number
type | CHANNEL_CLOSE |
channel | Phoenix channel |
type | CHANNEL_JOIN |
channel | Phoenix channel |
additionalData | additionalData passed when using |
response | Phoenix channel response |
Should an error occur from the phoenix socket channel, the following redux event is dispatched. Error response after pushing data to phoenix channel.
Parameter | Description |
---|---|
Should an error occur from the phoenix socket channel, the following redux event is dispatched. Timeout error response after joining the phoenix channel.
Parameter | Description |
---|---|
type
CHANNEL_PUSH_ERROR
channelTopic
Name of channel/Topic
channel
Phoenix channel
error
Phoenix channel error
type
CHANNEL_TIMEOUT
channelTopic
Name of channel/Topic
channel
Phoenix channel
additionalData
additionalData passed when using getPhoenixChannel
error
Phoenix channel error