Flutterでアプリ開発・Auth0を実装（iOS編）

<!-- Auth0.plist -->

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
<plist version="1.0">
<dict>
  <key>ClientId</key>
  <string>XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX</string>
  <key>Domain</key>
  <string>OOOOOO.auth0.com</string>
</dict>
</plist>

<!-- Info.plist -->
<key>CFBundleURLTypes</key>
<array>
    <dict>
        <key>CFBundleTypeRole</key>
        <string>None</string>
        <key>CFBundleURLName</key>
        <string>auth0</string>
        <key>CFBundleURLSchemes</key>
        <array>
            <string>$(PRODUCT_BUNDLE_IDENTIFIER)</string>
        </array>
    </dict>
</array>

import UIKit
import Flutter

@UIApplicationMain
@objc class AppDelegate: FlutterAppDelegate {

    override func application(
        _ application: UIApplication,
        didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?
    ) -> Bool {
        GeneratedPluginRegistrant.register(with: self)
        return super.application(application, didFinishLaunchingWithOptions: launchOptions)
    }
}

import UIKit
import Flutter

@UIApplicationMain
@objc class AppDelegate: FlutterAppDelegate {

    override func application(
        _ application: UIApplication,
        didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?
    ) -> Bool {
        GeneratedPluginRegistrant.register(with: self)

        // Flutter側との連携のため、以下の3行を追加
        let controller: FlutterViewController = window?.rootViewController as! FlutterViewController
        let methodChannel = FlutterMethodChannel(name: "com.example.flutterauthapp/auth0", binaryMessenger: controller as! FlutterBinaryMessenger)
        methodChannel.setMethodCallHandler(self.handle)

        return super.application(application, didFinishLaunchingWithOptions: launchOptions)
    }
}

import Foundation
import Auth0

class Auth0Utils {
    private static let credentialsManager = CredentialsManager(authentication: Auth0.authentication())

    static func isLogin(result: @escaping FlutterResult) {
        result(credentialsManager.hasValid())
    }

    static func login(result: @escaping FlutterResult) {
        let filePath = Bundle.main.path(forResource: "Auth0", ofType:"plist" )
        let plist = NSDictionary(contentsOfFile: filePath!)!
        let domain = plist["Domain"] as? String

        guard let domain = domain else { return }
        Auth0
            .webAuth()
            .scope("openid profile email")
            .audience("https://\(domain)/userinfo")
            .start { audienceResult in
                switch audienceResult {
                case .failure(let error):
                    result(FlutterError(code: "error", message: error.localizedDescription, details: nil))
                case .success(let credentials):
                    _ = credentialsManager.store(credentials: credentials)
                    var credentialsMap = [String: Any]()
                    credentialsMap["idToken"] = credentials.idToken
                    credentialsMap["accessToken"] = credentials.accessToken
                    credentialsMap["expiresAt"] = Int(credentials.expiresIn?.timeIntervalSince1970 ?? 0)
                    credentialsMap["refreshToken"] = credentials.refreshToken
                    credentialsMap["type"] = credentials.tokenType
                    credentialsMap["scope"] = credentials.scope
                    credentialsMap["recoveryCode"] = credentials.recoveryCode
                    result(credentialsMap)
                }
        }
    }
    
    static func logout(result: @escaping FlutterResult) {
        Auth0
            .webAuth()
            .clearSession(federated:false){
                switch $0{
                    case true:
                        _ = credentialsManager.clear()
                        result(true)
                    case false:
                        result(FlutterError(code: "error", message: "Logout error", details: nil))
                    }
                }
    }
    
    static func getUserProfile(result: @escaping FlutterResult) {
        credentialsManager.credentials { error, credentials in
            if let accessToken = credentials?.accessToken {
                Auth0
                    .authentication()
                    .userInfo(withAccessToken: accessToken)
                    .start { userInfoResult in
                        switch userInfoResult {
                        case .failure(let error):
                            result(FlutterError(code: "error", message: error.localizedDescription, details: nil))
                        case .success(let userInfo):
                            var userInfoMap = [String: Any]()
                            userInfoMap["id"] = userInfo.sub
                            userInfoMap["name"] = userInfo.name
                            userInfoMap["nickname"] = userInfo.nickname
                            userInfoMap["pictureURL"] = userInfo.picture?.absoluteString ?? ""
                            userInfoMap["email"] = userInfo.email
                            userInfoMap["isEmailVerified"] = userInfo.emailVerified
                            userInfoMap["familyName"] = userInfo.familyName
                            userInfoMap["givenName"] = userInfo.givenName
                            userInfoMap["createdAt"] = Int(userInfo.updatedAt?.timeIntervalSince1970 ?? 0)

                            result(userInfoMap)
                        }
                    }
            } else {
                result(FlutterError(code: "error", message: error?.localizedDescription ?? "", details: nil))
            }
        }
    }
}

import UIKit
import Flutter
import Auth0

@UIApplicationMain
@objc class AppDelegate: FlutterAppDelegate {

    override func application(
        _ application: UIApplication,
        didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?
    ) -> Bool {
        GeneratedPluginRegistrant.register(with: self)

        let controller: FlutterViewController = window?.rootViewController as! FlutterViewController
        let methodChannel = FlutterMethodChannel(name: "com.example.flutterauthapp/auth0", binaryMessenger: controller as! FlutterBinaryMessenger)

        // FlutterからのMethodCall時のハンドラを設定
        methodChannel.setMethodCallHandler(self.handle)

        return super.application(application, didFinishLaunchingWithOptions: launchOptions)
    }

