Перейти к основному контенту

IPFS для децентрализованных пользовательских интерфейсов

ipfs
dapps
фронтенд
Для начинающих
Ори Померанц
29 июня 2024 г.
4 минут на чтение

Вы написали невероятное новое децентрализованное приложение (dapp). Вы даже написали для него пользовательский интерфейс. Но теперь вы боитесь, что кто-то попытается подвергнуть его цензуре, отключив ваш пользовательский интерфейс, который находится всего лишь на одном сервере в облаке. В этом руководстве вы узнаете, как избежать цензуры, разместив свой пользовательский интерфейс в межпланетной файловой системе (IPFS) (открывается в новой вкладке), чтобы любой желающий мог закрепить его на сервере для будущего доступа.

Вы могли бы использовать сторонний сервис, такой как Fleek (открывается в новой вкладке), чтобы он сделал всю работу. Это руководство предназначено для тех, кто хочет сделать достаточно, чтобы понять, что именно они делают, даже если это потребует больше усилий.

Локальный запуск

Существует множество сторонних провайдеров IPFS (открывается в новой вкладке), но для тестирования лучше всего начать с локального запуска IPFS.

  1. Установите пользовательский интерфейс IPFS (открывается в новой вкладке).

  2. Создайте каталог с вашим веб-сайтом. Если вы используете Vite (открывается в новой вкладке), выполните эту команду:

    pnpm vite build

  3. В IPFS Desktop нажмите Import > Folder (Импорт > Папка) и выберите каталог, созданный на предыдущем шаге.

  4. Выберите только что загруженную папку и нажмите Rename (Переименовать). Дайте ей более осмысленное имя.

  5. Выберите ее снова и нажмите Share link (Поделиться ссылкой). Скопируйте URL-адрес в буфер обмена. Ссылка будет похожа на https://ipfs.io/ipfs/QmaCuQ7yN6iyBjLmLGe8YiFuCwnePoKfVu6ue8vLBsLJQJ.

  6. Нажмите Status (Статус). Разверните вкладку Advanced (Дополнительно), чтобы увидеть адрес шлюза. Например, в моей системе это адрес http://127.0.0.1:8080.

  7. Объедините путь из шага со ссылкой с адресом шлюза, чтобы получить ваш адрес. Например, для приведенного выше примера URL-адрес будет http://127.0.0.1:8080/ipfs/QmaCuQ7yN6iyBjLmLGe8YiFuCwnePoKfVu6ue8vLBsLJQJ. Откройте этот URL-адрес в браузере, чтобы увидеть свой сайт.

Загрузка

Итак, теперь вы можете использовать IPFS для локальной раздачи файлов, что не очень захватывающе. Следующий шаг — сделать их доступными для всего мира, когда вы находитесь в автономном режиме.

Существует ряд известных сервисов закрепления (pinning services) (открывается в новой вкладке). Выберите один из них. Какой бы сервис вы ни использовали, вам нужно создать аккаунт и предоставить ему идентификатор контента (CID) из вашего IPFS Desktop.

Лично мне показалось, что 4EVERLAND (открывается в новой вкладке) проще всего в использовании. Вот инструкции для него:

  1. Перейдите в панель управления (открывается в новой вкладке) и войдите с помощью своего кошелька.

  2. На левой боковой панели нажмите Storage > 4EVER Pin.

  3. Нажмите Upload > Selected CID. Дайте вашему контенту имя и укажите CID из IPFS Desktop. В настоящее время CID — это строка, которая начинается с Qm, за которой следуют 44 буквы и цифры, представляющие собой хеш в кодировке base-58 (открывается в новой вкладке), например QmaCuQ7yN6iyBjLmLGe8YiFuCwnePoKfVu6ue8vLBsLJQJ, но это, скорее всего, изменится (открывается в новой вкладке).

  4. Начальный статус — Queued (В очереди). Обновляйте страницу, пока он не изменится на Pinned (Закреплено).

  5. Нажмите на свой CID, чтобы получить ссылку. Вы можете посмотреть мое приложение здесь (открывается в новой вкладке).

  6. Возможно, вам потребуется активация аккаунта, чтобы закрепить его более чем на месяц. Активация аккаунта стоит около 1 доллара. Если вы закрыли окно, выйдите из системы и войдите снова, чтобы получить повторный запрос на активацию.

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

На данном этапе у вас есть ссылка на централизованный шлюз, который обслуживает ваш контент в IPFS. Короче говоря, ваш пользовательский интерфейс может быть немного безопаснее, но он все еще не цензуроустойчивый. Для реальной цензуроустойчивости пользователям необходимо использовать IPFS напрямую из браузера (открывается в новой вкладке).

Как только вы это установите (и запустите десктопный IPFS), вы сможете перейти по адресу /ipfs/<CID> (открывается в новой вкладке) на любом сайте и получите этот контент, предоставляемый децентрализованным образом.

Недостатки

Вы не можете надежно удалять файлы из IPFS, поэтому, пока вы вносите изменения в свой пользовательский интерфейс, вероятно, лучше либо оставить его централизованным, либо использовать межпланетную систему имен (IPNS) (открывается в новой вкладке) — систему, которая обеспечивает изменяемость поверх IPFS. Конечно, все, что можно изменить, может быть подвергнуто цензуре, в случае с IPNS — путем давления на человека, владеющего соответствующим приватным ключом.

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

Обнаруживаемость через ENS

Если вы привяжете имя ENS (например, vitalik.eth) к своему веб-сайту, он будет считаться полностью децентрализованной веб-страницей и будет автоматически закреплен сервисом dweb3.wtf (открывается в новой вкладке), а также станет доступен для поиска через поисковую систему web3compass.net (открывается в новой вкладке), подобно тому, как это делают DuckDuckGo, Brave Search или Google для традиционного интернета.

Заключение

Подобно тому, как Эфириум позволяет вам децентрализовать базу данных и бизнес-логику вашего dapp, IPFS позволяет децентрализовать пользовательский интерфейс. Это дает возможность перекрыть еще один вектор атаки на ваше приложение.

Здесь вы можете ознакомиться с другими моими работами (открывается в новой вкладке).