Pull to refresh

Авторизация через новый API сайта Вконтакте.ру

Reading time 3 min
Views 13K
Армия потенциальных пользователей Вашего сайта, зарегистрированных в социальной сети Вконтакте.ру наверняка оценят по достоинству Ваши старания по внедрению регистрации с помощью их любимой социалки. О создании такой возможности я задумался сегодня по утру и не откладывая решил воплотить желание в реальность.

Облегчало реализацию два факта: первый заключается в том, что Open API мне очень напоминал Facebook Connect, с которым я уже работал. Второй факт был ещё весомей — у меня уже есть библиотека в которой каждый вариант авторизации (OpenID, OAuth, FacebookConnect) являются отдельными бэкендами и написать дополнительный, тем более так похожий на FC не выглядело сложным заданием. В итоге, можно сказать что по факту это действительно оказалось плёвым делом.

Итак, что же нужно для авторизации по Вконтакте.ру?

1. Python 2.5+
2. Django r11807 (лучше всего скачайте из транка последнею версию)
3. django-annoying
4. django-publicauth

В принципе, описание инсталляции и настройки есть на вики страницах библиотеки django-publicauth, но я заострю внимание именно на Вконтакте.ру и опишу ещё раз инструкции, но уже на русском языке.

Начнём с того, что нужно создать своё приложение на сайте вконтакте.ру.
Небольшим разочарованием для меня было отсутствие возможности указать в настройках приложения адрес соединения в виде localhost:8000/. Пришлось указывать реальный домен на котором приложение будет крутиться и изменять /etc/hosts на домашнем компьютере, а так же запускать сайт на 80 порту. На фейсбуке такой проблемы нет.
Далее, нужно прописать сгенерированные ключи и пароли в файл settings.py, выглядит это примерно так:
  1. VKONTAKTE_APP_ID = XXXX
  2. VKONTAKTE_API_KEY = 'XXXX'
  3. VKONTAKTE_SECRET_KEY = 'XXXXXXXXX'


Теперь нужно вставить следующий кусок хтмла/яваскрипта в Ваш темплейт страницы логина:

Copy Source | Copy HTML
  1. <a onclick="return vk_login();" href="#">Вконтакте.ru</a><
  2.  
  3.  
  4. <script src="http://vkontakte.ru/js/api/openapi.js" type="text/javascript" charset="windows-1251"></script>
  5. <script type="text/javascript">
  6. VK.init({
  7.     apiId: xxxxx,
  8.     nameTransportPath: '{% url publicauth-vkontakte-xdreceiver %}'
  9. });
  10.  
  11. function vk_login() {
  12.     VK.Auth.login(testMe);
  13.     return false;
  14. }
  15.  
  16. function testMe(response) {
  17.     if (response.status == "connected") {
  18.         window.location = "{% url publicauth-complete 'vkontakte' %}"
  19.     }
  20. };
  21. </script>


Не забудьте заменить xxxxx на реальный ID приложения, причём это должен быть integer, так что не ставьте ковычки.

В принципе на этом можно и остановиться. По умолчанию, библиотека publicauth после первой попытки авторизации попросит заполнить ещё и дополнительное поле username, но если вам такое поле не к чему или вам нужны другие дополнительные поля, просто укажите в вашем settings.py настройку PUBLICAUTH_EXTRA_FORM со значением в виде пути до вашей формы. Единственное правило состоит в том что форма должна содержать метод save который принимает следующие параметры:
save(self, request, identity, provider): pass и возвращает созданного юзера.

Посмотреть сайт с рабочим примером вы можете на здесь.

UPDATE: по просьбам трудящихся, выставил готовый демо-проект со всеми возможными вариантами авторизации. http://pyplanet.org/static/example.tar.gz

Это обычный джанго сайт, распакуйте архив и установите все нужные библиотеки через pip, а ещё лучше через virtualenv + pip. Для этого я положил специальный скрипт внутрь проекта. Если у вас линукс, то просто сделайте ./buildenv.sh и всё установится само, после чего вам нужно будет только активировать виртуальное окружение (source venv/bin/acitvate) и сделать syncdb. Если вы не хотите использовать virtualenv, то можете в ручную сделать pip install -r pipreq.txt

Настройки у меня сделаны немного необычно, всё лежит в папке settings/ вам для указания базы (если вас не устраивает sqlite3) нужно править файл settings/local.py
Настройки django-publicauth лежат в settings/publicauth.py

Своя форма с дополнительными полями лежит корне проекта с именем custom_from.py.

Для того что бы у вас заработала авторизация по Вконтакте.ру, вы можете просто прописать у себя в /etc/hosts строчку
127.0.0.1 pyplanet.org
запустить сайт на 80 порту (python manage.py runserver 0.0.0.0:80) и зайти по этому адресу.
Ну или создать своё приложение на сайте вконтакте с каким то другим доменом и вставить свои ключи в файл настройки settings/publicauth.py
Такая же махинация нужна и для фейсбука.
Tags:
Hubs:
+32
Comments 62
Comments Comments 62

Articles