Fail to load webchat bot on webpage using ngrok

Hello there I hosted a HTML page on Google Sites to try run my chatbot. The HTML page used the code from this webchat code here . I just changed the localhost part with the ngrok url. My ngrok url forwarded http://localhost:5005.

If i opened the webpage on computer in the same network, the chatbot is loaded. (Notice the blue balloon there)

But when I open the webpage on another computer outside the network, the blue balloon chat is not there.

To what I understand, ngrok secure a tunnel to expose your localhost to the web but please correct me if I’m wrong. Below is the code that I use on my HTML file. Feel free to help!

<!doctype html>

<html lang="en">
  <meta charset="utf-8">

  <title>Test Lisa</title>
  <link rel="stylesheet" href="css/styles.css?v=1.0">

<div id="webchat"></div>
<script src=""></script>
    selector: "#webchat",
    initPayload: "/greet",
    customData: {"language": "en"}, // arbitrary custom data. Stay minimal as this will be added to the socket
    socketUrl: "",
    socketPath: "/",
    title: "Lisa",
    subtitle: "Chat with the new Edaran Bot!",
    params: {"storage": "session"} // can be set to "local"  or "session". details in storage section.