Sample code for 30+ languages & platforms
React Native

WebSocket Connect through HTTP Proxy

See more WebSocket Examples

This example shows how to establish a WebSocket connection through an HTTP proxy server.

Chilkat React Native Downloads

React Native
import { Rest, Socket, WebSocket } from '@chilkat/react-native'

async function chilkatExample() {
  // This example requires the Chilkat API to have been previously unlocked.
  // See Global Unlock Sample for sample code.

  // --------------------------------------------------
  // This example borrows the code from the REST using HTTP Proxy example.
  // We first use the Chilkat Socket object to establish a connection to the WebSocket server through an HTTP proxy.
  // Next, the Rest object uses the Socket object for its connection.
  // Finally, the WebSocket object uses the Rest object for its connection.  
  // 

  const rest = new Rest();
  const socket = new Socket();

  // Set the HTTP proxy domain or IP address, and port.
  socket.httpProxyHostname = '192.168.1.79';
  socket.httpProxyPort = 808;

  // Provide authentication to the HTTP proxy, if needed.
  socket.httpProxyUsername = 'HTTP_PROXY_LOGIN';
  socket.httpProxyPassword = 'HTTP_PROXY_PASSWORD';
  socket.httpProxyAuthMethod = 'Basic';

  // Indicate that HTTP requests (i.e. the WebSocket opening handshake) will be sent over the socket.
  // This is important for how the HTTP proxy connection is established.
  socket.httpProxyForHttp = true;

  // Connect to the websocket server through the HTTP proxy.
  const bTls = false;
  const port = 80;
  const maxWaitMs = 5000;
  try {
    await socket.connectAsync('some-websocket-server.com', port, bTls, maxWaitMs);
  } catch {
    console.log(`Connect Failure Error Code: ${socket.connectFailReason}`);
    console.log(socket.lastErrorText);
    return;
  }

  // Tell the Rest object to use the connected socket.
  try {
    rest.useConnection(socket, true);
  } catch {
    console.log(rest.lastErrorText);
    return;
  }

  const ws = new WebSocket();

  // Tell the WebSocket to use this connection.
  try {
    ws.useConnection(rest);
  } catch {
    console.log(ws.lastErrorText);
    return;
  }

  // Add the standard WebSocket open handshake headers that will be needed.
  // (This adds the required HTTP request headers to the rest object.)
  ws.addClientHeaders();

  // Add any additional headers that might be desired.
  // Two common WebSocketSpecific headers are "Sec-WebSocket-Protocol" and "Origin".
  rest.addHeader('Sec-WebSocket-Protocol', 'x-some-websocket-subprotocol');
  rest.addHeader('Origin', 'http://some-websocket-server.com');

  // Do the open handshake.
  let responseBody: string;
  try {
    responseBody = await rest.fullRequestNoBodyAsync('GET', '/something');
  } catch {
    console.log(rest.lastErrorText);
    return;
  }

  // If successful, the HTTP response status code should be 101,
  // and the response body will be empty. (If it failed, we'll have a look
  // at the response body..)
  const statusCode = rest.responseStatusCode;
  console.log(`Response status code: ${statusCode}`);

  if (statusCode !== 101) {
    console.log(responseBody);
    console.log('-- Failed because of unexpected response status code.');
    return;
  }

  // We have the expected 101 response, so let's now validate the 
  // contents of the response, such as the value sent by the server in the
  // Sec-WebSocket-Accept header. 
  try {
    ws.validateServerHandshake();
  } catch {
    console.log(ws.lastErrorText);
    return;
  }

  console.log('WebSocket connection successful.');

  // The application may now begin sending and receiving frames on the WebSocket connection.
  // (At this point, we're done with the rest and socket objects...)

  console.log('Success.');
}