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

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

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

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

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

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

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

  1. Установите пользовательский интерфейс IPFS (opens in a new tab).

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

    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) (opens in a new tab). Выберите один из них. Какой бы сервис вы ни использовали, вам нужно создать аккаунт и предоставить ему идентификатор контента (CID) из вашего IPFS Desktop.

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

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

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

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

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

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

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

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

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

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

Недостатки

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

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

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

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

Заключение

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

Здесь вы можете ознакомиться с другими моими работами (opens in a new tab).