Это последняя статья из серии статей, посвященных тематическому моделированию документов на телугу. Здесь мы, наконец, создаем веб-страницу, которая применяет сгенерированную модель темы к любому тексту на телугу и отображает темы, связанные с этим текстом.
Серия статей
Статьи в серии
- Сканировать и собирать данные
- Построить модель LDA для документов на телугу
- Настройка LDA (Gensim) на AWS Lambda
- Собираем все вместе — создаем веб-сайт (текущая статья)
Цель
Цель этой статьи — объяснить некоторые детали, относящиеся к созданию простого веб-сайта, который применяет модель LDA к текстовому вводу, а затем возвращает темы, связанные с текстом.
Окончательный веб-сайт
https://nirupam-websites.s3.amazonaws.com/te_lda_home.html
Эта страница является адаптивной и хорошо работает на мобильных устройствах. Я планирую добавить дополнительные компоненты на веб-страницу и превратить ее в полноценный репозиторий экспериментальных инструментов/сервисов, связанных с обработкой языка телугу. Больше вещей находится в стадии разработки. Продолжайте проверять пространство.
Используемые компоненты
Моими главными критериями были минимальные затраты и нулевое обслуживание. Поэтому для своего развертывания я использовал следующие компоненты AWS:
- Lambda для размещения серверных служб
- Шлюз API для размещения API (который, в свою очередь, вызывает Lambda)
- S3 для размещения веб-страницы
Кроме этого, я использовал несколько других библиотек для выполнения работы.
- API Google Transliteration для изменения текста с английского на телугу
- D3 для отображения распределения тем
- JQuery (при необходимости)
Как…
Давайте погрузимся в более мелкие детали (только важные вещи)
АВС Лямбда
Подробности в этой статье. В нем обсуждаются детали, относящиеся к развертыванию LDA (или любых служб машинного обучения) поверх Lambda.
Шлюз API AWS
- Создайте REST-API. Выберите региональный тип окончания
- Создайте ресурс и назовите его test-lda или как вам больше нравится. Включить шлюз API CORS
- Создайте метод. Выберите «Любой» (если вы хотите открыть его только для POST/GET, вы можете указать конкретный вариант). Но здесь я выбрал Any
- Для ANY-Setup выберите следующее: убедитесь, что вы выбрали лямбда-функцию для типа интеграции, используйте лямбда-прокси-интеграцию, а затем выберите лямбда-регион и лямбда-функцию, развернутую в этом регионе, и используйте время по умолчанию. вне
- Нажмите ЛЮБОЙ, а затем нажмите Тест. Там вы можете указать строку запроса и проверить, получите ли вы желаемый ответ. Для получения более подробной информации вы можете проверить мой код ниже
S3 для размещения веб-страницы
На этом этапе особых сложностей не возникает. Просто убедитесь, что следующие шаги:
- Убедитесь, что разрешения правильно предоставлены для корзины и отдельных файлов в корзине (предоставить всем доступ только для чтения)
- Убедитесь, что ссылки на сценарии (в html) не являются относительными и указывают абсолютный путь к вашим сценариям.
- Чтобы Google транслитерировал API для работы, добавьте следующую строку в конец текстового BLOB-объекта. Для получения более подробной информации о том, почему, вы можете обратиться к этому обсуждению: google-transliterate-not-served-over-https.
control.c.qc.t13n.c[3].c.d.keyup[0].ia.F.p = 'https://www.google.com';
Исходный скрипт, кажется, вызывает API через http://, и эта добавленная строка направляет его на https://
Другие детали
Некоторые мелкие детали заключаются в следующем. Чтобы CORS работал, вам нужно добавить следующее в ответ вашего сервера.
'statusCode': 200, 'headers': { "Access-Control-Allow-Origin" : "*", # Required for CORS support to work "Access-Control-Allow-Credentials" : True, # Required for cookies, authorization headers with HTTPS "Access-Control-Allow-Headers": "Origin, X-Requested-With, Content-Type, Accept", "access-control-allow-methods":"GET,PUT,POST,DELETE,OPTIONS" },
API транслитерации Google
Я использовал API транслитерации, предоставленный Google. Но этот скрипт отказывается работать в мобильном браузере Chrome. И скрипт тоже устарел (26 мая 2011). Я искал способы заставить его работать на мобильных устройствах, но не смог найти способ. Если вы найдете выход, пожалуйста, поделитесь им в комментариях ниже.
D3
И, наконец, для рендеринга графика я использовал D3. Для новичка D3 немного сложен. Но вы можете проверить мой код (te_graph.js), чтобы понять детали. В двух словах, это то, что мы делаем, чтобы отобразить график
- Установить размер холста
- Задайте ось Y и ее масштаб
- Отрисовка прямоугольника подходящего размера
- Используйте серию команд преобразования-перемещения, чтобы переместить прямоугольник в подходящее место на оси Y.
Другие
- Ajax для отображения тем
- Больше жонглирования Javascript
Код
Поделился здесь: