단일 페이지 응용 프로그램에서 사용자를 인증 하시겠습니까?

Question

프론트 엔드에서 백본을 사용하고 서버의 얇은 RESTful API에서 데이터를 사용하는 단일 페이지 앱 프로토 타입을 개발했습니다.

무거운 서버 측 응용 프로그램 개발 (PHP 및 Python)에서 나왔지만 두꺼운 클라이언트 측 MVC로 새로운 디자인 접근 방식을 사용했지만 로그인 한 인증 된 사용자에게만 응용 프로그램을 제한하는 방법을 혼란스럽게합니다.

나는 로그인 자체 뒤에 앱을 갖고 싶어하고 사이트의 기본 로그인 외에 다른 유형의 로그인 (openid, fb connect 등)을 구현하기를 원합니다. 나는 이것이 어떻게 행해졌는지 불분명하다. 그러나 나에게 명확하게 해주는 정보를 찾는데 실패했다.

큰 그림에서 사용자를 등록하고 단일 페이지 응용 프로그램을 사용하기 위해 로그인하도록 요구하는 현재 모범 사례는 무엇입니까?

일단 사용자가 로그인하면 API 요청은 어떻게 인증됩니까? 세션을 저장할 수 있습니까?하지만 API 호출에서이 세션을 감지하는 방법 또는 모든 단일 API 호출에서 전달해야하는 토큰이 있습니까? 이 모든 답변을 많이 주시면 감사하겠습니다!

Answer 1

우리는 django 쿠키 기반 인증을 사용하고 로그인과 단일 페이지 응용 프로그램을위한 별도의 페이지를 가지고 있습니다. 우리의 유스 케이스에 꽤 잘 작동합니다. 여기에 설명 된 백본 기반 세션 관리 시스템을 사용했습니다 : backbone.js - handling if a user is logged in or not

Answer 2

우리는 Angular.js를 사용하고 있으며 로그인을위한 별도의 페이지를 가지고 있습니다. 별도의 페이지는 HTTP XHR 요청을 사용하여 서버를 호출하고 사용자 이름과 암호를 전송하는 별도의 단일 페이지 (및 보안) 응용 프로그램을로드합니다. 서버가 자격 증명을 인증하면 javascript 코드가 쿠키를 설정합니다. 이 쿠키는 비보안 응용 프로그램 인 '상대방'에서 읽을 수 있습니다. 쿠키에는 사용자 이름과 비밀번호 또는 기타 보안 정보 만 넣습니다. 그런 다음 'Lior이 아닌 것'과 같은 것을 보여줄 수 있습니까? 로그 아웃 '합니다. 주의 할

만 가지가 만기를 설정하는 각도의 쿠키 메커니즘을 무시하고, 가장 중요한 루트 경로 :

$document[0].cookie = 'username=' + escape($scope.userName) + ";expires=Thu, 01 Jan 2970 00:00:00 GMT; Path=/"; 

Answer 3

나는 자격 증명 흐름 OAuth 클라이언트를 기반으로 본 가장 편안하고 방법, 기본적으로이 세션에 대한 액세스 토큰을 반환하는 사용자 이름/암호를 게시하는/토큰 끝점입니다. 그 후 모든 Ajax 요청은 토큰과 함께 Authorization 베어러 헤더를 추가합니다. 토큰을 전역 변수에 저장하여 페이지가 새로 고쳐 지거나 닫힐 때까지 유지하거나 로컬 저장소를 사용하여 세션간에 로그인 한 사용자 또는 자바 스크립트 쿠키를 유지할 수 있습니다. 토큰에 대한 아이디어가 마음에 들지 않는다면 어쨌든 모든 Ajax 요청과 함께 자동으로 전송되는 이전 쿠키 접근 방식을 사용할 수 있습니다.

facebook/google 등은 일반적으로 외부 사용자 로그인을 계정에 연결하는 stackoverflow 방식을 따릅니다. 그런 다음 꽤 정상적인 서버 기반 oauth 댄스를 사용하십시오 (서버에 대한 모든 요청을 약간의 수정으로 Ajax 요청으로 대체 할 수 있지만 어쨌든 서버와 리디렉션이 필요하므로 실제로는 큰 차이가 없습니다). 나는 보통 페이스 북 로그인을 위해 암호화 된 쿠키를 발행하는데, 위와 비슷한 방법을 사용하여 토큰으로 변환한다 (단지 username/password 대신 요청으로 쿠키를 보낸다).