[Rails] OAuth2.0 with Google

[Rails] OAuth2.0 with Google

OAuth2.0이란 - OAuth2.0?를 참고해주세요.

---

Google API 및 사용자 인증 정보 발급

오늘은 이런 OAuth2.0을 이용한 구글 로그인을 구현해보도록 하겠습니다. 가장 먼저해야 하는 것은 Google의 API를 사용하기 위해 이를 설정하는 행위입니다.

일종의 "내 사이트가 당신들의 API를 쓰고 싶으니까 허가증을 발급해줘" 라는 의미입니다.

1. https://console.developers.google.com에 접속합니다.

2. 프로젝트 하나 생성합니다.
   
   

   

   

   
   

3. Google+와 Google People API 이 두개의 API 사용을 요청합니다.

   (사진에서는 Google+만 있고 저는 이미 사용하고 있기 때문에 관리라는 버튼이 보이는 것입니다.)
   
   

   

   

   

   
   

4. 이렇게 기본적인 API 설정은 끝났습니다. 이제는 우리가 만든 프로젝트가 현재 만든 구글 프로젝트를 사용하고 허용하는 것을 증명하는 클라이언트 ID와 클라이언트 SECRET을 발급 받아야 합니다. 즉 해당 구글 프로젝트를 사용하기 위해서는 이 구글 프로젝트가 제공해주는 고유 식별 값을 받아야 한다는 것입니다.

5. 먼저 대시보드로 돌아가 사용자 인증 정보 메뉴로 들어갑니다.
   
   

   

   

   
   

   사용자에게 보여줄 사이트의 이름을 설정해줍니다. 저장 버튼을 눌러 저장 후 사용자 인증 정보 탭으로 들어갑니다.
   
   

   

   
   

   애플리케이션 유형에서 웹 어플리케이션을 선택후 "승인된 리디렉션 URI"에 다음과 같이 입력해줍니다. 그리고 생성 버튼을 눌러줍니다. http://localhost:3000/auth/google_oauth2/callback

   

   
   

6. 이렇게 사용자 인증 정보가 생성되면 다음과 같이 클라이언트 ID와 SECRET이 발급됩니다. 이 메모장에 잠깐 복사하여 옮겨적어주시기 바랍니다. 이 인증 정보는 매우 민감한 정보이니 반드시 보안에 유의하여 다뤄주셔야 합니다.
   
   

   

   
   

   (저는 현재는 프로젝트를 삭제한 상태이니 해당 인증 정보는 파기되었습니다.)

이렇게 기본적인 API설정과 사용자 인증 정보를 발급 받는 작업은 모두 끝이 났습니다. 이제 본격적으로 코드를 작성해보도록 하겠습니다.

---

Implementation

가장 먼저 두 개의 잼을 설치해주셔야 합니다. Gemfile에 두 잼을 추가한 후 bundle install을 해줍니다.

1. gem "figaro" : 위에서 발급 받은 인증 정보를 보다 안전하게 관리하기 위해 사용
2. gem "omniauth-google-oauth2" : 구글 API를 쉽게 사용하기 위해 사용

1. Figaro

figaro를 이용하여 발급받은 인증 정보를 프로젝트 내에서 안전하게 사용하기 위해서는 다음과 같은 과정이 필요합니다.

1. figaro가 정상적으로 설치되었다면 다음 명령어를 한번 더 입력합니다.

   bundle exec figaro install

2. 위의 명령어를 실행하면 config/application.yml 과 .gitignore 파일이 자동으로 생성될 것입니다. 그리고 application.yml에 발급받은 정보를 입력하고 추가된 .gitignore에는 application.yml이 추가되어 있어 깃헙에 위의 프로젝트를 올릴 때 application.yml은 제외되고 올라가므로 인증 정보가 같이 올라가는 것을 막을 수 있습니다.

3. application.yml에 다음과 같이 입력받은 인증정보를 작성해줍니다.

   GOOGLE_CLIENT: '여러분이 발급받은 클라이언트 ID'
   GOOGLE_SECRET: '여러분이 발급받은 클라이언트 보안 비밀 코드'
   

