frontend/index.html

<!DOCTYPE html>
<html lang="en">

<head>
  <meta content="text/html; charset=utf-8" http-equiv="content-type" />
  <meta name="viewport"
    content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, viewport-fit=cover" />
  <link rel="icon" href="./img/logo.svg" type="image/svg+xml">
  <link rel="apple-touch-icon" href="./img/pwa/logo-192.png">
  <meta content="yes" name="apple-mobile-web-app-capable" />
  <link rel="mask-icon" href="./img/logo.svg" color="#FFFFFF">
  <meta name="msapplication-TileColor" content="#FFFFFF">
  <meta name="theme-color" content="#ffffff">
  <meta name="referrer" content="origin-when-cross-origin" />
  <meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests">
  <title>BingAI - 聊天</title>
  <!-- Google tag Analytics -->
  <script async src="https://www.googletagmanager.com/gtag/js?id=G-ZVJCFLBFRZ"></script>
  <script>
    window.dataLayer = window.dataLayer || [];
    function gtag(){dataLayer.push(arguments);}
    gtag('js', new Date());
    gtag('config', 'G-ZVJCFLBFRZ');
  </script>
  <!-- Microsoft Clarity -->
  <script type="text/javascript">
    (function(c,l,a,r,i,t,y){
      c[a]=c[a]||function(){(c[a].q=c[a].q||[]).push(arguments)};
      t=l.createElement(r);t.async=1;t.src="https://www.clarity.ms/tag/"+i;
      y=l.getElementsByTagName(r)[0];y.parentNode.insertBefore(t,y);
    })(window, document, "clarity", "script", "kw2cze8oin");
  </script>
  <!-- 百度统计 -->
  <script>
    var _hmt = _hmt || [];
    (function () {
      var hm = document.createElement("script");
      hm.src = "https://hm.baidu.com/hm.js?6002068077c49f5ff6fa1c10d4ae55dc";
      var s = document.getElementsByTagName("script")[0];
      s.parentNode.insertBefore(hm, s);
    })();
  </script>
  <script src="/js/bing/chat/global.js"></script>
  <script src="/js/bing/chat/amd.js"></script>
  <script src="/js/bing/chat/config.js"></script>
  <style type="text/css">@import "/css/bing.css";</style>
</head>

<body>
  <script type="importmap">
    {
      "imports": {
        "rms-answers-SharedStaticAssets-mdast-util-from-markdown": "/rp/4XuwXtSbiAVqhJs_4Ciwl3YcLrM.br.js",
        "rms-answers-SharedStaticAssets-mdast-util-gfm-table": "/rp/ztanaSb3HsieCWGjv3Tl3lECB88.br.js",
        "rms-answers-SharedStaticAssets-micromark-extension-gfm-table": "/rp/u4lHTqMyPv8KR3P-2buvasHaSoM.br.js",
        "rms-answers-SharedStaticAssets-markdown-it": "/rp/7KdbPOT7wEH4JWaJqBx9wrxcwuM.br.js",
        "rms-answers-SharedStaticAssets-katex": "/rp/yscqUoVr2GlqZlY4gxmNnR5oVBA.br.js",
        "rms-answers-SharedStaticAssets-docx": "/rp/7O6toTbIT9CUxT9Lujfh9KGnKPg.br.js",
        "rms-answers-SharedStaticAssets-xlsx": "/rp/QClZgEttYMm4ob59daALw3CJwco.br.js"
      }
    }
  </script>
  <div id="b_sydHeadBg"></div>
  <div id="b_sydConvCont" _iid="SERP.5028">
    <div id="b_sydtoporpole" class="b_sydConvAnsTest"></div>
    <div id="b_sydBgCover"></div>
  </div>
  <div id="sydWelcomeTemplate">
    <div id="b_sydWelcomeTemplate" class="b_wlcmCont" data-priority="2" style="margin-top: 66px;">
      <div class="b_wlcmHdr"><div class="b_wlcmLogo"></div>
      <div class="b_wlcmDesc">必应是由 AI 支持的 Web Copilot</div>
    </div>
    <div class="b_wlcmTileCont b_wlcmTileContConsumer"></div>
    <div class="b_ziTileCont b_wlcmCont"></div>
  </div>
  <script src="/js/bing/chat/core.js"></script>
  <script src="/js/bing/chat/lib.js"></script>
  <div id="app">
    <style>
      /* loading start */
      .loading-spinner {
        display: flex;
        justify-content: center;
        align-items: center;
        height: 100vh;
        opacity: 1;
        transition: opacity 2s ease-out;
      }

      .loading-spinner.hidden {
        opacity: 0;
      }

      .loading-spinner>div {
        width: 30px;
        height: 30px;
        background: linear-gradient(90deg, #2870EA 10.79%, #1B4AEF 87.08%);

        border-radius: 100%;
        display: inline-block;
        -webkit-animation: sk-bouncedelay 1.4s infinite ease-in-out both;
        animation: sk-bouncedelay 1.4s infinite ease-in-out both;
      }

      .loading-spinner .bounce1 {
        -webkit-animation-delay: -0.32s;
        animation-delay: -0.32s;
      }

      .loading-spinner .bounce2 {
        -webkit-animation-delay: -0.16s;
        animation-delay: -0.16s;
      }

      @-webkit-keyframes sk-bouncedelay {

        0%,
        80%,
        100% {
          -webkit-transform: scale(0)
        }

        40% {
          -webkit-transform: scale(1.0)
        }
      }

      @keyframes sk-bouncedelay {

        0%,
        80%,
        100% {
          -webkit-transform: scale(0);
          transform: scale(0);
        }

        40% {
          -webkit-transform: scale(1.0);
          transform: scale(1.0);
        }
      }

      /* loading end */
    </style>
    <!-- loading start -->
    <div class="loading-spinner">
      <div class="bounce1"></div>
      <div class="bounce2"></div>
      <div class="bounce3"></div>
    </div>
    <!-- loading end -->
  </div>
  <script type="module" src="/src/main.ts"></script>
</body>

</html>