    // 以下のコールバックにて「Auth0.resumeAuth()」を実行
    override func application(_ app: UIApplication, open url: URL, options: [UIApplication.OpenURLOptionsKey : Any]) -> Bool {
        return Auth0.resumeAuth(url, options: options)
    }

    // FlutterからのMethodCall時の処理を実装する
    private func handle(_ call: FlutterMethodCall, result: @escaping FlutterResult) {
      switch call.method {
      case "isLogin":
        Auth0Utils.isLogin(result: result)
      case "login":
        Auth0Utils.login(result: result)
      case "getUserProfile":
        Auth0Utils.getUserProfile(result: result)
      case "logout":
        Auth0Utils.logout(result: result)
      default:
        result(FlutterMethodNotImplemented)
      }
    }

}

dependencies:
  flutter:
    sdk: flutter


  # The following adds the Cupertino Icons font to your application.
  # Use with the CupertinoIcons class for iOS style icons.
  cupertino_icons: ^1.0.2
  flutter_riverpod: ^1.0.0-dev.7  # <-- これを追加

class Credentials {
  late String idToken;
  late String accessToken;
  late String type;
  String? refreshToken;
  late int expiresAt;
  String? scope;
  String? recoveryCode;

  Credentials.createFromMap(Map<String, dynamic> data) {
    idToken = data["idToken"];
    accessToken = data["accessToken"];
    type = data["type"];
    refreshToken = data["refreshToken"];
    expiresAt = data["expiresAt"];
    scope = data["scope"];
    recoveryCode = data["recoveryCode"];
  }
}

class UserProfile {
  String? id;
  String? name;
  String? nickname;
  String? pictureURL;
  String? email;
  bool? isEmailVerified;
  String? familyName;
  String? givenName;
  int? createdAt;

  UserProfile.createFromMap(Map<String, dynamic> data) {
    id = data['id'];
    name = data['name'];
    nickname = data['nickname'];
    pictureURL = data['pictureURL'];
    email = data['email'];
    isEmailVerified = data['isEmailVerified'];
    familyName = data['familyName'];
    givenName = data['givenName'];
    createdAt = data['createdAt'];
  }
}

import 'package:flutterauthapp/entity/user_profile.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';

final myHomeViewModelProvider = ChangeNotifierProvider((ref) => MyHomeViewModel());

class MyHomeViewModel extends ChangeNotifier {

  // MethodChannel名はiOS側と同一にしておくこと
  static const MethodChannel _channel = MethodChannel('com.example.flutterauthapp/auth0');

  String loginButtonlabel = "Login";

  String name = "";
  String email = "";
  String imageUrl = "";

  Future<bool> isLogin() async {
    return await _channel.invokeMethod('isLogin');
  }

  Future<bool> login() async {
    try {
      Map<String, dynamic>? loginData = await _channel.invokeMapMethod<String, dynamic>('login');
      if (loginData != null) {
        loginButtonlabel = "Logout";
        notifyListeners();
        return true;
      }
      return false;
    } catch(e) {
      debugPrint(e.toString());
      return false;
    }
  }

  Future<bool> getUserProfile() async {
    try {
      Map<String, dynamic>? userProfile = await _channel.invokeMapMethod<String, dynamic>('getUserProfile');
      if (userProfile != null) {
        var user = UserProfile.createFromMap(userProfile);
        name = user.name ?? "";
        email = user.email ?? "";
        imageUrl = user.pictureURL ?? "";
        notifyListeners();
        return true;
      }
      return false;
    } catch(e) {
      debugPrint(e.toString());
      return false;
    }
  }

  Future<void> logout() async {
    try {
      bool isSuccess = await _channel.invokeMethod('logout');
      if (isSuccess) {
        loginButtonlabel = "Login";
        name = "";
        email = "";
        imageUrl = "";
        notifyListeners();
      }
    } catch(e) {
      debugPrint(e.toString());
    }
  }

}

import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';

import 'my_app.dart';

void main() {
  runApp(const ProviderScope(child: MyApp()));
}

import 'package:flutter/material.dart';
import 'my_home_page.dart';

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'my_home_page_viewmodel.dart';

class MyHomePage extends ConsumerWidget {

  final String title;

  MyHomePage({Key? key, required this.title}) : super(key: key);

  @override
  Widget build(BuildContext context, WidgetRef ref) {
    final _viewModel = ref.watch(myHomeViewModelProvider);
    return Scaffold(
      appBar: AppBar(
        title: Text(title),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            const Text(
              'Auth0 Test App',
            ),
            SizedBox(
              child: ElevatedButton(
                onPressed: () async {
                  var isLogin = await _viewModel.isLogin();
                  if (isLogin) {
                    await _viewModel.logout();
                  } else {
                    bool isSuccess = await _viewModel.login();
                    if (isSuccess) {
                      await _viewModel.getUserProfile();
                    }
                  }
                },
                child: Text(_viewModel.loginButtonlabel),
              ),
            ),
            _viewModel.imageUrl.isNotEmpty?Image.network(_viewModel.imageUrl):Container(),
            Text(
              'name: ${_viewModel.name}',
            ),
            Text(
              'email: ${_viewModel.email}',
            ),
          ],
        ),
      ),
    );
  }
}