Как получить XMLHttpRequest для выполнения в расширении Chrome, не заставляя его быть синхронным? - PullRequest
Новая
       51

Как получить XMLHttpRequest для выполнения в расширении Chrome, не заставляя его быть синхронным?

0 голосов
/ 14 ноября 2018

Создание расширения Chrome, которое, когда пользователь щелкает правой кнопкой мыши видео и выбирает мое расширение, открывает всплывающее окно с формой.

Затем пользователь вводит некоторые дескрипторы, а затем нажимает кнопку "Отправить", чтобы преобразовать видео вGIF будет использоваться позже. 

document.forms[0].addEventListener("submit", function() {
    chrome.tabs.query({ active: true }, function(tabs) {
       video_url = tabs[0].url;
       console.log("Here is the link: ", video_url);
       makeGif(video_url);
    });
});

Это то, что происходит при отправке формы, ключевой функцией является 

makeGif(video_url)

В этой функции это соответствующий компонент XMLHttpRequest 

  var json = JSON.stringify(data);
  var xhr = new XMLHttpRequest();
  xhr.open("POST", gifs_api_url, true);
  //Update this
  xhr.setRequestHeader(
    "Content-type",
    "application/json",
    "Gifs-API-Key",
    gifs_api_key
  );

  xhr.onload = function() {
    var gif_response = JSON.parse(xhr.responseText);
    if (xhr.readyState == 4 && xhr.status == "200") {
      //This is where the download GIF part starts
      gif_id = gif_response.success.files.gif.substring(19, 25);
      linksRef.child(gif_id).set({
        id: gif_id,
        link: gif_response.success.files.gif,
        insta_url: url,
        move_name: move_name,
        move_description: move_description,
        move_type: move_type
      });
      console.log(gif_response.success.files.gif);
      //downloadGIF([gif_response.success.files.gif]);
    } else {
      console.log(gif_response);
    }
  };
  xhr.send(json);

Теперь проблема, с которой я сталкиваюсь, заключается в том, что когда я нажимаю кнопку отправки в первый раз, последняя строка 

xhr.send(json);

не выполняется.Но если я заполняю форму во второй раз, то эта строка выполняется, и все работает.

Я обнаружил, что если я заставлю XMLHttpRequest быть синхронным 

  xhr.open("POST", gifs_api_url, false);

Тогда, когда янажмите кнопку отправки при первом запуске.Но, похоже, это не идеальный способ сделать это.

Чего мне здесь не хватает, чтобы запустить асинхронный запрос при первой отправке формы.

Спасибо!

...