@aws-amplify/pubsub 4.4.7 → 4.4.8-next.2

package/src/Providers/AWSAppSyncRealTimeProvider/index.ts

@@ -30,12 +30,14 @@ import {
 import Cache from '@aws-amplify/cache';
 import Auth, { GRAPHQL_AUTH_MODE } from '@aws-amplify/auth';
 import { AbstractPubSubProvider } from '../PubSubProvider';
-import { CONTROL_MSG } from '../../index';
+import { CONNECTION_STATE_CHANGE, CONTROL_MSG } from '../../index';
+
 import {
 	AMPLIFY_SYMBOL,
 	AWS_APPSYNC_REALTIME_HEADERS,
 	CONNECTION_INIT_TIMEOUT,
 	DEFAULT_KEEP_ALIVE_TIMEOUT,
+	DEFAULT_KEEP_ALIVE_ALERT_TIMEOUT,
 	MAX_DELAY_MS,
 	MESSAGE_TYPES,
 	NON_RETRYABLE_CODES,
@@ -43,6 +45,10 @@ import {
 	START_ACK_TIMEOUT,
 	SUBSCRIPTION_STATUS,
 } from './constants';
+import {
+	ConnectionStateMonitor,
+	CONNECTION_CHANGE,
+} from '../../utils/ConnectionStateMonitor';
 
 const logger = new Logger('AWSAppSyncRealTimeProvider');
 
@@ -89,8 +95,27 @@ export class AWSAppSyncRealTimeProvider extends AbstractPubSubProvider {
 	private socketStatus: SOCKET_STATUS = SOCKET_STATUS.CLOSED;
 	private keepAliveTimeoutId?: ReturnType<typeof setTimeout>;
 	private keepAliveTimeout = DEFAULT_KEEP_ALIVE_TIMEOUT;
+	private keepAliveAlertTimeoutId?: ReturnType<typeof setTimeout>;
 	private subscriptionObserverMap: Map<string, ObserverQuery> = new Map();
 	private promiseArray: Array<{ res: Function; rej: Function }> = [];
+	private readonly connectionStateMonitor = new ConnectionStateMonitor();
+
+	constructor(options: ProviderOptions = {}) {
+		super(options);
+		// Monitor the connection state and pass changes along to Hub
+		this.connectionStateMonitor.connectionStateObservable.subscribe(
+			ConnectionState => {
+				dispatchApiEvent(
+					CONNECTION_STATE_CHANGE,
+					{
+						provider: this,
+						connectionState: ConnectionState,
+					},
+					`Connection state is ${ConnectionState}`
+				);
+			}
+		);
+	}
 
 	getNewWebSocket(url, protocol) {
 		return new WebSocket(url, protocol);
@@ -147,6 +172,7 @@ export class AWSAppSyncRealTimeProvider extends AbstractPubSubProvider {
 							},
 						],
 					});
+					this.connectionStateMonitor.record(CONNECTION_CHANGE.CLOSED);
 					observer.complete();
 				});
 
