В настоящее время я экспериментирую с OAuth2, чтобы разработать мобильное приложение, полностью построенное на JavaScript, которое говорит с CakePHP API. Взгляните на следующий код, чтобы увидеть, как мое приложение выглядит в настоящее время (обратите внимание, что это эксперимент, следовательно, беспорядочный код и отсутствие структуры в областях и т.д.)
var access_token,
refresh_token;
var App = {
init: function() {
$(document).ready(function(){
Users.checkAuthenticated();
});
}(),
splash: function() {
var contentLogin = '<input id="Username" type="text"> <input id="Password" type="password"> <button id="login">Log in</button>';
$('#app').html(contentLogin);
},
home: function() {
var contentHome = '<h1>Welcome</h1> <a id="logout">Log out</a>';
$('#app').html(contentHome);
}
};
var Users = {
init: function(){
$(document).ready(function() {
$('#login').live('click', function(e){
e.preventDefault();
Users.login();
});
$('#logout').live('click', function(e){
e.preventDefault();
Users.logout();
});
});
}(),
checkAuthenticated: function() {
access_token = window.localStorage.getItem('access_token');
if( access_token == null ) {
App.splash();
}
else {
Users.checkTokenValid(access_token);
}
},
checkTokenValid: function(access_token){
$.ajax({
type: 'GET',
url: 'http://domain.com/api/oauth/userinfo',
data: {
access_token: access_token
},
dataType: 'jsonp',
success: function(data) {
console.log('success');
if( data.error ) {
refresh_token = window.localStorage.getItem('refresh_token');
if( refresh_token == null ) {
App.splash();
} else {
Users.refreshToken(refresh_token);
}
} else {
App.home();
}
},
error: function(a,b,c) {
console.log('error');
console.log(a,b,c);
refresh_token = window.localStorage.getItem('refresh_token');
if( refresh_token == null ) {
App.splash();
} else {
Users.refreshToken(refresh_token);
}
}
});
},
refreshToken: function(refreshToken){
$.ajax({
type: 'GET',
url: 'http://domain.com/api/oauth/token',
data: {
grant_type: 'refresh_token',
refresh_token: refreshToken,
client_id: 'NTEzN2FjNzZlYzU4ZGM2'
},
dataType: 'jsonp',
success: function(data) {
if( data.error ) {
alert(data.error);
} else {
window.localStorage.setItem('access_token', data.access_token);
window.localStorage.setItem('refresh_token', data.refresh_token);
access_token = window.localStorage.getItem('access_token');
refresh_token = window.localStorage.getItem('refresh_token');
App.home();
}
},
error: function(a,b,c) {
console.log(a,b,c);
}
});
},
login: function() {
$.ajax({
type: 'GET',
url: 'http://domain.com/api/oauth/token',
data: {
grant_type: 'password',
username: $('#Username').val(),
password: $('#Password').val(),
client_id: 'NTEzN2FjNzZlYzU4ZGM2'
},
dataType: 'jsonp',
success: function(data) {
if( data.error ) {
alert(data.error);
} else {
window.localStorage.setItem('access_token', data.access_token);
window.localStorage.setItem('refresh_token', data.refresh_token);
access_token = window.localStorage.getItem('access_token');
refresh_token = window.localStorage.getItem('refresh_token');
App.home();
}
},
error: function(a,b,c) {
console.log(a,b,c);
}
});
},
logout: function() {
localStorage.removeItem('access_token');
localStorage.removeItem('refresh_token');
access_token = window.localStorage.getItem('access_token');
refresh_token = window.localStorage.getItem('refresh_token');
App.splash();
}
};
У меня есть ряд вопросов, связанных с моей реализацией OAuth:
1.) По-видимому, сохранение access_token в localStorage - это плохая практика, и вместо этого я должен использовать файлы cookie. Может ли кто-нибудь объяснить, почему? Поскольку это не является более безопасным или менее безопасным, насколько я могу судить, поскольку данные cookie не будут зашифрованы.
ОБНОВЛЕНИЕ: В соответствии с этим вопросом: Локальное хранилище и файлы cookie хранение данных в localStorage ТОЛЬКО доступно на клиентской стороне и не делает любой HTTP-запрос, в отличие от файлов cookie, так кажется мне более безопасным, или, по крайней мере, у меня нет никаких проблем!
2.) Относительно вопроса 1, использование файла cookie для истечения срока будет одинаково для меня бессмысленным, как если бы вы посмотрели на код, в приложении начнется запрос на получение информации о пользователе, которая вернется ошибка, если она истекла на сервере, и требует refresh_token. Поэтому не уверен в преимуществах времени истечения срока действия на BOTH-клиенте и сервере, когда сервер действительно имеет значение.
3.) Как мне получить токен обновления, без A, сохраняя его с помощью исходного access_token для использования позже, и B) также сохраняя client_id? Мне сказали, что это проблема с безопасностью, но как я могу использовать их позже, но защищать их в приложении JS? Снова просмотрите приведенный выше код, чтобы узнать, как я это сделал до сих пор.