[SalesForce] how to connect to websocket in Lightning

I am using Leapjs external library and trying to execute a simple Leapjs function : loop in lightning component.

I got content security policy error which goes like this

Refused to connect to 'ws://127.0.0.1:6437/v3.json' because it violates the following Content Security Policy directive: "connect-src 'self'".

now in documentation it says that XHR and websockets can only be called by same domain. (mostly it is lightning.force.com but my domain is 127.0.0.1:6437.

I have also added

<meta http-equiv="Content-Security-Policy" content="connect-src 'self'"/>

in my code

any workaround ?

Best Answer

Tested WebSockets in Open CTI adapter url. It works perfectly fine. Change the ws:// uri as per your setup in below source code.

<html>
<head>
   <script type="text/javascript" src="http://na11.salesforce.com/support/api/28.0/interaction.js"></script>
   <script type="text/javascript">
       var callback = function (response) {
           if (response.result) {
              alert('Screen pop was set successfully.');
           }
           else {
              alert('Screen pop failed.' + result.error);
           }
        };
       function screenPop() {
                //Invokes API method
                sforce.interaction.screenPop('/001x0000003DGQR', true, callback);
        }
</script>


        <script type="text/javascript">
            var webSocket;
            var data = "";

            function openSocket()
            {
                // Open server socket
                if (webSocket !== undefined && webSocket.readyState !== WebSocket.CLOSED) {
                    alert("WebSocket is already opened");
                    return;
                }

                webSocket = new WebSocket("ws://xxx.xxx.xxx.xxx:8080/sample/sampleendpoint");

                if (webSocket === undefined)
                {
                    alert("Error creating socket...");
                    return;
                }

                webSocket.onopen = function()
                {
                    alert("in onopen callback");
                }

                webSocket.onmessage = function(event)
                {
                    alert("in onmessage callback   " + data);
                }

                webSocket.onclose = function()
                {
                    alert("in onclose callback");
                }
            }

        </script>

</head>
<body>
       <button onclick="openSocket();">Open Socket</button>
</body>
</html>