Expand Minimize Picture-in-picture Power Device Status Voice Recognition Skip Back Skip Forward Minus Plus Play Search
Internet Explorer alert
This browser is not recommended for use with smartdevicelink.com, and may not function properly. Upgrade to a different browser to guarantee support of all features.
close alert
To Top Created with Sketch. To Top
To Bottom Created with Sketch. To Bottom
JavaScript Suite Guides
Example Apps

Example Apps

The JavaScript Suite repository on GitHub provides example apps for both the browser and for NodeJS. This includes a WebEngine app, a WebSocket client app, a WebSocket server app, and a TCP client app. The examples in the folders already come with their own SDL library build files. Check each example app's readme.md file for more information on how to run the respective app.

Troubleshooting

If your app compiles and but does not show up on the HMI, there are a few things you should check:

TCP Debug Transport

  1. Make sure that your HOST and PORT environment variables are set to match the machine running SDL Core.
  2. Make sure there is no firewall blocking the incoming port 12345 on the machine or VM running SDL Core. Also, make sure your firewall allows that outgoing port.
  3. There are different network configurations needed for different virtualization software (VirtualBox, VMware, etc). Make sure yours is set up correctly. Or use Manticore.

Websocket Transport

  1. Make sure that the policy table of SDL Core has the correct app IDs and nicknames as well as enabled=true.
  2. Make sure that the cloud endpoint and cloud transport type provided to SDL Core are correct and reachable by SDL core. There are different network configurations needed for different virtualization software (VirtualBox, VMware, etc). Make sure yours is set up correctly.

WebEngine Transport

  1. Make sure that the manifest.js has provided all necessary fields and that the information is correct.
  2. If you're unable to install your app from a cloud app store, make sure that the app has been compressed to a file archive that can be retrieved via the download URL you provided.

Connecting to an Infotainment System

Connecting as a WebSocket Client

For vanilla JavaScript SDL apps, connecting as a WebSocket client requires a version of SDL Core that can accept incoming WebSocket connections (at least v6.1.0). If you are using Manticore to test your app, note that it currently does not support WebSocket connections.

A workaround to this limitation is to use a proxy program for your app to connect with which modifies the incoming WebSocket connection into a TCP connection. The proxy program then connects to SDL Core on the app's behalf and passes through your transport data. A Java program that does exactly this is available in the repository's JavaScript example folder called proxy.jar. Check the example app's readme.md for how to run it. Please check the Connecting to an Infotainment System guide for more detailed instructions on how to get the emulator's IP address and port number.

This workaround for older versions of Core is also necessary for WebEngine apps.

Connecting as a WebSocket Server

SDL Core acts as the WebSocket client in this case. The information about your app and how Core should connect to it must go into the policy table. Check the Connecting to an Infotainment System guide's Configuring the Connection section for how to set up your policy table to point to your app

The following snippet is a truncated version of what is needed to set up the WebSocket server to accept and pass connections to the SDL library. This example uses the ws npm module for WebSocket connections. Refer to the integration basics guide for the full integration setup.

const SDL = require('./SDL.min.js');
const WS = require('ws');
const PORT = 3000;

// create a WebSocket Server
const appWebSocketServer = new WS.Server({
    port: PORT,
});
console.log(`WebSocket Server listening on port ${PORT}`);

// Event listener for incoming WebSocket connections
appWebSocketServer.on('connection', (connection) => {
    ...
    /* truncated snippet to show only the transport configuration setup */
    /* each new connection corresponds to a new instance of your app */
    lifecycleConfig.setTransportConfig(
        new SDL.transport.WebSocketServerConfig(
            connection
        )
    );
    ...
});
View on GitHub.com
Previous Section Next Section