오늘의 예제에서는 이렇게 간단하게만 다루기 때문에 더욱 상세한 figaro 사용법은 링크를 참고해주세요.

2. omniauth-google-oauth2

먼저 config/initializers 폴더 안에 omniauth.rb 파일을 생성해줍니다. 그리고 해당 파일안에 다음과 같이 코드를 작성해줍니다.

• 여기서 ENV["GOOGLE_CLIENT"]와 ENV["GOOGLE_SECRET"]은 위의 figaro에서 설정한 값들로 application.yml에서 값을 가져오는 것입니다.
• 여기에서 추가적으로 옵션을 추가하여 추가적인 정보들을 가져올 수 있습니다. 자세한 사항은 링크를 참고해주세요. 오늘의 예제에서는 기본 정보만을 가져오도록 하겠습니다.

그리고 콘솔에서 이제 받아온 정보를 저장할 모델을 생성해줍니다.

rails g model User provider:string uid:string name:string oauth_token:string oauth_expires_at:datetime

rake db:migrate

이젠 컨트롤러를 만들어보도록 하겠습니다.

rails g controller Home show
rails g controller Sessions create destroy

• Home 컨트롤러는 단순히 로그인/로그아웃 버튼이 존재하는 페이지입니다.
• Session 컨트롤러에서는 구글에서 받아온 정보와 세션을 다루는 역할을 합니다.

그리고 중요한 라우팅 정보를 담고있는 config/routes.rb 파일을 수정해보도록 하겠습니다.

• 여기서 주목해야할 것은 get 'auth/:provider/callback'입니다. 여기서 :provider 는 google_oauth2로 구글 프로젝트 생성시 리디렉션 URI에 입력한 경로입니다. :provider라고 한 이유는 추후에 페이스북이나 기타 다른 공급자의 API를 사용할 때를 위해서 입니다.

그럼 이제 본격적으로 Sessions 컨트롤러를 작성해보도록 하겠습니다.

1. from_omniauth(auth) 메소드는 구글 프로젝트에서 입력해준 리디렉션 URI를 통해 해당 경로로 리디렉션 될 때 넘어온 사용자 정보를 다루는 메소드입니다. first_or_initialize는 provider와 uid를 통해 기존에 같은 사용자 정보가 존재하는지 검사를 하고 이미 존재한다면 새로운 값을 갱신하고 존재하지 않는다면 새로 데이터를 만드는 내장 메소드입니다.
2. 리디렉션 될 때 정보들은 해쉬에 담겨 오는데 해당 해쉬에 접근하기 위해서는 request.env["omniauth.auth"]를 통해 접근하고 이렇게 받아온 정보를 from_omniauth 에 넘겨줍니다. 넘어온 해쉬값에 들어있는 정보들이 궁금하다면 링크를 참고해주세요.
3. 기본적으로 이렇게 받아온 사용자 정보는 oauth_token을 담고 있는데 해당 토큰은 일정 시간이 되면 만료되게끔 되어있습니다. 그렇기 때문에 로그인을 할 때마다 값이 토큰 값이 갱신됩니다.

이젠 현재 유저가 접속되어있는지를 판단하는 헬퍼 메소드를 작성해보도록 하겠습니다.

• 현재 로그인이 되어있다면 해당 사용자 정보를 담고 없다면 nil값이 담기는 코드입니다.

마지막으로 로그인/로그아웃 버튼을 만들어주도록 하겠습니다. 이 버튼들은 로그인의 유무에 따라 다른 것을 보여주기 때문에 위의 current_user를 사용합니다.

---

마무리

이렇게 구글 이메일을 통한 로그인을 구현하는 방법을 알아보았습니다. 페이스북이나 기타 다른 API도 크게 다르지 않기 때문에 위의 메커니즘을 이해하시면 구현하는데 크게 어려움을 느끼시지는 않을 것입니다. 감사합니다.

참고자료

1. https://richonrails.com/articles/google-authentication-in-ruby-on-rails/