OAuth

Не так уж давно, каждый веб-сервис требовал отдельной регистрации, но все большая часть из них дает возможность пользователю использовать для авторизации свой аккаунт в соцсетях. Реализуется эта возможность благодаря протоколу OAuth. Это открытый протокол для авторизации, который позволяет пользователю предоставить доступ к своим данным, без риска засветить свой логин и пароль.

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

Быстрый старт

Для начала вам понадобится:

• страница редиректа и скрипт ее инициализации onload.js
• два скрипта с библиотеками
• chrome_ex_oauth.js
• chrome_ex_oauthsimple.js

Протокол OAuth включает в себя три шага:

• получение первоначального токена запроса
• авторизация пользователя и подтверждение им права доступа к запрошенным данным
• получение токена доступа

С расширением все немного сложнее. Тут нет URLа на который можно перенаправить пользователя после завершения авторизации и подтверждения доступа. Так что гугл, совместно с некоторыми другими компаниями немного доработал OAuth для использования с приложениями. Вместо URL ресурса используется имя приложения. Конечный результат тот же самый: фоновая страница запрашивает токен, открывает отдельную вкладку для авторизации и подтверждения доступа, и, наконец, выполняет асинхронный запрос для получения токена доступа.

var oauth = ChromeExOAuth.initBackgroundPage({
  'request_url': 'https://www.google.com/accounts/OAuthGetRequestToken',
  'authorize_url': 'https://www.google.com/accounts/OAuthAuthorizeToken',
  'access_url': 'https://www.google.com/accounts/OAuthGetAccessToken',
  'consumer_key': 'anonymous',
  'consumer_secret': 'anonymous',
  'scope': 'https://docs.google.com/feeds/',
  'app_name': 'My Extension name'
});

Вот примерно так выглядит инициализация библиотеки. Для работы с другими OAuth-сервисами, не гуглом, нужно смотреть их документацию для разработчиков. URL будут другие, общий принцип такой же.

В манифесте должны быть соответтсвующие разрешения:

"permissions": [ "tabs", "https://docs.google.com/feeds/*",
  "https://www.google.com/accounts/OAuthGetRequestToken",
  "https://www.google.com/accounts/OAuthAuthorizeToken",
  "https://www.google.com/accounts/OAuthGetAccessToken"
]

Начинаем процесс:

oauth.authorize(function() {
  // ... Ready to fetch private data ...
});

Будет открыта новая вкладка, пользователь там авторизуется, и разрешит доступ. Когда этот процесс завершится будет вызвана callback функция. Нам нет необходимости заботится о хранении токена и прочих нюансах – все это спрятано в библиотеке. Она хранит токен в localStorage и если мы повторно запросим авторизацию, но новая вкладка не откроется, а будет использован уже имеющийся токен. Callback функция будет вызвана в любом случае.

Возникают вопросы:

1. приложение может запрашивать разный объем прав доступа. Где и как это задается?


2. Как распознается ситуация, когда пользователь отказался предоставить доступ, или не смог авторизоваться (забыл пароль например)?


3. Что будет если сервис авторизации в данный момент недоступен?

После получения доступа мы получаем возможность отправлять подписанные запросы:

function callback(resp, xhr) {
  // ... Process text response ...
};

function onAuthorized() {
  var url = 'https://docs.google.com/feeds/default/private/full';
  var request = {
    'method': 'GET',
    'parameters': {'alt': 'json'}
  };

  // Send: GET https://docs.google.com/feeds/default/private/full?alt=json
  oauth.sendSignedRequest(url, callback, request);
};

oauth.authorize(onAuthorized);

Более сложный пример:

function onAuthorized() {
  var url = 'https://docs.google.com/feeds/default/private/full';
  var request = {
    'method': 'POST',
    'headers': {
      'GData-Version': '3.0',
      'Content-Type': 'application/atom+xml'
    },
    'parameters': {
      'alt': 'json'
    },
    'body': 'Data to send'
  };

  // Send: POST https://docs.google.com/feeds/default/private/full?alt=json
  oauth.sendSignedRequest(url, callback, request);
};

Существуют еще различные вариации и скользкие моменты, для их прояснения придется хорошо порыться в примерах, документации и исходниках чужих расширений