company_banner

Авторизация пользователей через Mail.Ru API: большой эффект маленькой кнопки

    Привет, с вами снова команда Платформы@Mail.Ru!

    В предыдущем посте мы рассказывали о различных социальных плагинах Моего Мира, а также сравнивали их эффективность на примере собственных проектов портала.

    Настало время поговорить о других возможностях Mail.Ru API, возможностях более тесной интеграции сайтов с социальной сетью. И, конечно же, дело снова не обойдется без кейсов – уже кейсов независимых проектов с реальными показателями эффективности.

    Поехали!


    Регистрация пользователей Mail.Ru в два клика



    Если вам нужно авторизовать или зарегистрировать посетителя на вашем сайте и у него есть аккаунт на Mail.Ru (а таковых в Рунете абсолютное большинство), вы можете сильно облегчить жизнь как себе, так и ему. Достаточно внедрить возможность регистрации и авторизации пользователей через Mail.Ru API.

    Вместо того, чтобы предлагать пользователю в 125-й раз заполнять длинную форму регистрации на вашем ресурсе, предложите ему авторизоваться «в 2 клика» с помощью API. Это радикально снизит «порог входа» на ваш ресурс, а также повысит лояльность уже существующей аудитории. Как только пользователь дал согласие на авторизацию, вы получаете доступ к его персональной информации из профиля на Mail.Ru: email, имя, фамилия, фото, пол, возраст, город и так далее.

    Используйте эту информацию для фоновой автоматической регистрации пользователя. Также у вас появляется возможность предлагать пользователю персонализированный контент и сервисы, например, переключить на версию сайта для определенного города или показывать только мужской или женский контент.

    Вот как это все реализовано на сайте одного из наших многочисленных партнеров – darberry.ru:



    После клика на кнопку «Войти» пользователь видит окно, на котором ему предлагается установить связь с сайтом, предоставив доступ к своему профилю:



    Если пользователь нажимает кнопку «Установить связь», то вам через javascript API возвращается полная информация о нем, и вы можете произвести автоматическую регистрацию пользователя.

    Кстати, вы можете спросить человека, не был ли он уже ранее зарегистрирован на вашем сайте, и «связать» его профили в один. Вот как это выглядит на проекте Bigbuzzy. Также это отличный пример автоматического заполнения полей в профиле на основе информации из аккаунта человека на Mail.Ru:



    Кстати, возможность быстрой авторизации пользователей Mail.Ru на вашем сайте можно использовать не только в форме регистрации/авторизации, но и, например, в форме комментирования новостей или статей на ресурсе.

    Техническая сторона интеграции


    Подключить авторизацию через Mail.Ru API на свой сайт достаточно просто. Для этого нужно зарегистрировать ваш сайт и написать несколько строк javascript кода.

    Ниже приведен пример странички с минимальной интеграцией:

    <html>
    <head>
     // этот небольшой скрипт создает минимальное окружение для библиотеки,
     // но не загружает ее саму
     <script type="text/javascript" src="http://cdn.connect.mail.ru/js/loader.js">
     </script>
    </head>
    <body>
     <script type="text/javascript">
      //<![CDATA[
      // этот вызов обязателен, он осуществляет непосредственную загрузку
      // кода библиотеки; рекомендуем всю работу с API вести внутри callback'а
      mailru.loader.require('api', function() {
       // инициализируем внутренние переменные
       // не забудьте поменять на ваши значения app_id и private_key
       mailru.connect.init(__app_id__, __private_key__);
       // регистрируем обработчики событий,
       // которые будут вызываться при логине и логауте
       mailru.events.listen(mailru.connect.events.login, function(session){
       window.location.reload();
       });
       mailru.events.listen(mailru.connect.events.logout, function(){
       window.location.reload();
       });
       // проверка статуса логина, в result callback'a приходит
       // вся информация о сессии (см. следующий раздел)
       mailru.connect.getLoginStatus(function(result) {
       if (result.is_app_user != 1) {
        // пользователь не залогинен, надо показать ему кнопку логина

        // вешаем кнопку логина (пример для jquery)
        $('<a class="mrc__connectButton">вход@mail.ru</a>').appendTo('body');
        // эта функция превращает только что вставленный элемент в
        // стандартную кнопку Mail.Ru
        mailru.connect.initButton();
       } else {
        // все ок, можно работать

        // получаем полную информацию о текущем пользователе
        mailru.common.users.getInfo(function(result){console.log(result[0].uid)});
       }
       });
      });
      //]]>
     </script>
    </body>
    </html>



    Более подробную информацию о том, как подключить авторизацию и другие возможности API вы найдете на страницах официальной документации.

    Какой эффект можно получить


    Наконец, цифры – например, по Darberry. Все цифры были получены еще летом, до масштабной рекламной компании на Mail.Ru.

    • 62% пользователей Darberry зарегистрированы с ящиков Mail.Ru.
    • Внедрение специального механизма авторизации для пользователей Mail.Ru увеличил конверсию формы регистрации в два раза. Если раньше регистрировался каждый 10-й пришедший новый пользователь, то после интеграции — каждый 5-й.


    Еще пример – altergeo.ru, сложный технологичный стартап с преимущественно «гиковской» аудиторией. Их опыт интеграции Mail.Ru API:
    • До интеграции входа «в два клика» 24% пользователей были зарегистрированы c ящиков Mail.Ru.
    • После интеграции процент пользователей с ящиками Mail.Ru оказался равным 42%, при этом у них уже стояли кнопки от всех социальных сетей.
    • 57% пользователей Mail.Ru зарегистрировались и входят именно через кнопку «Войти с Mail.Ru»


    Еще интересные и убедительные факты:
    • Mail.Ru — это почта, которой пользуются каждые 6 из 10 пользователей Рунета
    • Mail.Ru – это социальная сеть Мой Мир, у которой в месяц аудитория 18.5 миллионов пользователей (за сентябрь, только по России, TNS)
    • В среднем по Рунета — 50% пользователей регистрируются через ящики Mail.Ru


    Так что интеграция авторизации через Mail.Ru API может стать существенным улучшением для вашего проекта.

    Понятно, что удобной авторизацией возможности Mail.Ru API отнюдь не исчерпываются. В следующем посте мы расскажем еще больше!

    C уважением,
    Команда проекта Платформа@Mail.Ru

    P.S. На все ваши вопросы по глубокой интеграции, как всегда, готов ответить Антон Мельников, менеджер по продвижению Платформы@Mail.Ru. Если вы еще не добавили его в контакты — добавляйте: a.melnikov@corp.mail.ru
    Конечно, он опять читает комментарии и сразу отвечает.
    Хорошего дня!
    Mail.Ru Group 806,67
    Строим Интернет
    Поделиться публикацией
    Похожие публикации
    Комментарии 58
    • +4
      Ура! Mail.ru вышел из анабиоза!
      • 0
        Интеграцией активно пользуются давно.
        Можете посмотреть примеры tvigle.ru, kinopoisk.ru, baby.ru и classnet.ru.
        А также стартапы: darberry.ru, altergeo.ru, iii.ru, firmbook.ru, dressed.ru, bigbuzzy.ru, pokupon.by, kupibonus.ru, kvartirakrasivo.ru и chatovod.ru.

        Кстати, только тут я написал 5 штук сервисов «Groupon» с авторизацией пользователей через Mail.Ru API (если считать у Альтергео внутренний).
      • –1
        Второй скрин… я не Антон но Мельников), Антон это мой Брат)
      • +6
        А почему Вы предпочли не использовать OAuth или OpenID?
        • –1
          OpenID не дает таких возможностей, да и сложнее для конечного пользователя. По статистике, если на сайте стоит OpenID, то им все равно пользуются не больше 5% пользователей. Интеграция API дает намного больше возможностей и пользуются кнопкой чаще. Она понятнее для пользователя.
          • +6
            > По статистике, если на сайте стоит OpenID, то им все равно пользуются не больше 5% пользователей.

            Пруф или не было.
            • +2
              или это по статистике использования именно вашего openId? ну так ЦА-то у вас, прямо скажем…
              • 0
                Нет, это статистика крупного внешнего проекта. Я попрошу дать комментарий по статистике входа через OpenID и API или напишу сам, как получу разрешение.
                • +2
                  Внешнего провайдера OpenId? Или статистика «если на сайте стоит OpenID, то им все равно пользуются не больше 5% пользователей» основана на результатах использования на только одном сайте?
                  • 0
                    Слив засчитан. Да, я поторопился написать.
                    Это статистика проектов, где стоит сразу интеграция API и OpenID. Она показывает, что кнопкой пользуются чаще чем OpenID. И это не статистика по всем проектам. Комментарий правильный.
                    • +2
                      Чем OpenId2 отличается от «кнопки»?

                      гугл вроде как через опенАйди авторизует и все хорошо…
            • +1
              А что относительно OAuth? В Twitter и Facebook он прекрасно сосуществует с богатым API и аналогичной кнопкой для логина.
              • 0
                каких именно возможностей не даёт OpenID?
                • +4
                  не даёт возможности привязать к собственному протоколу. это не шутка совсем.
                  • 0
                    о каком собственном протоколе идёт речь?
                • 0
                  Обычно просит пользователя ввести логин. Мне в этом плане больше нравится вариант гугла, где для входа по опенайде логин не нужен.
              • +4
                На самом деле, там практически user-agent flow из oAuth 2.0. Разница в названиях параметров и некоторых деталях. Когда начинали делать, спецификации еще не было.

                В скором будущем приведем к стандарту, благо, js либа это абстрагирует.
                • +3
                  Надеюсь что это будущее действительно скоро наступит)

                  А то как-то так нехорошо получается, что если надо сделать вход через сервисы, то имеется один код, который обрабатывает практически все зарубежные и по отдельной js-библиотеке на каждый российский (кроме Яндекса, за что ему честь и хвала).
              • –5
                блять! вы ещё живы? Почему такой просчет?
                А использовать стандарты а-ля OAuth это не круто, велосипед это гораздо приятнее и после этого кажется что действительно что-то крутое получилось.
                • +1
                  Ну стоит посмотреть на хотя бы то, как они сделали свои API :)
                  • +1
                    ну как бы я сильно не вижу принципиальной разницы с OAuth.
                    И простите все что высказал свое мнение по поводу мэйла, но это единственная компания, у которой нет НИ ОДНОГО приличного сервиса.
                    Но все таки почему-то люди пользуются и не догадываются о том что есть приличные варианты исполнения сервисов. И что подобная авторизация есть уже у всех кому не лень уже пару лет…
                    • +2
                      я имел в виду API не «аутентификационный», а «функциональный», который дёргают после аутентификации.
                • +4
                  > Mail.Ru — это почта, которой пользуются каждые 6 из 10 пользователей Рунета
                  Да, к сожалению.
                  • –5
                    > у него есть аккаунт на Mail.Ru (а таковых в Рунете абсолютное большинство)
                    а вот это далеко не фаааааааакт…
                    • +1
                      Чо-то мне кажеца, штука под названием __private_key__ не должна светиться в исходнике-то? Или это просто ради красоты так назвали, чтобы как у всех было по-взрослому?
                      • 0
                        Это историческое название. Поменять пока не можем из-за обратной совместимости :(
                        • 0
                          Чтобы как у всех по-взрослому.
                          Штука, которую не нужно светить, называется secret_key.
                        • +2
                          по моему очень даже полезно, надо же с чего то начинать!
                          • 0
                            Спасибо. Присоединяйтесь!
                            Kinopoisk.ru, iii.ru, firmbook.ru и другие уже сделали. Если будут вопросы по интеграции — пишите.
                            • 0
                              Кстати, придумывать, как использовать новые открывшиеся возможности, особенно удается стартапам. Не удивительно, что и активность использования всех возможностей API среди стартапов значительно выше — они не упускают ни одной возможности получить преимущества от чего-либо нового.
                              • 0
                                >они не упускают ни одной возможности получить преимущества от чего-либо нового.

                                или могут себе позволить ввести что-то новое, не рискуя получить море вайна от «старых» пользователей: «Верните как было!!!», ввиду отсутствия этих «старых» пользователей :)
                          • +1
                            Когда будет возможным авторизоваться без javascript?
                            Например c телефона (как это сделано в facebook/oAuth)
                          • +3
                            ну да, кнопка от фэйсбука, вконтакте, твиттера, мэил.ру и сайт становится похож на новогоднюю ёлку…

                            мне кажется, было бы лучше иметь обычную регистрацию и потом уже из профиля иметь возможность подключить соцсети чтобы перекинуть на сайт какие-то альбомы или статьи и прочую информацию…

                            два поля: логин, пароль и кнопка войти/зарегистрироваться

                            если такого логина не существует — то он регистрирует и делает автоматический вход, если существует то проверяет пароль и или входит или выдаёт ошибку «неверный пароль для такого-то логина, сделающая попытка возможна через 15 секунд».

                            если человек успешно вошёл первый раз — попадает на страницу профиля, где может указать почтовый ящик (он проверяется как обычно, отправляется письмо со ссылкой, если проверился ок, то проверяется граватар) или подключиться к какой-либо соцсети, нажав на их иконки, импортировав оттуда какие-то свои фотки или данные…

                            P.S.
                            mail.ru следовало бы делать единые решения кнопок входа (вместе с open id/twitter/facebook/vkontakte в одном флаконе), иначе стимула их ставить совсем нет (mail.ru занимает достойное 5-е место, обогнав разве что одноклассников)

                            посмотрите как дискас делают… чтобы зайти написать коммент через эту систему я могу и через твиттер зайти, и через фэйсбук, и через их собственную системку…
                            • +1
                              так в том то и дело, что гораздо удобнее использовать учетку из соц. сетей или от мыла для авторизации везде, а не регестрироваться, вводить капчу, подтверждать мыло и т.д.
                              • +1
                                Для «единого входа» существует Loginza, но она не дает использовать все возможности. Например, посылать персональные уведомления пользователям в Мой Мир или поставить виджет (HTML блок) вашему пользователю прямо на страницу профиля.

                                Если у вас будет возможность «быстрой регистрации» путем ввода логина и пароля, не создаст ли это кучу клонов? Зачем тогда регистрация в принципе (на сайтах многих СМИ поступают именно так, не регистрируют, но дают возможность вписать свои данные).
                                • 0
                                  как вариант:

                                  а что если сделать типа такой же системы, только добавить дополнительные возможности в зависимости от того, через какую систему зашли… то есть мне кажется должно быть какое-то единое решение, к которому могут подключаться другие платформы (фэйсбук, твиттер, вконтакте, мэил, много чего ещё...), чтобы разработчик сайта мог сам выбирать какие системы показываются и в каком порядке и мог добавить на равных свои проекты туда (при этом сделать их доступными только для себя или для всех)…

                                  то есть такой большой-большой каталог различных сайтов, с помощью которых можно осуществить вход… сортировка по популярности… есть функция поиска, я как обычный вебмастер могу зайти и выбрать те системы, которые мне нужны… допустим, я не люблю одноклассники, я их отмечать не буду, мэил ру, фэйсбук, твиттер и яндекс возьму и ещё возьму свой механизм проверки по базе пользователей с другого моего сайта (в целях его дополнительной рекламы таким образом, то есть каким-то образом сделаю там open id и закачаю логотип этого сайта в эту систему чтобы он был на равных с тем же яндексом open id)

                                  если это какая-то известная система типа того же мэил ру или вконтакте — то можно реализовать какие-то дополнительные фишки, которые поддерживает только этот популярный сервис…

                                  вообщем, получается вот такой монстр, который всё умеет…

                                  ===

                                  > Если у вас будет возможность «быстрой регистрации» путем ввода логина и пароля, не создаст ли это кучу клонов? Зачем тогда регистрация в принципе (на сайтах многих СМИ поступают именно так, не регистрируют, но дают возможность вписать свои данные).

                                  Если человек хочет иметь несколько аккаунтов — пусть регистрирует сколько ему надо… Разве это плохо? :-)
                                • 0
                                  Собственно, как раз OpenId и можно было бы дополнительно применить в самих социальных сетях. Что, например, есть у Яндекса.
                                • 0
                                  Хоть документация стала лучше, а то была вики, в которой черт ногу сломит
                                  • 0
                                    Спасибо. Будем улучшать. Если есть комментарии — тоже присылайте.

                                    А также информация для авторов — если вы разрабатываете проект, и используете интеграцию API, вы можете сделать скринкаст или текстовый туториал. Если у вас хорошо получится — мы можем разместить это в примерах на сайте Mail.Ru API. А может быть придумаем как вас еще поощрить, если вы разработаете модуль для CMS или библиотеку для различных платформ.
                                  • 0
                                    А плагин для Вордпресса слабо? Прикрутил бы на 8 сайтах сразу.
                                    • 0
                                      Я думаю плагин скоро будет. Если тут присутствуют разработчики под Wordpress — смотрите комментарий выше.
                                    • +1
                                      Скачал и залил receiver.html
                                      Мне пишут (орфография сохранена):
                                      Ваш сайт не будет работать в полном режиме для все пользователей, пока вы не завершите его настройку

                                      Что я делаю не так?
                                      • –2
                                        На данный момент появилась техническая проблема, она будет решена в течение суток.
                                    • 0
                                      Чёрт, ещё одну кнопку на сайт прикручивать надо… Вот вроде читаешь описания — действительно удобно для всех, но где-то на 5-м сервисе начинаешь задумываться, что код аутентификации, импорта/экспорта и т. п. превышает собственно код сайта. По функциональности сервисы тоже не равнозначны и приходится выбирать либо пользоваться «наибольшим общим знаменателем», либо как-то ограничивать часть своих пользователей, либо ещё что-то. Уже видится страница/вкладка профиля «интеграция с другими сервисами», где пользователь вводит другие свои «идентификаторы» и получает возможность взаимодействовать с ними. Но как подумаешь о юзабилити, а также разрешении потенциальных конфликтов и дублей (причём далеко не всегда бинарных)…
                                      • +1
                                        какая замечательная метода для сбора паролей с майл.ру ^^
                                        • +1
                                          Да уж…
                                          Понавтыкают на порносайтах муляжей кнопки с попапом на левом домене «connect.mail.pussicat.ru» и поди разбери на каком адресе логинишься:
                                          habrastorage.org/storage/7aedc366/df9f36c9/5a02708d/bc181a42.png

                                          А все потому, что в оперном попапе адреса не видно — только на узкой полоске домен указан. Большинство людей даже не поймет что эта надпись означает :(

                                          Так что этот попап надо переделать: большими буквами написать что и где нужно проверить, чтобы безопасно залогиниться…
                                        • 0
                                          Вот допустим у меня при получении информации о пользователе выдает ошибку: «Incorrect signature»,«error_code»:104. К кому мне обратится за помощью, форум у вас есть?

                                        Только полноправные пользователи могут оставлять комментарии. Войдите, пожалуйста.

                                        Самое читаемое