D+19
와 1월의 마지막 날....
너무나 금방갔지만 그래도 나름 열심히 살았던 한달..일걸..>?....ㅋㅎㅋㅎ
API란?
Application Programming Interface의 약자로 운영체제가 응용프로그램을 위해 제공하는 함수의 집합으로 응용프로그램과 디바이스를 연결해주는 역할을 한다. 다시 말해, 특정 시스템을 프로그래밍하기 위한 함수의 집합을 말한다.
SDK란?
Software Development Kit의 약자로 소프트웨어를 개발하는 도구이다. 윈도우즈용 프로그램 개발킷을 의미하지만 지금은 API와 같은 의미로 쓰인다.
<자바스크립트에서 구글 로그인으로 인증하기>
firebase 자바스크립트 SDK로 로그인 과정을 처리하는 것이 가장 쉬운 사용자 인증 방법이다.
1) google 제공업체의 객체의 인스턴스를 생성한다.
1 2 | var auth = firebase.auth(); var authProvider = new firebase.auth.GoogleAuthProvider(); |
2) 인증제공업체(구글)에 요청하고자 하는 OAuth 2.0 범위를 지정한다. 범위를 지정하기 위해서는 addScope를 사용한다.
범위 = Scope(해당 resource server에서 필요한 기능들을 말한다)
1 | provider.addScope('https://www.googleapis.com/auth/contacts.readonly'); |
위와 같은 방식으로 사용하며, 여러가지 기능들이 있다.
https://www.googleapis.com/auth/plus.me (owner가 구글에서 누구인지(계정)를 알려줌)
http://www.googleapis.com/auth/userinfo.email (owner의 이메일 주소를 보여줌)
http://www.googleapis.com/auth/userinfo.profile (owner의 계정에 대해 기본적인 정보를 보여줌)
3) OAuth과정을 현지화 하려면 OAuth 과정 전에 인증 인스턴스의 언어 코드를 업데이트 한다.
1 | firebase.auth().languageCode = 'pt'; |
브라우저를 디폴트로 선호하는 언어로 설정한다.
4) 구글 제공업체 객체를 통해서 firebase에 인증한다. 팝업창을 띄우거나 로그인 페이지로 리디렉션 하여 사용자가 구글 계정에 로그인하도록 유도한다.
팝업창을 띄우려면 signInWithPopup()을 사용한다.
이를 통해 구글 액세스 토큰을 얻을 수 있다.
오류가 생겼을 때에도 어떻게 할 것인지 결정해 준다.
firebase.auth.AuthCredential 타입은 인증 공급자(구글)가 반환한 자격증명을 나타내는 인터페이스이다. 구현은각 인증 공급자가 자격 증명 요구사항에 대한 세부정보를 지정한다.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 | auth.signInWithPopup(authProvider).then(function(result) { // 구글 액세스 토큰을 얻어 구글 api에 접근이 가능하다. var token = result.credential.accessToken; // 사용자 정보로 signed-in // ... }).catch(function(error) { // 에러가 났을 때 var errorCode = error.code; var errorMessage = error.message; // 이메일 계정이 이미 사용되었을 때 var email = error.email; var credential = error.credential; }); |
리디렉션 하려면 signInWithRedirect()을 사용한다. 이를 통해 로드가 완료되면 getRedirectResult 통해 토큰을 가져온다.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 | auth.getRedirectResult().then(function(result) { if (result.credential) { // This gives you a Google Access Token. You can use it to access the Google API. var token = result.credential.accessToken; // ... } // The signed-in user info. var user = result.user; }).catch(function(error) { // Handle Errors here. var errorCode = error.code; var errorMessage = error.message; // The email of the user's account used. var email = error.email; // The firebase.auth.AuthCredential type that was used. var credential = error.credential; // ... });r |
자바스크립트 공부도 많이 해야할 것 같다.
프로토타입
클릭이벤트
함수
'동계현장실습' 카테고리의 다른 글
| 19.02.12 화요일 (0) | 2019.02.13 |
|---|---|
| 19.02.11 월요일 (0) | 2019.02.12 |
| 19.01.30 수요일 (0) | 2019.01.30 |
| 19.01.29 화요일 (0) | 2019.01.30 |
| 19.01.28 월요일 (0) | 2019.01.28 |
