Как можно реализовать запись и чтение данных с использованием JavaScript?

Я разработал пользовательский JS скрипт для Tampermonkey, который позволяет просматривать свои комментарии к каждому заказу на сайте Авито. Однако для отображения комментариев мне необходимо вручную вставлять их в код скрипта. Насколько я понимаю, чтение и запись в файлы невозможно с использованием JavaScript. Я хотел бы заменить процесс добавления комментариев в код на возможность ввода комментариев через специальные поля на странице. Возможно ли реализовать это с помощью кукисов, чтобы с помощью JS записывать комментарии в куки и затем считывать их? Или есть другие подходящие решения?
  • 29 августа 2024 г. 12:34
Ответы на вопрос 2
Да, вы правы, что JavaScript, выполняемый в браузере, не может записывать и читать файлы на диске напрямую по причинам безопасности. Однако можно использовать более безопасные методы, такие как куки, `localStorage` или `sessionStorage`, чтобы хранить данные в браузере.

1. **Использование `localStorage`:**
   `localStorage` позволяет хранить данные в виде пар "ключ-значение". Эти данные сохраняются даже после закрытия вкладки или браузера, поэтому вы можете использовать его для хранения комментариев.

   Пример использования `localStorage`:

   ```javascript
   // Запись комментария
   function saveComment(orderId, comment) {
       // Получаем существующие комментарии из localStorage
       const comments = JSON.parse(localStorage.getItem('comments')) || {};
       // Сохраняем комментарий по его ID
       comments[orderId] = comment;
       // Записываем обратно в localStorage
       localStorage.setItem('comments', JSON.stringify(comments));
   }

   // Чтение комментариев
   function getComment(orderId) {
       const comments = JSON.parse(localStorage.getItem('comments')) || {};
       return comments[orderId] || '';
   }
   ```

   Использование:

   ```javascript
   // Сохраняем комментарий к заказу с ID 123
   saveComment('123', 'Мой комментарий к заказу 123');

   // Получаем комментарий к заказу с ID 123
   const comment = getComment('123');
   console.log(comment); // 'Мой комментарий к заказу 123'
   ```

2. **Использование куки:**
   Куки имеют свои ограничения по объему данных (обычно до 4 кб на куку) и сроку жизни, но тоже могут быть использованы.

   Пример работы с куками:

   ```javascript
   // Запись куки
   function setCookie(name, value, days) {
       const expires = new Date(Date.now() + days * 864e5).toUTCString();
       document.cookie = name + '=' + encodeURIComponent(value) + '; expires=' + expires + '; path=/';
   }

   // Чтение куки
   function getCookie(name) {
       return document.cookie.split('; ').reduce((r, current) => {
           const parts = current.split('=');
           return parts[0] === name ? decodeURIComponent(parts[1]) : r;
       }, '');
   }

   // Использование:
   setCookie('comment_123', 'Мой комментарий к заказу 123', 7); // хранить 7 дней
   const comment = getCookie('comment_123');
   console.log(comment); // 'Мой комментарий к заказу 123'
   ```

3. **Форма для ввода комментариев:**
   Вы можете создать HTML-форму на странице для ввода комментариев. После заполнения форма будет обрабатывать данные и сохранять их с помощью одного из вышеуказанных методов.

Пример HTML-формы:

```html
<input type="text" id="orderId" placeholder="ID заказа">
<textarea id="comment" placeholder="Ваш комментарий"></textarea>
<button id="saveComment">Сохранить комментарий</button>
```

Пример JavaScript-кода для обработки формы:

```javascript
document.getElementById('saveComment').addEventListener('click', function() {
    const orderId = document.getElementById('orderId').value;
    const comment = document.getElementById('comment').value;
    saveComment(orderId, comment); // Используем функцию saveComment из предыдущего примера
});
```

Таким образом, используя `localStorage` или куки, вы можете реализовать процесс записи и чтения комментариев для каждого заказа.
GM_setValue GM_getValue - будут храниться в сторе самого расширения. 

Всякие куки, localStorage, indexedDb - всё может почитститься самом сайтом или случайно тобой.

Надёжнее - только свой сервак завести и к нему запросами отправлять-получать.:)
Похожие вопросы