💥 Add Web support (LinusU#16)

czepiec · May 25, 2021 · 1988697 · 1988697
1 parent 9af584d
commit 1988697
Show file tree

Hide file tree

Showing 4 changed files with 58 additions and 1 deletion.
diff --git a/README.md b/README.md
@@ -2,7 +2,7 @@
 
 A Flutter plugin for authenticating a user with a web service, even if the web service is run by a third party. Most commonly used with OAuth2, but can be used with any web flow that can redirect to a custom scheme.
 
-In the background, this plugin uses [`ASWebAuthenticationSession`][ASWebAuthenticationSession] on iOS 12+ and macOS 10.15+, [`SFAuthenticationSession`][SFAuthenticationSession] on iOS 11, and [Chrome Custom Tabs][Chrome Custom Tabs] on Android. You can build it with iOS 8+, but it is currently only supported by iOS 11 or higher.
+In the background, this plugin uses [`ASWebAuthenticationSession`][ASWebAuthenticationSession] on iOS 12+ and macOS 10.15+, [`SFAuthenticationSession`][SFAuthenticationSession] on iOS 11, [Chrome Custom Tabs][Chrome Custom Tabs] on Android and opens a new window on Web. You can build it with iOS 8+, but it is currently only supported by iOS 11 or higher.
 
 [ASWebAuthenticationSession]: https://developer.apple.com/documentation/authenticationservices/aswebauthenticationsession
 [SFAuthenticationSession]: https://developer.apple.com/documentation/safariservices/sfauthenticationsession
@@ -92,3 +92,7 @@ In order to capture the callback url, the following `activity` needs to be added
   </application>
 </manifest>
 ```
+
+### Web
+
+On the web platform, the schema, host, and port (in the case of a non-standard port) of the redirection URL passed to the authentication service must be the same as the URL on which the application is running, and the path must be `/flutter-web-auth.html`. Parameter `callbackUrlScheme` of the `authenticate()` method does not take into account, so it is possible to use a schema for native platforms in the code.
diff --git a/lib/flutter_web_auth_web.dart b/lib/flutter_web_auth_web.dart
@@ -0,0 +1,40 @@
+import 'dart:async';
+import 'dart:html';
+import 'dart:js';
+
+import 'package:flutter/services.dart';
+import 'package:flutter_web_plugins/flutter_web_plugins.dart';
+
+class FlutterWebAuthPlugin {
+  static void registerWith(Registrar registrar) {
+    final MethodChannel channel = MethodChannel(
+        'flutter_web_auth', const StandardMethodCodec(), registrar.messenger);
+    final FlutterWebAuthPlugin instance = FlutterWebAuthPlugin();
+    channel.setMethodCallHandler(instance.handleMethodCall);
+  }
+
+  Future<dynamic> handleMethodCall(MethodCall call) async {
+    switch (call.method) {
+      case 'authenticate':
+        final String url = call.arguments['url'];
+        return _authenticate(url);
+      default:
+        throw PlatformException(
+            code: 'Unimplemented',
+            details: "The flutter_web_auth plugin for web doesn't implement "
+                "the method '${call.method}'");
+    }
+  }
+
+  static Future<String> _authenticate(String url) async {
+    context.callMethod('open', [url]);
+    await for (MessageEvent messageEvent in window.onMessage) {
+      final message = messageEvent.data['flutter-web-auth'];
+      if (messageEvent.origin == Uri.base.origin && message is String) {
+        return message;
+      }
+    }
+    throw new PlatformException(
+        code: 'error', message: 'Iterable window.onMessage is empty');
+  }
+}
diff --git a/pubspec.yaml b/pubspec.yaml
@@ -33,6 +33,9 @@ flutter:
         pluginClass: FlutterWebAuthPlugin
       macos:
         pluginClass: FlutterWebAuthPlugin
+      web:
+        pluginClass: FlutterWebAuthPlugin
+        fileName: flutter_web_auth_web.dart
 
   # To add assets to your plugin package, add an assets section, like this:
   # assets:

diff --git a/web/flutter-web-auth.html b/web/flutter-web-auth.html
@@ -0,0 +1,10 @@
+<!DOCTYPE html>
+<title>Authentication complete</title>
+<p>Authentication is complete. If this does not happen automatically, please
+close the window.
+<script>
+  window.opener.postMessage({
+    'flutter-web-auth': window.location.href
+  }, window.location.origin);
+  window.close();
+</script>