index2.html

<!DOCTYPE html>
<html lang="en" >

<head>
  <meta charset="UTF-8">
      <title>Live chat widget</title>
      <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/meyer-reset/2.0/reset.min.css">
      <link rel='stylesheet prefetch' href='https://fonts.googleapis.com/css?family=Roboto"rel="stylesheet'>
      <link rel="stylesheet" href="css/style2.css">
</head>
<body>

  <div class="chat-widget-wrapper">
  <div class="chat-widget-container">
    <div class="chat-widget-text">
      <p class="heading">Virtual Dressing Room</p>
      <p>Click here to try it on</p>
    </div>
    <div class="chat-widget-avatar">
      <img src="https://image.flaticon.com/icons/svg/533/533564.svg" alt="" />
    </div>
  </div>
  <div class="chat-box-container">
    <div class="chat-box-content">
      <iframe id="receiver" src="http://plugins.viubox.com:8030/vdm/" width="300" height="420"></iframe>
      <div style="display: table-cell; vertical-align: middle; text-align: center;">
        
        <input type="button" value="Measure Your Body Remotely" onclick="window.location.href='http://api.syz.ai:5000'" class="btn btn-info" />
        
        </button>
    </div>
    </div>
  </div>
</div>
  <script src='https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.0/jquery.min.js'></script>
  <script  src="js/index.js"></script>
  <script>
    var receiver = document.getElementById('receiver').contentWindow;
    function receiveMessage(e) { receiver.postMessage(e.data, 'https://plugins.viubox.com:8020/vdm/index.html') };
    window.addEventListener('message', receiveMessage);
  </script>
</body>
</html>