@@ -252,6 +278,7 @@ export class AWSAppSyncRealTimeProvider extends AbstractPubSubProvider {
 		const stringToAWSRealTime = JSON.stringify(subscriptionMessage);
 
 		try {
+			this.connectionStateMonitor.record(CONNECTION_CHANGE.OPENING_CONNECTION);
 			await this._initializeWebSocketConnection({
 				apiKey,
 				appSyncGraphqlEndpoint,
@@ -262,6 +289,7 @@ export class AWSAppSyncRealTimeProvider extends AbstractPubSubProvider {
 		} catch (err) {
 			logger.debug({ err });
 			const message = err['message'] ?? '';
+			this.connectionStateMonitor.record(CONNECTION_CHANGE.CLOSED);
 			observer.error({
 				errors: [
 					{
@@ -366,12 +394,20 @@ export class AWSAppSyncRealTimeProvider extends AbstractPubSubProvider {
 			this.socketStatus = SOCKET_STATUS.CLOSED;
 			return;
 		}
+
+		this.connectionStateMonitor.record(CONNECTION_CHANGE.CLOSING_CONNECTION);
+
 		if (this.awsRealTimeSocket.bufferedAmount > 0) {
 			// Still data on the WebSocket
 			setTimeout(this._closeSocketIfRequired.bind(this), 1000);
 		} else {
 			logger.debug('closing WebSocket...');
-			if (this.keepAliveTimeoutId) clearTimeout(this.keepAliveTimeoutId);
+			if (this.keepAliveTimeoutId) {
+				clearTimeout(this.keepAliveTimeoutId);
+			}
+			if (this.keepAliveAlertTimeoutId) {
+				clearTimeout(this.keepAliveAlertTimeoutId);
+			}
 			const tempSocket = this.awsRealTimeSocket;
 			// Cleaning callbacks to avoid race condition, socket still exists
 			tempSocket.onclose = null;
@@ -379,6 +415,7 @@ export class AWSAppSyncRealTimeProvider extends AbstractPubSubProvider {
 			tempSocket.close(1000);
 			this.awsRealTimeSocket = undefined;
 			this.socketStatus = SOCKET_STATUS.CLOSED;
+			this.connectionStateMonitor.record(CONNECTION_CHANGE.CLOSED);
 		}
 	}
 
@@ -432,17 +469,25 @@ export class AWSAppSyncRealTimeProvider extends AbstractPubSubProvider {
 					subscriptionFailedCallback,
 				});
 			}
+			this.connectionStateMonitor.record(
+				CONNECTION_CHANGE.CONNECTION_ESTABLISHED
+			);
 
-			// TODO: emit event on hub but it requires to store the id first
 			return;
 		}
 
 		if (type === MESSAGE_TYPES.GQL_CONNECTION_KEEP_ALIVE) {
 			if (this.keepAliveTimeoutId) clearTimeout(this.keepAliveTimeoutId);
+			if (this.keepAliveAlertTimeoutId)
+				clearTimeout(this.keepAliveAlertTimeoutId);
 			this.keepAliveTimeoutId = setTimeout(
-				this._errorDisconnect.bind(this, CONTROL_MSG.TIMEOUT_DISCONNECT),
+				() => this._errorDisconnect(CONTROL_MSG.TIMEOUT_DISCONNECT),
 				this.keepAliveTimeout
 			);
+			this.keepAliveAlertTimeoutId = setTimeout(() => {
+				this.connectionStateMonitor.record(CONNECTION_CHANGE.KEEP_ALIVE_MISSED);
+			}, DEFAULT_KEEP_ALIVE_ALERT_TIMEOUT);
+			this.connectionStateMonitor.record(CONNECTION_CHANGE.KEEP_ALIVE);
 			return;
 		}
 
@@ -489,6 +534,7 @@ export class AWSAppSyncRealTimeProvider extends AbstractPubSubProvider {
 		});
 		this.subscriptionObserverMap.clear();
 		if (this.awsRealTimeSocket) {
+			this.connectionStateMonitor.record(CONNECTION_CHANGE.CLOSED);
 			this.awsRealTimeSocket.close();
 		}
 
@@ -630,6 +676,9 @@ export class AWSAppSyncRealTimeProvider extends AbstractPubSubProvider {
 						logger.debug(`WebSocket connection error`);
 					};
 					newSocket.onclose = () => {
+						this.connectionStateMonitor.record(
+							CONNECTION_CHANGE.CONNECTION_FAILED
+						);
 						rej(new Error('Connection handshake error'));
 					};
 					newSocket.onopen = () => {
@@ -703,6 +752,9 @@ export class AWSAppSyncRealTimeProvider extends AbstractPubSubProvider {
 
 					function checkAckOk(ackOk: boolean) {
 						if (!ackOk) {
+							this.connectionStateMonitor.record(
+								CONNECTION_CHANGE.CONNECTION_FAILED
+							);
 							rej(
 								new Error(
 									`Connection timeout: ack from AWSRealTime was not received on ${CONNECTION_INIT_TIMEOUT} ms`

package/src/index.ts

@@ -22,6 +22,9 @@ enum CONTROL_MSG {
 	TIMEOUT_DISCONNECT = 'Timeout disconnect',
 }
 
+export const CONNECTION_STATE_CHANGE = 'ConnectionStateChange';
+export { ConnectionState } from './types';
+
 export { PubSub, CONTROL_MSG };
 
 /**

package/src/types/index.ts

@@ -19,3 +19,39 @@ export interface SubscriptionObserver<T> {
 	error(errorValue: any): void;
 	complete(): void;
 }
+
+/** @enum {string} */
+export enum ConnectionState {
+	/*
+	 * The connection is alive and healthy
+	 */
+	Connected = 'Connected',
+	/*
+	 * The connection is alive, but the connection is offline
+	 */
+	ConnectedPendingNetwork = 'ConnectedPendingNetwork',
+	/*
+	 * The connection has been disconnected while in use
+	 */
+	ConnectionDisrupted = 'ConnectionDisrupted',
+	/*
+	 * The connection has been disconnected and the network is offline
+	 */
+	ConnectionDisruptedPendingNetwork = 'ConnectionDisruptedPendingNetwork',
+	/*
+	 * The connection is in the process of connecting
+	 */
+	Connecting = 'Connecting',
+	/*
+	 * The connection is not in use and is being disconnected
+	 */
+	ConnectedPendingDisconnect = 'ConnectedPendingDisconnect',
+	/*
+	 * The connection is not in use and has been disconnected
+	 */
+	Disconnected = 'Disconnected',
+	/*
+	 * The connection is alive, but a keep alive message has been missed
+	 */
+	ConnectedPendingKeepAlive = 'ConnectedPendingKeepAlive',
+}

package/src/utils/ConnectionStateMonitor.ts

@@ -0,0 +1,191 @@
+/*
+ * Copyright 2017-2021 Amazon.com, Inc. or its affiliates. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License"). You may not use this file except in compliance with
+ * the License. A copy of the License is located at
+ *
+ *     http://aws.amazon.com/apache2.0/
+ *
+ * or in the "license" file accompanying this file. This file is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR
+ * CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions
+ * and limitations under the License.
+ */
+
+import { Reachability } from '@aws-amplify/core';
+import Observable, { ZenObservable } from 'zen-observable-ts';
+import { ConnectionState } from '../index';
+
+// Internal types for tracking different connection states
+type LinkedConnectionState = 'connected' | 'disconnected';
+type LinkedHealthState = 'healthy' | 'unhealthy';
+type LinkedConnectionStates = {
+	networkState: LinkedConnectionState;
+	connectionState: LinkedConnectionState | 'connecting';
+	intendedConnectionState: LinkedConnectionState;
+	keepAliveState: LinkedHealthState;
+};
+
+export const CONNECTION_CHANGE: {
+	[key in
+		| 'KEEP_ALIVE_MISSED'
+		| 'KEEP_ALIVE'
+		| 'CONNECTION_ESTABLISHED'
+		| 'CONNECTION_FAILED'
+		| 'CLOSING_CONNECTION'
+		| 'OPENING_CONNECTION'
+		| 'CLOSED'
+		| 'ONLINE'
+		| 'OFFLINE']: Partial<LinkedConnectionStates>;
+} = {
+	KEEP_ALIVE_MISSED: { keepAliveState: 'unhealthy' },
+	KEEP_ALIVE: { keepAliveState: 'healthy' },
+	CONNECTION_ESTABLISHED: { connectionState: 'connected' },
+	CONNECTION_FAILED: {
+		intendedConnectionState: 'disconnected',
+		connectionState: 'disconnected',
+	},
+	CLOSING_CONNECTION: { intendedConnectionState: 'disconnected' },
+	OPENING_CONNECTION: {
+		intendedConnectionState: 'connected',
+		connectionState: 'connecting',
+	},
+	CLOSED: { connectionState: 'disconnected' },
+	ONLINE: { networkState: 'connected' },
+	OFFLINE: { networkState: 'disconnected' },
+};
+
+export class ConnectionStateMonitor {
+	/**
+	 * @private
+	 */
+	private _linkedConnectionState: LinkedConnectionStates;
+	private _linkedConnectionStateObservable: Observable<LinkedConnectionStates>;
+	private _linkedConnectionStateObserver: ZenObservable.SubscriptionObserver<LinkedConnectionStates>;
+	private _networkMonitoringSubscription?: ZenObservable.Subscription;
+
+	constructor() {
+		this._networkMonitoringSubscription = undefined;
+		this._linkedConnectionState = {
+			networkState: 'connected',
+			connectionState: 'disconnected',
+			intendedConnectionState: 'disconnected',
+			keepAliveState: 'healthy',
+		};
+
+		this._linkedConnectionStateObservable =
+			new Observable<LinkedConnectionStates>(connectionStateObserver => {
+				connectionStateObserver.next(this._linkedConnectionState);
+				this._linkedConnectionStateObserver = connectionStateObserver;
+			});
+	}
+
+	/**
+	 * Turn network state monitoring on if it isn't on already
+	 */
+	private enableNetworkMonitoring() {
+		// Maintain the network state based on the reachability monitor
+		if (this._networkMonitoringSubscription === undefined) {
+			this._networkMonitoringSubscription = new Reachability()
+				.networkMonitor()
+				.subscribe(({ online }) => {
+					this.record(
+						online ? CONNECTION_CHANGE.ONLINE : CONNECTION_CHANGE.OFFLINE
+					);
+				});
+		}
+	}
+
+	/**
+	 * Turn network state monitoring off if it isn't off already
+	 */
+	private disableNetworkMonitoring() {
+		this._networkMonitoringSubscription?.unsubscribe();
+		this._networkMonitoringSubscription = undefined;
+	}
+
+	/**
+	 * Get the observable that allows us to monitor the connection state
+	 *
+	 * @returns {Observable<ConnectionState>} - The observable that emits ConnectionState updates
+	 */
+	public get connectionStateObservable(): Observable<ConnectionState> {
+		let previous: ConnectionState;
+
+		// The linked state aggregates state changes to any of the network, connection,
+		// intendedConnection and keepAliveHealth. Some states will change these independent
+		// states without changing the overall connection state.
+
+		// After translating from linked states to ConnectionState, then remove any duplicates
+		return this._linkedConnectionStateObservable
+			.map(value => {
+				return this.connectionStatesTranslator(value);
+			})
+			.filter(current => {
+				const toInclude = current !== previous;
+				previous = current;
+				return toInclude;
+			});
+	}
+
+	/*
+	 * Updates local connection state and emits the full state to the observer.
+	 */
+	record(statusUpdates: Partial<LinkedConnectionStates>) {
+		// Maintain the network monitor
+		if (statusUpdates.intendedConnectionState === 'connected') {
+			this.enableNetworkMonitoring();
+		} else if (statusUpdates.intendedConnectionState === 'disconnected') {
+			this.disableNetworkMonitoring();
+		}
+
+		// Maintain the socket state
+		const newSocketStatus = {
+			...this._linkedConnectionState,
+			...statusUpdates,
+		};
+
+		this._linkedConnectionState = { ...newSocketStatus };
+
+		this._linkedConnectionStateObserver.next(this._linkedConnectionState);
+	}
+
+	/*
+	 * Translate the ConnectionState structure into a specific ConnectionState string literal union
+	 */
+	private connectionStatesTranslator({
+		connectionState,
+		networkState,
+		intendedConnectionState,
+		keepAliveState,
+	}: LinkedConnectionStates): ConnectionState {
+		if (connectionState === 'connected' && networkState === 'disconnected')
+			return ConnectionState.ConnectedPendingNetwork;
+
+		if (
+			connectionState === 'connected' &&
+			intendedConnectionState === 'disconnected'
+		)
+			return ConnectionState.ConnectedPendingDisconnect;
+
+		if (
+			connectionState === 'disconnected' &&
+			intendedConnectionState === 'connected' &&
+			networkState === 'disconnected'
+		)
+			return ConnectionState.ConnectionDisruptedPendingNetwork;
+
+		if (
+			connectionState === 'disconnected' &&
+			intendedConnectionState === 'connected'
+		)
+			return ConnectionState.ConnectionDisrupted;
+
+		if (connectionState === 'connected' && keepAliveState === 'unhealthy')
+			return ConnectionState.ConnectedPendingKeepAlive;
+
+		// All remaining states directly correspond to the connection state
+		if (connectionState === 'connecting') return ConnectionState.Connecting;
+		if (connectionState === 'disconnected') return ConnectionState.Disconnected;
+		return ConnectionState.Connected;
+	}
+}