

以下の警告が出ます。解決方法を教えてください！

**警告メッセージ:**

[code]

    jquery.min.js:4 [Deprecation] Synchronous XMLHttpRequest on the main thread is deprecated because of its detrimental effects to the end user's experience. For more help, check https://xhr.spec.whatwg.org/.
    
[/code]

[![](https://i.stack.imgur.com/RScay.png)](https://i.stack.imgur.com/RScay.png)

**現状のコード:**

[code]

    <!DOCTYPE html>
    <html lang="ja">
    <head>
    <meta charset="utf-8">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
    </head>
    
    <body>
    
      <h1>Microsoft Translator テキスト API サンプル</h1>
      <h2>フォームの入力データを英語に翻訳します。</h2>
    
      <div id="japanese"></div>
    
      <input type="text" id="inText" oninput="inputText()" placeholder="入力してください">
      <div id="endMsg">入力完了と判定しました<br>入力：</div>
      <script type="text/javascript">
        "use strict"
    
          var gTimer; 
          function inputText(){
            var wObj    = document.getElementById("endMsg");
            wObj.innerHTML = '入力中です';
            wObj.className = 'defStyle runStyle';
            if(gTimer){clearTimeout(gTimer);}
            gTimer = setTimeout(inputEnd, 700);
          }
    
          function inputEnd(){
    
            var wObj    = document.getElementById("endMsg");
            wObj.innerHTML = '入力完了と判定しました<br>入力：'+document.getElementById("inText").value;
            wObj.className = 'defStyle endStyle';
    
            const now = new Date();
            const nowtime = now.getTime();
    
            const getToken = function() {
              const defer = $.Deferred();
          
              const arr = JSON.parse(sessionStorage.getItem("tdata"));
        
              if (arr === null || arr.time + 1000 * 60 * 8 < nowtime) {
                $.ajax({
                  url: 'https://api.cognitive.microsoft.com/sts/v1.0/issueToken',
                  type: 'POST',
                  headers: {
                    'Content-Type': 'application/json',
                    'Accept': 'application/jwt',
                    'Ocp-Apim-Subscription-Key': 'キー',
                  },
                  async: false,
                }).done(function(data) {
        
                  const datalist = {
                    time: nowtime,
                    token: data,
                  }
                  sessionStorage.setItem('tdata', JSON.stringify(datalist));
                });
              }
        
              const arr2 = JSON.parse(sessionStorage.getItem("tdata"));
              const token = arr2.token;
              defer.resolve(token);
              return defer.promise();
            };
        
            $.when(getToken()).done(function(token) {
              const key = 'Bearer ' + token;
              const text = $("#inText").val();
              const response = $.ajax({
                  url: 'https://api.microsofttranslator.com/v2/http.svc/Translate',
                  type: 'GET',
                  data: {
                    'appid': key,
                    'Accept': 'application/xml',
                    'text': text,
                    'to': 'en',
                  },
                  async: false,
                })
              const data = response.responseText;
              const translation = data.replace(/<("[^"]*"|'[^']*'|[^'">])*>/g, '');
              $("#japanese").text(translation);
        
            })
          }
      </script>
    </body>
    </html>
    
[/code]


CC BY-SA 4.0
2021-09-01T16:36:37.940
81168
2021-09-02T01:08:22.420
2021-09-02T01:08:22.420
3060
48008
question
javascript jquery node.js ajax
「メインスレッドでの同期XMLHttpRequestは、エンドユーザーエクスペリエンスに悪影響を与えるため、非推奨です」の警告表示を解消したい