Как вызвать api один раз и отправить данные в несколько JS файлов

Question

Я создаю веб-сайт, который запрашивает базу данных.

Я создал метод get API, используя nodejs express для получения данных из базы данных.

Примерно так:

app.get('/getLatestData', (req, res) => {
     var dataArray;
     //some code here to get the array
     res.send(dataArray);
});

поэтому, если я вызову getLatestData, я получу массив, содержащий то, что мне нужно, и мы можем сказать, что-то вроде:

dataArray = [humanName: ab c, humanAge: 25, humanWeight: ..... etc]

Используя это, я создаю веб-сайт, на котором я могу отображать в виде строки такую ​​информацию, как график его веса с течением времени или некоторый текст, например его имя и возраст. .

HTML файл:

<div class="container">
        <div class="text" id="text2">
            <script src="sketch.js"></script>
        </div>
        <div class="chart">
            <canvas id="bar-chart" width="500" height="500">
                <script src="bargraph.js"></script>
            </canvas>
        </div>
</div>

Теперь, как вы можете видеть в этом случае, у меня есть 2 javascript файлов: гистограмма. js и эскиз. js, у меня проблема в том, что в каждом из javascript файлов я запрашиваю API getLatestData следующим образом:

fetch('/getLatestDevice')
        .then(res=>res.json())
        .then(data => {
            newWeight = data.eight
         })
        .catch(err => {
            console.log('error')
        });

я не хочу постоянно вызывать эту выборку API во всех этих различных JS файлах потому что последние данные могут измениться, и я могу получить доступ к различным экземплярам, ​​это Есть ли способ, где я могу вызвать API получить один раз, положить его в переменную и передать его в разные файлы вместо того, чтобы делать это в каждом по отдельности?

Answer 1

Просто присвойте результат метода fetch глобальной переменной, например:

window.latestDevice = undefined; // Global accessible variable
const request = fetch('/getLatestDevice').then((response) => {
      return response.json();
    }).then((data) => {
      window.latestDevice = data;
    });

Тогда вы сможете получить window.latestDevice данные из ваших JS файлов.

Answer 2

В JS объявленные переменные верхнего уровня являются глобальными, что является благословением и проклятием. Вы можете использовать это в ваших интересах. Объявите глобальную переменную и сохраните ответ на вызов API в указанной переменной. Затем вы можете получить к нему доступ во всех ваших JS файлах