Skip to content

Commit 8f760a2

Browse files
authored
1 parent 310d7df commit 8f760a2

File tree

1 file changed

+67
-18
lines changed

1 file changed

+67
-18
lines changed

README.md

Lines changed: 67 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -12,6 +12,8 @@ var ws = new WebSocket('ws://....');
1212
```
1313
you can replace with:
1414
```javascript
15+
import ReconnectingWebSocket from 'react-native-reconnecting-websocket'
16+
1517
var ws = new ReconnectingWebSocket('ws://....');
1618
```
1719
Less code, more exponential.
@@ -20,7 +22,36 @@ Less code, more exponential.
2022
```bash
2123
npm i react-native-reconnecting-websocket
2224
```
23-
25+
## How reconnections occur
26+
With the standard WebSocket API, the events you receive from the WebSocket instance are typically:
27+
```bash
28+
onopen
29+
onmessage
30+
onmessage
31+
onmessage
32+
onclose // At this point the WebSocket instance is dead.
33+
```
34+
With a ReconnectingWebSocket, after an onclose event is called it will automatically attempt to reconnect. In addition, a connection is attempted repeatedly (with a small pause) until it succeeds. So the events you receive may look something more like:
35+
```bash
36+
onopen
37+
onmessage
38+
onmessage
39+
onmessage
40+
onclose
41+
// ReconnectingWebSocket attempts to reconnect
42+
onopen
43+
onmessage
44+
onmessage
45+
onmessage
46+
onclose
47+
// ReconnectingWebSocket attempts to reconnect
48+
onopen
49+
onmessage
50+
onmessage
51+
onmessage
52+
onclose
53+
```
54+
This is all handled automatically for you by the library.
2455

2556
## Parameters
2657

@@ -72,30 +103,54 @@ var socket = new ReconnectingWebSocket(url, null, {reconnectInterval: 3000});
72103
- Accepts `integer` or `null`.
73104
- Default: `null`
74105

75-
### own options
76-
77-
#### `unrecognized`
106+
#### `origin`
78107
- Preserve deprecated backwards compatibility for the `origin` option
79108

80109
#### `headers`
81110
- Specifying `origin` as a WebSocket connection option is deprecated. Include it under `headers` instead
82111
- Accepts `origin` and `Cookie`
83112
- Example:
84113
```javascript
85-
WebSocket(url, '', {Cookie: 'key=value'});
114+
WebSocket(url, '', { headers: { Cookie: 'key=value', origin: "https://secret-host.com" } });
86115
```
87116

88117
---
89118

90119
## Methods
91120

92-
See the detail in [react-native/WebSocket.js](https://github.com/facebook/react-native/blob/master/Libraries/WebSocket/WebSocket.js)
121+
#### `ws.close(code?: number, reason?: string)`
122+
123+
- Closes the WebSocket connection or connection attempt, if any. If the connection is already CLOSED, this method does nothing.
124+
- `code` is optional the closing code (default value 1000). [https://tools.ietf.org/html/rfc6455#section-7.4.1](https://tools.ietf.org/html/rfc6455#section-7.4.1)
125+
- `reason` is the optional reason that the socket is being closed. [https://tools.ietf.org/html/rfc6455#section-7.1.6](https://tools.ietf.org/html/rfc6455#section-7.1.6)
126+
127+
#### `ws.send(data: string | ArrayBuffer | ArrayBufferView | Blob)`
128+
129+
- Transmits data to the server over the WebSocket connection.
130+
- Accepts @param data a text string, ArrayBuffer, ArrayBufferView or Blob
131+
132+
#### `ws.ping()`
93133

94-
## How to add heartbeat?
134+
- Sending websocket ping/pong frame.
135+
- Some servers do not support it and need to be implemented manually, like `How to add heartbeat?`
136+
137+
#### `ws.reconnect()`
138+
139+
- Additional public API method to refresh the connection if still open (close, re-open).
140+
- For example, if the app suspects bad data / missed heart beats, it can try to refresh.
141+
142+
143+
See the more detail in [[react-native/WebSocket.js@3982a2c6]](https://github.com/facebook/react-native/blob/3982a2c6bd116a6dcc6ee6889e4a246b710b70a7/Libraries/WebSocket/WebSocket.js)
144+
<br/>
145+
146+
# For example: How to add heartbeat?
95147
1. usual
96148
```javascript
97-
ws = new WebSocket("ws://...");
149+
import ReconnectingWebSocket from 'react-native-reconnecting-websocket'
98150

151+
const ws = new ReconnectingWebSocket("ws://...");
152+
153+
// ws listeners
99154
ws.onopen = (e) => {
100155
console.log("onopen",e)
101156
};
@@ -109,8 +164,10 @@ ws.onerror = (e) => {
109164
console.log("onerror",e)
110165
};
111166

112-
// add listen connecting event
113-
// @params reconnectAttempts 尝试重连的次数
167+
/*
168+
* listen reconnecting event (Powered by ReconnectingWebSocket)
169+
* @params reconnectAttempts 尝试重连的次数
170+
*/
114171
ws.onconnecting = (reconnectAttempts) => {
115172
console.log("onconnecting", reconnectAttempts)
116173
}
@@ -158,11 +215,3 @@ var heartCheck = {
158215
}
159216
}
160217
```
161-
3. add new API `reconnect()`
162-
```javascript
163-
/**
164-
* Additional public API method to refresh the connection if still open (close, re-open).
165-
* For example, if the app suspects bad data / missed heart beats, it can try to refresh.
166-
*/
167-
ws.reconnect()
168-
```

0 commit comments

Comments
 (0)