22.
Google Authentication
Written by Tim Condon
Heads up... You’re accessing parts of this content for free, with some sections shown as text.
Heads up... You’re accessing parts of this content for free, with some sections shown as text.
Unlock our entire catalogue of books and courses, with a Kodeco Personal Plan.
Unlock now
In the previous chapters, you learned how to add authentication to the TIL web site. However, sometimes users don’t want to create extra accounts for an application and would prefer to use their existing accounts.
In this chapter, you’ll learn how to use OAuth 2.0 to delegate authentication to Google, so users can log in with their Google accounts instead.
OAuth 2.0
OAuth 2.0 is an authorization framework that allows third-party applications to access resources on behalf of a user. Whenever you log in to a website with your Google account, you’re using OAuth.
When you click Login with Google, Google is the site that authenticates you. You then authorize the application to have access to your Google data, such as your email. Once you’ve allowed the application access, Google gives the application a token. The app uses this token to authenticate requests to Google APIs. You’ll implement this technique in this chapter.
Note: You must have a Google account to complete this chapter. If you don’t have one, visit https://accounts.google.com/SignUp to create one.
Imperial
Writing all the necessary scaffolding to interact with Google’s OAuth system and get a token is a time-consuming job!
Adding to your project
Open Package.swift in Xcode to add the new dependency. Replace .package(url: "https://github.com/vapor/auth.git", from: "2.0.0") with the following:
.package(url: "https://github.com/vapor/auth.git",
from: "2.0.0"),
.package(url: "https://github.com/vapor-community/Imperial.git",
from: "0.7.1")
dependencies: ["FluentPostgreSQL",
"Vapor",
"Leaf",
"Authentication",
"Imperial"]
touch Sources/App/Controllers/ImperialController.swift
vapor xcode -y
import Vapor
import Imperial
import Authentication
struct ImperialController: RouteCollection {
func boot(router: Router) throws {
}
}
let imperialController = ImperialController()
try router.register(collection: imperialController)
Setting up your application with Google
To be able to use Google OAuth in your application, you must first register the application with Google. In your browser, go to https://console.developers.google.com/apis/credentials.
Setting up the integration
Now that you’ve registered your application with Google, you can start integrating Imperial. Open ImperialController.swift and add the following under boot(router:):
func processGoogleLogin(request: Request, token: String)
throws -> Future<ResponseEncodable> {
return request.future(request.redirect(to: "/"))
}
guard let googleCallbackURL =
Environment.get("GOOGLE_CALLBACK_URL") else {
fatalError("Google callback URL not set")
}
try router.oAuth(
from: Google.self,
authenticate: "login-google",
callback: googleCallbackURL,
scope: ["profile", "email"],
completion: processGoogleLogin)
Integrating with web authentication
It’s important to provide a seamless experience for users and match the experience for the regular login. To do this, you need to create a new user when a user logs in with Google for the first time. To create a user, you can use Google’s API to get the necessary details using the OAuth token.
Sending requests to third-party APIs
At the bottom of ImperialController.swift, add a new type to decode the data from Google’s API:
struct GoogleUserInfo: Content {
let email: String
let name: String
}
extension Google {
// 1
static func getUser(on request: Request)
throws -> Future<GoogleUserInfo> {
// 2
var headers = HTTPHeaders()
headers.bearerAuthorization =
try BearerAuthorization(token: request.accessToken())
// 3
let googleAPIURL =
"https://www.googleapis.com/oauth2/v1/userinfo?alt=json"
// 4
return try request
.client()
.get(googleAPIURL, headers: headers)
.map(to: GoogleUserInfo.self) { response in
// 5
guard response.http.status == .ok else {
// 6
if response.http.status == .unauthorized {
throw Abort.redirect(to: "/login-google")
} else {
throw Abort(.internalServerError)
}
}
// 7
return try response.content
.syncDecode(GoogleUserInfo.self)
}
}
}
// 1
return try Google
.getUser(on: request)
.flatMap(to: ResponseEncodable.self) { userInfo in
// 2
return User
.query(on: request)
.filter(\.username == userInfo.email)
.first()
.flatMap(to: ResponseEncodable.self) { foundUser in
guard let existingUser = foundUser else {
// 3
let user = User(name: userInfo.name,
username: userInfo.email,
password: UUID().uuidString)
// 4
return user
.save(on: request)
.map(to: ResponseEncodable.self) { user in
// 5
try request.authenticateSession(user)
return request.redirect(to: "/")
}
}
// 6
try request.authenticateSession(existingUser)
return request.future(request.redirect(to: "/"))
}
}
<a href="/login-google">
<img class="mt-3" src="/images/sign-in-with-google.png"
alt="Sign In With Google">
</a>
Where to go from here?
In this chapter, you learned how to integrate Google login into your website using Imperial and OAuth. This allows users to sign in with their existing Google accounts!