Feathers Client + Socket.io
With Socket.io configured on the server service methods and events will be available through a websocket connection. While using the REST API and just listening to real-time events on a socket is possible, Feathers also allows to call service methods through a websocket which, in most cases will be faster than REST HTTP.
Establishing the connection
Feathers sets up a normal Socket.io server that you can connect to using the Socket.io client either by loading the socket.io-client
module or /socket.io/socket.io.js
from the server. Unlike HTTP calls, websockets do not have a cross-origin restriction in the browser so it is possible to connect to any Feathers server. See below for platform specific examples.
ProTip: The socket connection URL has to point to the server root which is where Feathers will set up Socket.io.
Client options
The Socket.io configuration (socketio(socket [, options])
) can take settings which currently support:
timeout
(default: 5000ms) - The time after which a method call fails and times out. This usually happens when calling a service or service method that does not exist.
Changing the default timeout value
app.service('messages').timeout = 3000;
Browser Usage
Using the Feathers client, the feathers-socketio/client
module can be configured to use that socket as the connection:
<script type="text/javascript" src="socket.io/socket.io.js"></script>
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/core-js/2.1.4/core.min.js"></script>
<script type="text/javascript" src="//unpkg.com/feathers-client@^1.0.0/dist/feathers.js"></script>
<script type="text/javascript">
var socket = io('http://api.feathersjs.com');
var app = feathers()
.configure(feathers.hooks())
.configure(feathers.socketio(socket));
var messageService = app.service('messages');
messageService.on('created', function(message) {
console.log('Someone created a message', message);
});
messageService.create({
text: 'Message from client'
});
</script>
Server Usage
Here's how to use the Feathers socket.io client in NodeJS. A great use case would be workers that need to update the server or broadcast to all connected clients.
$ npm install feathers feathers-socketio feathers-hooks socket.io-client
const feathers = require('feathers/client');
const socketio = require('feathers-socketio/client');
const io = require('socket.io-client');
const socket = io('http://api.feathersjs.com');
const app = feathers().configure(socketio(socket));
// Get the message service that uses a websocket connection
const messageService = app.service('messages');
messageService.on('created', message => console.log('Someone created a message', message));
React Native Usage
Here's how you can use Feathers client with websockets in React Native.
$ npm install feathers feathers-socketio feathers-hooks socket.io-client
import React from 'react-native';
import hooks from 'feathers-hooks';
import feathers from 'feathers/client';
import socketio from 'feathers-socketio/client';
import io from 'socket.io-client/socket.io';
if(!global._babelPolyfill) { require('babel-polyfill'); }
const socket = io('http://api.feathersjs.com', { transports: ['websocket'] });
const app = feathers()
.configure(feathers.hooks())
.configure(socketio(socket));
// Get the message service that uses a websocket connection
const messageService = app.service('messages');
messageService.on('created', message => console.log('Someone created a message', message));
Debugging
Socket.io and feathers uses debug to deliver the messages. You can use it in the Browser by setting the filter in the localStorage: localStorage.debug = '*';