Запрос XHTTP в расширении chrome выполняется дважды

Question

Я пытаюсь выполнить сценарий PHP на моем сервере с расширением Chrome. Вот вызов ajax:

      data_array_ = JSON.stringify(data_array_);
      //console.log("Connections array" + data_array_);
      var file_address = "https://my.server/add_on_php_files/update_database.php";
      var xhttp_request = new XMLHttpRequest();
      xhttp_request.onreadystatechange = function() {
        if (this.readyState == 4 && this.status == 200) {
          var response = this.responseText;
          console.log(response);
        };
      };
      xhttp_request.open("POST", file_address, true);
      xhttp_request.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
      xhttp_request.send("data_array=" + data_array_);

Это код PHP:

<?php
session_start();
include_once 'database.php';
$data_array = $_REQUEST["data_array"];
$data_array_entry = json_decode($data_array, true);
$statement_to_call = "INSERT INTO contacts (name, phone)  VALUES ";
  $length = count($data_array_entry);
  $index = 0;
foreach($data_array_entry as $single_data) {
  $statement_to_call .= "('".$single_data['name']."','".$single_data['phone']."')";
  if(++$index != $length){
   $statement_to_call .= ", ";
  } else {
   $statement_to_call .= ";";
  }
};
$sql = mysqli_query($connect, $statement_to_call);
echo  $statement_to_call;

?>

К сожалению, когда я выполняю этот вызов без открытых инструментов разработчика, скрипт завершается до выполнения во второй раз, помещая дополнительные данные в мою базу данных (я просмотрел журналы сервера и увидел, что сценарий выполняется дважды). Если я выполняю вызов с открытыми инструментами разработчика, вызов выполняется только один раз, и сетевая панель и база данных показывают ожидаемые результаты. Очевидно, я не могу ожидать, что пользователь будет постоянно держать инструменты разработчика открытыми, так что это проблема, которую мне нужно решить. Пошаговое выполнение Javascript также не может показать мне проблему, потому что оно также выполняется без проблем. Если проблема возникает, когда я использую его в обычном режиме, но не возникает, когда я пытаюсь отладить, как я могу найти причину, по которой PHP выполняется дополнительное время?

Я просмотрел php запустить один раз и дважды вставить в mysql базу данных и увидел, что люди рекомендовали отредактировать .htaccess, чтобы предотвратить второй вызов файла PHP, но когда я попытался реализовать решение, все файлы на веб-сайте стал 404'd. .htaccess код:

RewriteEngine On
RewriteBase /
RewriteCond %{REQUEST_FILENAME} !-d
RewriteCond %{REQUEST_FILENAME} !-f
RewriteRule ^(.*)$ index.php?path=$1 [QSA,L,NC]
RewriteCond %{HTTP_REFERER} !^http(s)?://(.+\.)?my\.server/ [NC]
RewriteRule .*\.(js|css)$ - [NC,F,L]

.htaccess код с попыткой решения .htaccess:

RewriteEngine On
RewriteBase /
RewriteCond %{REQUEST_FILENAME} !favicon.ico
RewriteRule .* index.php [L]
RewriteCond %{REQUEST_FILENAME} !-d
RewriteCond %{REQUEST_FILENAME} !-f
RewriteRule ^(.*)$ index.php?path=$1 [QSA,L,NC]
RewriteCond %{HTTP_REFERER} !^http(s)?://(.+\.)?my\.server/ [NC]
RewriteRule .*\.(js|css)$ - [NC,F,L]

Процесс запускается нажатием этой кнопки:

<button class="screen_button" id="add_data">Add data</button>

A прослушиватель событий щелчка был добавлен к кнопке при запуске, таким образом, кнопка запускает процесс, который передает сообщение в сценарий содержимого и получает ответное сообщение, которое приводит к:

function get_array_data (contact_array_) {
  //create data to insert
  var data_array_ = [];
  data_array_.push({name: name_1, phone: phone_1});//data retrieved from the content script and passed in through the contact_array_ parameter
  data_array_.push({name: name_2, phone: phone_2});
  //so on so forth
  ajax_call(data_array_);//refer to top of post for the ajax code
}

Данные создаются и отправляются в запрос правильно, и оператор console.log в обратном вызове ajax выводит то, что я ожидал, и только один раз. Таким образом, я пришел к выводу, что что-то вызывает повторное выполнение файла PHP, независимо от вызова ajax. Дополнительное выполнение файла PHP не возвращается и не дает еще один console.log.

После дополнительного исследования я обнаружил, что проблема, похоже, начинает возникать после указанного c элемента в chrome .storage устанавливается. Я установил переменную в хранилище chrome, чтобы я мог использовать ее, чтобы определить, должен ли мой сценарий содержимого реагировать на двойной щелчок. Код, который переключает настройку (настройка не инициализируется, пока она не будет вызвана в первый раз):

function toggle_setting () {
  chrome.storage.sync.get(["setting"], function(result){
    var setting = result.setting;
    if (setting == "on"){
      chrome.storage.sync.set({"setting": "off"});
    }else{
      chrome.storage.sync.set({"setting": "on"});
    }
  });
}

Код сценария содержимого:

document.addEventListener("dblclick", function() {
  chrome.storage.sync.get(['setting'], function(result){
    if (result.setting == "on") {
      chrome.runtime.sendMessage({info: "click", data: contact_data_});
    }
  }
}
chrome.runtime.onMessage.addListener(
  function(request, sender, sendResponse){
    if(request.message === "get_contacts"){
      chrome.runtime.sendMessage({info: "contacts", data: contact_data_});
    }
    //other conditions, etc.
  }
);

И код, который прослушивает отправленные сообщения в среде расширения:

chrome.runtime.onMessage.addListener(
  function(message, sender, sendResponse){
    if(message.info == "click"){
      get_array_data(message.data);
    }else if(message.info == "contacts"){
      get_array_data(message.data);
    }
  }
);