Использование ngrok
Использование ngrok
Ngrok — это простой в использовании инструмент, позволяющий создавать защищенный туннель на локальном устройстве вместе с общедоступным URL-адресом, который можно использовать для тестирования локального проекта или для предоставления доступа к вашей работе клиенту или участнику команды для рецензирования. Можно настроить HTTP или HTTPS, а благодаря популярности этого инструмента, если что-то пойдет не так, есть множество статей с описанием различных способов решения проблем. В этой статье рассматривается несколько простых способов установки ngrok, а также действия на случай, если ваше веб-приложение не может взаимодействовать с ngrok.
ngrok
Наши коллеги из ngrok написали отличную статью, посвященную поддержке веб-перехватчиков Frame.io через ngrok. Ознакомьтесь с ней здесь.
Установка ngrok
Можно использовать ngrok несколькими различными способами.
Установка через установщик ngrok
- Перейдите на веб-сайт ngrok и следуйте инструкциям: https://ngrok.com/download
- Если вам нужны функции, доступные при подключении учетной записи, следуйте этим инструкциям для получения учетной записи и токена.
Необязательно создавать учетную запись или добавлять токен, но обязательно ознакомьтесь со страницей загрузки, чтобы понять, нужно ли это вам.
Примечание.
При использовании этого метода ngrok запускается из места, где вы его сохранили, если только вы не сделаете его доступным для всей системы.
Установка с помощью Homebrew
Это мой любимый способ установки ngrok. Если у вас установлен Homebrew, все что нужно сделать — это ввести homebrew cask install ngrok. Сервис ngrok установлен, и вы можете использовать его где угодно!Лучше всего то, что не нужно вводить ./ngrok в терминале в начале каждой команды — можно просто вводить ngrok. Подробнее об этом можно прочитать здесь.
Использование ngrok
После настройки ngrok выберите порт, например 3000, и запустите его из командной строки терминала с помощью команды ngrok http 3000. Необязательно использовать порт 3000, но это порт, который обычно используют при настройке. Если вы настроили ngrok для запуска из определенной папки, то нужно находиться в папке, где размещен ngrok, и использовать команду ./ngrok http 3000.
Запустите сервер для вашего проекта, чтобы он слушал тот же порт, и вы сможете получить доступ к вашей работе, используя публичный адрес, предоставленный ngrok.
Устранение неполадок ngrok с вашим веб-приложением — косая черта в конце адреса
Проблема, с которой вы можете столкнуться при использовании ngrok, заключается в невозможности подключения к серверу при настройке URL-адреса ngrok для использования с вашим веб-приложением. Неудобство в том, что ngrok не зарегистрирует то, что вы что-либо отправили. Можно открыть localhost:4040, чтобы посмотреть, что происходит, и вы не увидите ничего. (localhost:4040 предоставляется ngrok, чтобы вы могли отслеживать любые входящие запросы к вашему серверу). Похоже, Ngrok сопоставляет адреса с /(.), а не с (/.)‚ поэтому если вы не укажите завершающую косую черту в конце вашего адреса и не увидите ничего в инструментах мониторинга ngrok, это потому, что ngrok не находит совпадения для указанного вами адреса.
Вот пример добавления завершающей косой черты: http://something.ngrok.io/ Вы также можете написать ваши примеры приложений для разрешения в конечную точку, которая включает косую черту. Просто помните, что для того, чтобы приложение Frame.io могло связаться с вашим сервером, если ваше тестовое приложение использует конечную точку /actions, вам нужно добавить конечную точку /actions в конец адреса ngrok. Например, если адрес ngrok — http://something.ngrok.io, вам нужно будет указать его в настройках пользовательского действия как http://something.ngrok.io/actions. Для других веб-приложений это может отличаться, поэтому попробуйте поэкспериментировать с окончанием адреса ngrok, если что-то не заработало сразу.
Могу ли я использовать что-то кроме ngrok? Попробуйте Glitch!
Glitch — это хорошая альтернатива ngrok и настраивается быстрее. Glitch позволяет создать учетную запись, а затем создавать собственные приложения, используя их серверы с публично доступным URL-адресом. Можно сотрудничать с другими, делать код общедоступным или частным и выбирать из широкого ассортимента языков и платформ. Перейдите по https://glitch.com/create, чтобы посмотреть, что доступно. Когда вы настраиваете проект на Glitch, для некоторых веб-приложений применяется проблема завершающей косой черты. В случае Frame.io, когда вы настраиваете пользовательское действие в developer.frame.io, вам нужно указать завершающую косую черту в конце URL-адреса, предоставленного Glitch. Не нужно добавлять что-либо еще, даже для конечной точки /actions.
Можно ли попробовать что-то настроенное прямо сейчас?
Да. Если вы не хотите использовать ngrok или создавать собственный проект Glitch, мы настроили для вас образец приложения. Его можно опробовать здесь: https://frameio-custom-action.glitch.me. Не забудьте указать завершающую косую черту, когда добавляете этот адрес в область пользовательских действий developer.frame.io.
Ресурсы
В этом разделе перечислены ресурсы, указанные в статье:
- ngrok https://ngrok.com/
- Glitch https://glitch.com/
- Доступные платформы в Glitch https://glitch.com/create
- Образец приложения Glitch для пользовательского действия в JavaScript https://frameio-custom-action.glitch.me
- Регистрация и настройка для разработчиков Frame.io Сайт для разработчиков Frame.io
- Веб-приложение Frame.io https://app.frame.io/