Yandex Cloud
Поиск
Связаться с намиПодключиться
  • Документация
  • Блог
  • Все сервисы
  • Статус работы сервисов
    • Популярные
    • Инфраструктура и сеть
    • Платформа данных
    • Контейнеры
    • Инструменты разработчика
    • Бессерверные вычисления
    • Безопасность
    • Мониторинг и управление ресурсами
    • Машинное обучение
    • Бизнес-инструменты
  • Все решения
    • По отраслям
    • По типу задач
    • Экономика платформы
    • Безопасность
    • Техническая поддержка
    • Каталог партнёров
    • Обучение и сертификация
    • Облако для стартапов
    • Облако для крупного бизнеса
    • Центр технологий для общества
    • Облако для интеграторов
    • Поддержка IT-бизнеса
    • Облако для фрилансеров
    • Обучение и сертификация
    • Блог
    • Документация
    • Контент-программа
    • Мероприятия и вебинары
    • Контакты, чаты и сообщества
    • Идеи
    • Истории успеха
    • Тарифы Yandex Cloud
    • Промоакции и free tier
    • Правила тарификации
  • Документация
  • Блог
Проект Яндекса
© 2025 ООО «Яндекс.Облако»
Практические руководства
    • Все руководства
    • Разграничение прав доступа для групп пользователей
    • Создание L7-балансировщика с профилем безопасности Smart Web Security через Ingress-контроллер Application Load Balancer
    • Централизованная публикация в интернете и защита приложений от DDoS
    • Передача логов с виртуальной машины в Cloud Logging
    • Запись логов балансировщика в PostgreSQL
    • Безопасное хранение паролей для GitLab CI в виде секретов Yandex Lockbox
    • Сервисный аккаунт с профилем OS Login для управления ВМ с помощью Ansible
    • Передача логов с Container Optimized Image в Cloud Logging
    • Добавление HTML-страницы для работы SmartCaptcha
    • Создание L7-балансировщика с профилем безопасности
    • Настройка алертов в Monitoring
    • Загрузка аудитных логов в MaxPatrol SIEM
    • Загрузка аудитных логов в SIEM Splunk
    • Загрузка аудитных логов в SIEM ArcSight
    • Шифрование для бакета Object Storage на стороне сервера
    • Шифрование секретов в HashiCorp Terraform
    • Управление ключами KMS с HashiCorp Terraform
    • Auto Unseal в HashiCorp Vault
    • Передача логов кластера Managed Service for Greenplum® в Yandex Cloud Logging
  1. Безопасность
  2. Добавление HTML-страницы для работы SmartCaptcha

Добавление HTML-страницы для работы Yandex SmartCaptcha

Статья создана
Yandex Cloud
Обновлена 27 декабря 2024 г.

Вы можете встраивать SmartCaptcha в приложения Android или iOS через WebView — компонент, позволяющий отображать веб-страницы внутри приложения (мини-браузер).

Для этого разместите HTML-страницу с кодом капчи на вашем сервере и затем встройте ссылку на нее в приложении.

HTML-страница с кодом капчи
<!DOCTYPE html>
<html>
  <head>
    <title>SmartCaptcha Mobile</title>
    <meta charset="UTF-8" />
    <meta
      name="viewport"
      content="width=device-width, initial-scale=1, shrink-to-fit=no"
    />
    <script>
      function onSmartCaptchaReady() {
        if (!window.smartCaptcha) {
          throw new Error("SmartCaptcha is not present");
        }

        const params = getParameters();

        const widgetId = window.smartCaptcha.render(
          "captcha-container",
          params
        );

        window.smartCaptcha.subscribe(
          widgetId,
          "challenge-visible",
          handleChallengeVisible
        );

        window.smartCaptcha.subscribe(
          widgetId,
          "challenge-hidden",
          handleChallengeHidden
        );

        window.smartCaptcha.subscribe(widgetId, "success", handleSuccess);

        if (params.invisible) {
          window.smartCaptcha.execute(widgetId);
        }
      }

      function handleSuccess(token) {
        if (window.NativeClient) {
          window.NativeClient.onGetToken(token);
        } else {
          sendIos("captchaDidFinish", token);
        }
      }

      function handleChallengeVisible() {
        if (window.NativeClient) {
          window.NativeClient.onChallengeVisible();
        } else {
          sendIos("challengeDidAppear");
        }
      }

      function handleChallengeHidden() {
        if (window.NativeClient) {
          window.NativeClient.onChallengeHidden();
        } else {
          sendIos("challengeDidDisappear");
        }
      }

      function sendIos(...args) {
        if (args.length == 0) {
          return;
        }

        const message = {
          method: args[0],
          data: args[1] !== undefined ? args[1] : ""
        };

        if (window.webkit) {
          window.webkit.messageHandlers.NativeClient.postMessage(message);
        }
      }

      function getParameters() {
        const result = {};

        if (!window.location.search) {
          return result;
        }

        const queryParams = new URLSearchParams(window.location.search);

        queryParams.forEach((value, key) => {
          result[key] = value;
        });

        result.test = result.test === "true";
        result.invisible = result.invisible === "true";
        result.hideShield = result.hideShield === "true";
        result.webview = true;

        return result;
      }
    </script>

    <script
      src="https://smartcaptcha.yandexcloud.net/captcha.js?render=onload&onload=onSmartCaptchaReady"
      defer
    ></script>
  </head>

  <body>
    <noscript>
      You need to enable JavaScript to run this app.
    </noscript>
    <div id="captcha-container" class="smart-captcha" />
  </body>
</html>

Также вы можете добавить в приложение ссылку на HTML-страницу, размещенную на сервере Yandex Cloud.

https://smartcaptcha.yandexcloud.net/webview

После этого вы сможете встраивать SmartCaptcha в свои мобильные приложения:

  • SmartCaptcha в приложении на Android.
  • Невидимая SmartCaptcha в приложении на Android.
  • SmartCaptcha в приложении Android на Flutter.
  • SmartCaptcha в приложении на iOS.

Была ли статья полезна?

Предыдущая
Настройка работы с Query
Следующая
Создание L7-балансировщика с профилем безопасности
Проект Яндекса
© 2025 ООО «Яндекс.Облако»