iink SDK Web

Answered

Websocket Timeout using MyScriptJS

We are in the process of migrating to MyScriptJS from the myscript-math-web package and we are seeing timeouts while attempting to connect to the WebSocket for the first time.

The WebSocket attempts to reach wss://cloud.myscript.com/api/v4.0/iink/document but a response is never received.

I can reproduce this issue every time when using MyScriptJS.register on DOMContentLoaded. Here is our configuration:

  

const configuration = {
        recognitionParams: {
            type: "MATH",
            protocol: "WEBSOCKET",
            apiVersion: "V4",
            server: {
                scheme: "https",
                applicationKey: "xxxxxx",
                hmacKey: "xxxxxx",
            },
            v4: {
                math: {
                    mimeTypes: ["application/x-latex"],
                    solver: {
                        enable: false
                    }
                },
                text: {
                    guides: { enable: false }
                }
            }
        }
    };
    instance = register(element, configuration);

 

 


Best Answer

We figured it out. We were sending events to the element before it was ready, e.g.

let instance = MyScript.register(element, configuration);
instance.clear(); // Broken

Adding a loaded event seems to work OK: 

let instance = MyScript.register(element, configuration);
instance.addEventListener("load", () => {
    instance.clear(); // Works OK
});


 


Should clarify a few things here that weren't clear from the original post. There is traffic going through the WebSocket, but the .loader spinner just stays on the screen and I cannot draw on the component.

Re-registering the component sometimes fixes the issue, but not every time.

Dear Ryan,


Thank you for your question.


I am not sure to fully understand your issue, but according to your question, I recommand you to take as a starting point the MyScriptJS Math websocket example that you can find https://myscript.github.io/MyScriptJS/examples/v4/websocket_math_iink.html. The source code is available : https://github.com/MyScript/MyScriptJS/blob/master/examples/v4/websocket_math_iink.htm


I applied your configuration and replaced the MyScript register of the previous example by the following code block and the registration works fine (NB you should replace the application and hmac keys by your keys)


  
  document.addEventListener("DOMContentLoaded", () => {    
  const configuration = {
        recognitionParams: {
            type: "MATH",
            protocol: "WEBSOCKET",
            apiVersion: "V4",
            server: {
                scheme: "https",
                applicationKey: "xxxxxx",
                hmacKey: "xxxxxx",
            },
            v4: {
                math: {
                    mimeTypes: ["application/x-latex"],
                    solver: {
                        enable: false
                    }
                },
                text: {
                    guides: { enable: false }
                }
            }
        }
    };
    
         /**
       * Attach an editor to the document
       * @param {Element} The DOM element to attach the ink paper
       * @param {Object} The recognition parameters
       */
      MyScript.register(editorElement, configuration);
    
    alert("DOM ready!");
  });



Best regards,


Gwenaëlle

Answer

We figured it out. We were sending events to the element before it was ready, e.g.

let instance = MyScript.register(element, configuration);
instance.clear(); // Broken

Adding a loaded event seems to work OK: 

let instance = MyScript.register(element, configuration);
instance.addEventListener("load", () => {
    instance.clear(); // Works OK
});


 

Hello Ryan,


Thank you for your update.

We are happy you fixed your issue!


Best regards,


Gwenaëlle