Не могу отправить данные с гугл расширения на сервер

Question

manifest.json:

{
"name": "Title",
"description": "Description",
"version": "1.0",
"manifest_version": 3,
"icons": {
    "16": "./icons/16.jpg"
},
"action": {
    "default_popup": "index.html"
},
"permissions": ["scripting", "tabs", "storage", "webRequest"],
"host_permissions": ["http://<my_ip>/*", "http://*/", "https://*/"]

}

scripts/index.js:

const mainSubmit = document.querySelector("#main__submit");

mainSubmit.addEventListener("click", (event) => {
  event.preventDefault();

  // получаем активную вкладку
  chrome.tabs.query({ active: true, currentWindow: true }, (tabs) => {
    const tab = tabs[0];

    if (!tab) {
      alert("Нет активных вкладок");
      return;
    }

    const activeTabId = tab.id;
    
    // внедрение кода в текущую web-страницу
    const injectSpec = {
      target: { tabId: activeTabId },
      func  : getInformationAboutQuestion // внедрится на страницу в активной вкладке
    };

    chrome.scripting.executeScript(injectSpec);
  });
});

/**
  получение всей информации о текущем вопросе
*/
function getInformationAboutQuestion() {
  const result = {
      "text": "lorem",
      "type": "some_type"
  }

  // обращаемся к серверу для получения ответа
  fetch("http://<my_ip>/cats/get_milk/", {
      method: "POST",
      headers: {
        "Content-Type": "application/json",
        "Accept"    : "application/json"
      },
      body: JSON.stringify(result)
    })
      .then((response) => response.json())
      .then((data) => {
        alert(`Reponse from server:\n${JSON.stringify(data)}`);
        // const { answer } = data;

        // alert(`Правильный ответ: ${answer}`);
      })
      .catch((error) => {
        alert(`Произошла ошибка при обращении к серверу: ${error}`);
      });
}

при нажатии на кнопку должен отправляться запрос, но я получаю ошибку: TypeError: Failed to fetch

маршрут http://<my_ip>/cats/get_milk доступен и работает через postman

Answer 1

переместил логику отправки данных на сервер в background.js:

chrome.runtime.onMessage.addListener((request, sender, sendResponse) => {
    if (request.action === "get_answer") {
        fetch(request.url, {
            method: "POST",
            headers: {
                "Content-Type": "application/json",
                "Accept"      : "application/json"
            },
            body: JSON.stringify(request.data)
        })
            .then((response) => {
                if (!response.ok) {
                    throw new Error(`HTTP error! status: ${response.status}`);
                }

                return response.json();
            })
            .then((data) => {
                sendResponse({ data });
            })
            .catch((error) => {
                sendResponse({ error: error.toString() });
            });

        return true;
    }
});

а в index.js осталось:

chrome.runtime.sendMessage({ action: "get_answer", url: "http://<my_ip>/cats/get_milk/", data: result }, (response) => {
        if (response.error) {
            alert(`Произошла ошибка при обращении к серверу: ${response.error}`);
        } else {
            alert(response.data);
        }
    });

manifest.json:

{
"name": "Title",
"description": "Description",
"version": "1.0",
"manifest_version": 3,
"icons": {
    "16": "./icons/16.jpg"
},
"action": {
    "default_popup": "index.html"
},
"permissions": ["scripting", "tabs", "storage", "webRequest"],
"host_permissions": ["http://<my_ip>/*", "http://*/", "https://*/", "<all_urls>"],
"background": {
    "service_worker": "background.js"
}

}

БЛОГ НА HUSL

Не могу отправить данные с гугл расширения на сервер

Ответы (1 шт):