Есть ли возможность запустить данный код в браузере?

Question

Здрасте, а есть ли возможность провернуть такое в браузере

const axios = require('axios');
const cheerio = require("cheerio");
var day, temp, weather, when;

const parse = async () => {
  const getHTML = async (url) => {
    const { data } = await axios.get(url);

    return cheerio.load(data);
  };

  const $ = await getHTML("https://ru-meteo.ru/chelyabinsk");
  when = $("div.dt")
    .first()
    .contents()
    .filter(function () {
      return this.type === "text";
    })
    .text();
  day = $("div.dt big").eq(0).text();
  temp = $("div.wtr big").eq(0).text();
  weather = $("div.wtr p").eq(0).text();
};

parse();

Код парсит с сайта погоду, полученные данные я хочу вывести на html страницу, но если данный скрипт подключать к html, то выводит ошибку Uncaught ReferenceError: require is not defined, как быть? Или это возможно только в node.js? На чистом js такое не получится?

Answer 1

Такая возможность есть. Только код придётся писать совсем иначе. Подключение библиотек будет не через require, а через тэг script, также будут проблемы с синхронным выполнением кода, так как браузер сам будет определять какой файл быстрее подключить. Вот пример, который выведет ваш город с которого вы откроете страницу через 5 секунд.

И да, с вашим сайтом это скорее всего не сработает. Политика браузера CORS (Cross-Origin Resource Sharing) такова, что не позволит считывать данные с HTTPS, если сам владелец хоста это не разрешит в настройках своего сервера. Поэтому в моём предоставленном примере используется протокол HTTP.

<html>
  <head>
    <title>Example</title>
  </head>
  <body>
    <script>
      setTimeout(async () => {
        const data = await axios.get('http://ip-api.com/json');
        document.body.innerHTML = data.data.city;
      }, 5000);
    </script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/axios/1.2.1/axios.min.js"></script>
  </body>
</html>

БЛОГ НА HUSL

Есть ли возможность запустить данный код в браузере?

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