Сохранение данных для клиентских скриптов

---
title: Сохранение данных для клиентских скриптов
tags:
date: "2025.07.27 15:19"
id: 3bdc2ee41c89ce343733367f6895abb5
excerpt: |-
При помощи Java Script API данные можно пробросить в клиентский скрипт. Они будут сохранены, а после
могут быть асинхронно загружены по запросу. При этом табличные данные будут
сохранены в компактном формате.
---



Данные, добавляемые на сайт или полученные в результате обработкт шаблонов, можно сохранить для использования
в Java Script на сайте. И это удобнее, чем сохранять их отдельно, потому что:

- Табличные данные сохраняются в компактном формате.
- Данных загружаются только по необходимости.
- Загрузка происходит асинхронно.

## Два типа данных

С точки зрения API существуют два типа данных — _глобальные_ и _локальные._
Они сохранаяются по-разному.

Глобальные данные сгенерированы из файлов в
директории `data`. У них есть однозначное имя, эти данные
доступны при генерации любой страницы.

Локальные данные — это данные, которые создаются в процессе генерации. Они, как правило,
связаны с определенной страницей и могут не иметь имени.

## Как это делается

### Проброс глобальных данных

Для пробороса глобальных данных в JS используется действие save2js в [файле конфигурации данных]( /+doc:data_config_ru).

```yaml
- task: save2js
dataset: your.dataset.name
```

В клиентском скрипте нужно будет обратиться к функции API `getData()`:

```javascript
window.Mukha.getData("your.dataset.name")
.then(d=>...ваш код... )
.catch(e=>console.error(e))
```
### Проброс локальных данных

Для проброса локальных данных служит функция шаблона, ее можно вызвать как в шаблонах, так и в контенте.
В примере мы сохраняем поле `local_data`, в котором хранятся данные страниц, сгенерированных из датасетов.
В отличие от глобальных данных, нам нужно задать произвольное имя, под которым данные сохранятся.

{% raw %}
```jinja
{{ saveData("myData" , page.local_data) }}
```
{% endraw %}

В клиентском скрипте:

```javascript
window.Mykha.getLocalData("myData")
.then(d=>...ваш код...)
.catch(e=>console.error(e))
```
Функция `getLocalData()` вернет Promise с данными, которые были сохранены для текущей страницы. В функцию можно
вторым параметром передать адрес страницы, тогда мы получим данные, сохраненные с указанным именем,
на указанной странице (если они там есть).