Найти в Дзене
Журнал «Код»

Подключаем к сайту орфокорректор. Орфонейрокорректор

Оглавление

Пиши­те как угод­но — ней­рон­ка нико­му не рас­ска­жет.

В ста­тье про ней­ро­се­ти мы гово­ри­ли, что они здо­ро­во справ­ля­ют­ся с машин­ным пере­во­дом и тек­ста­ми. Наста­ло вре­мя попро­бо­вать эти тех­но­ло­гии на прак­ти­ке — будем под­клю­чать модуль орфо­кор­рек­ции «Яндекс.Спеллер» к веб-странице. В резуль­та­те вве­ден­ный на стра­ни­це текст будет авто­ма­ти­че­ски про­ве­рять­ся орфо­кор­рек­то­ром.

Яндекс.Спеллер помогает находить и исправлять орфографические ошибки в русском, украинском или английском тексте. Чтобы обнаруживать ошибки и подбирать замены, Спеллер использует библиотеку машинного обучения CatBoost. Благодаря CatBoost он может расшифровывать искажённые до неузнаваемости слова («адникасниеи» → «одноклассники») и учитывать контекст при поиске опечаток («скучать музыку» → «скачать музыку»).

Основ­ные усло­вия, по кото­рым предо­став­ля­ет­ся «Спел­лер», такие:

  • про­ве­ря­ем не боль­ше 10 000 раз в сут­ки;
  • не боль­ше 10 мил­ли­о­нов сим­во­лов в сут­ки.

Это­го вполне хва­та­ет для наше­го част­но­го про­ек­та. Если вы захо­ти­те исполь­зо­вать «Спел­лер» в про­фес­си­о­наль­ных целях, почи­тай­те пол­ные усло­вия.

Вот что мы сде­ла­ем:

  • Возь­мём шаб­лон пустой стра­ни­цы.
  • Поме­стим на неё заго­ло­вок, пояс­ни­тель­ный текст и поле вво­да.
  • Напи­шем скрипт, кото­рый после каж­до­го вве­дён­но­го сло­ва про­ве­ря­ет наш текст и авто­ма­ти­че­ски исправ­ля­ет ошиб­ки.

Оформляем страницу

Возь­мём наш стан­дарт­ный шаб­лон:

Доба­вим на стра­ни­цу заго­ло­вок, текст и поле вво­да:

<!-- заголовок на странице -->
<h1>Орфокорректор</h1>

<!-- пояснительный текст -->
<p>Напишите что угодно с ошибками. Страница сама всё исправит.</p>

<!-- поле ввода текста -->
<textarea id="text_field" class="text"></textarea>

-2

Вот что у нас полу­чи­лось. Выгля­дит неопрят­но, давай­те доба­вим сти­лей.

-3

Пишем скрипт проверки орфографии

Что­бы мож­но было обра­щать­ся к эле­мен­ту на стра­ни­це по име­ни, под­клю­чим jQuery. Если вы не зна­е­те, зачем это нуж­но и как рабо­та­ет, — про­чи­тай­те нашу ста­тью.

<script type="text/javascript" src="http://yastatic.net/jquery/2.1.3/jquery.min.js"></script>

Зада­ча скрип­та — ждать нажа­тия про­бе­ла или энте­ра, после чего отпра­вить текст на про­вер­ку и полу­чить назад гото­вые сло­ва без оши­бок. Как толь­ко скрипт полу­ча­ет от сер­ве­ра Яндек­са ответ — скрипт меня­ет текст в окне вво­да на пра­виль­ный.

Код про­бе­ла — 32, код энте­ра — 13. Полу­ча­ет­ся, что нам нуж­но отсле­жи­вать нажа­тие каж­дой кла­ви­ши и смот­реть, что имен­но нажа­лось. Если выпа­ли нуж­ные нам коды — запус­ка­ем скрипт про­вер­ки. Подроб­нее про отсле­жи­ва­ние нажа­тых кла­виш — в ста­тье про редак­тор с авто­со­хра­не­ни­ем.

Сохра­ня­ем скрипт отдель­ным фай­лом script.js в той же пап­ке, что и стра­ни­ца, и под­клю­ча­ем его в коде стра­ни­цы:

<script type="text/javascript" src="script.js"></script> 

Полный код страницы

Посмотрите на результат

Мож­но поиг­рать с нашей пуб­лич­ной вер­си­ей на сай­те mihailmaximov.ru. Она точ­но такая же, как мы опи­са­ли в ста­тье, и про­вер­ка идёт по каж­до­му нажа­тию энте­ра или про­бе­ла. Если не хоти­те пере­гру­жать сер­ве­ра Яндек­са — сде­лай­те про­вер­ку по кноп­ке. 

Что дальше

Мож­но при­кру­тить этот орфо­кор­рек­тор к наше­му тек­сто­во­му редак­то­ру, и тогда вы сра­зу буде­те печа­тать текст почти без оши­бок.

Если вы не укла­ды­ва­е­тесь в лими­ты по коли­че­ству или объ­ё­му про­ве­рок, мож­но убрать авто­про­вер­ку и доба­вить кноп­ку руч­ной про­вер­ки. Или сде­лать чек­бокс, кото­рый будет отве­чать за авто­кор­рек­цию.

А ещё мож­но доба­вить счёт­чик оши­бок — он пока­жет, насколь­ко акку­рат­но вы наби­ра­е­те текст.

Подписывайтесь на наш канал, чтобы все было красиво!