「Cross origin redirect sign-in on Google Chrome M115+ is no longer supported」とは？

クロスオリジンリダイレクト認証とは、WebサイトAからWebサイトBへユーザーをリダイレクトし、そこでログイン処理を行う認証方式です。この方式は、Firebase Authenticationなどの認証サービスでよく利用されていました。

この変更の影響を受けるのは、主に以下の開発者の方々です。

• Firebase Authenticationなどの認証サービスを利用して、WebサイトやAndroidアプリのログイン機能を実装している開発者
• WebViewコンポーネントを使用して、Webサイト内から他のWebサイトへログイン処理を呼び出している開発者

この変更への対策

この変更に対応するためには、以下のいずれかの方法でログイン方式を変更する必要があります。

• **PKCE（Proof Key for Code Exchange）**を使った認証方式へ移行する
• GoogleサインインなどのOAuth 2.0ベースの認証方式へ移行する
• カスタム認証フローを構築する

この変更は、ユーザーのセキュリティを強化するためのものです。クロスオリジンリダイレクト認証は、悪意のあるサイトがユーザーをだまして認証情報を盗み取る可能性があるという脆弱性がありました。

まず、Firebaseプロジェクトを作成し、Androidアプリを登録する必要があります。

依存関係の追加

以下のライブラリをプロジェクトに依存関係として追加します。

implementation 'com.google.android.gms:play-services-auth:20.1.0'
implementation 'androidx.activity:activity-compose:1.5.1'

コードの作成

MainActivity.kt

package com.example.pkceexample

import android.os.Bundle
import androidx.activity.ComponentActivity
import androidx.activity.compose.setContent
import androidx.compose.foundation.layout.*
import androidx.compose.material.*
import androidx.compose.runtime.*
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.text.input.PasswordVisualTransformation
import androidx.compose.ui.unit.dp
import com.google.android.gms.auth.api.signin.GoogleSignIn
import com.google.android.gms.auth.api.signin.GoogleSignInAccount
import com.google.android.gms.common.api.ApiException
import com.google.firebase.auth.FirebaseAuth
import com.google.firebase.auth.GoogleAuthProvider
import kotlinx.coroutines.launch

class MainActivity : ComponentActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContent {
            SignInScreen()
        }
    }
}

@Composable
fun SignInScreen() {
    var codeVerifier by remember { mutableStateOf("") }
    var codeChallenge by remember { mutableStateOf("") }
    var googleSignInAccount by remember { mutableStateOf<GoogleSignInAccount?>(null) }
    var showLoading by remember { mutableStateOf(false) }

    val auth = FirebaseAuth.getInstance()

    LaunchedEffect(Unit) {
        // コード検証とコード課題を生成
        codeVerifier = generateCodeVerifier()
        codeChallenge = generateCodeChallenge(codeVerifier)
    }

    Column(
        modifier = Modifier.fillMaxSize(),
        verticalArrangement = Arrangement.Center,
        horizontalAlignment = Alignment.CenterHorizontally
    ) {
        if (showLoading) {
            CircularProgressIndicator()
        } else {
            Button(onClick = {
                showLoading = true
                launch {
                    try {
                        val signInIntent = getGoogleSignInIntent(codeChallenge)
                        startActivityForResult(signInIntent, RC_SIGN_IN)
                    } catch (e: Exception) {
                        e.printStackTrace()
                        showLoading = false
                    }
                }
            }) {
                Text("Googleでログイン")
            }
        }
    }

    if (googleSignInAccount != null) {
        // Googleログイン完了後の処理
        launch {
            try {
                val firebaseUser = getFirebaseUser(googleSignInAccount, auth)
                // ログイン成功後の処理
                println("firebaseUser: $firebaseUser")
                showLoading = false
            } catch (e: Exception) {
                e.printStackTrace()
                showLoading = false
            }
        }
    }
}

// コード検証を生成
fun generateCodeVerifier(): String {
    // 43～128文字のランダムな文字列を生成
    return "YOUR_CODE_VERIFIER"
}

// コード課題を生成
fun generateCodeChallenge(codeVerifier: String): String {
    // SHA-256でハッシュ化し、base64urlエンコード
    return "YOUR_CODE_CHALLENGE"
}

// GoogleログインのIntentを取得
fun getGoogleSignInIntent(codeChallenge: String): Intent {
    val gso = GoogleSignInOptions.Builder(GoogleSignInOptions.DEFAULT_SIGN_IN)
        .requestIdToken(CLIENT_ID)
        .requestScope("profile")
        .requestScope("email")
        .build()
    val signInClient = GoogleSignIn.getClient(this, gso)
    return signInClient.signInIntent(codeChallenge)
}

// ログイン結果を処理
override fun onActivityResult(requestCode: Int, resultCode: Int, data: Intent?) {
    super.onActivityResult(requestCode, resultCode, data)

    if (requestCode == RC_SIGN_IN) {
        val task = GoogleSignIn.getSignedInAccountFromIntent(data)
        try {
            val account = task.getResult(ApiException::

PKCEは、より安全でモダンな認証方式です。コード検証とコードチャレンジを使用して、ユーザー認証フローにおけるなりすまし攻撃を防ぎます。

Googleサインイン

Googleサインインは、OAuth 2.0ベースの認証方式で、ユーザーはGoogleアカウントを使用してログインできます。PKCEと同様に、なりすまし攻撃に対する保護機能が強化されています。

カスタム認証フロー

独自の認証フローを構築することもできます。ただし、この方法にはセキュリティ上のリスクが伴うため、十分な注意が必要です。

各方法のメリットとデメリット

推奨される方法