Problem in google login in canva through webview in flutter

Question

I wanted to upload pics through canva from my flutter app that is why I am using the flutter-webview-plugin for the first time and therefore I am not able to solve this issue.

Code for the same is:-

import 'package:flutter/material.dart';
import 'package:kf_drawer/kf_drawer.dart';
import 'package:webview_flutter/webview_flutter.dart';
import 'dart:async';


class SettingsPage extends KFDrawerContent {
  @override
  _SettingsPageState createState() => _SettingsPageState();
}

class _SettingsPageState extends State<SettingsPage> {

  final Completer<WebViewController> _controller =
  Completer<WebViewController>();

  @override
  Widget build(BuildContext context) {
    return SafeArea(
      child: Center(
        child: Column(
          children: <Widget>[
            Row(
              children: <Widget>[
                ....
              ],
            ),
            Expanded(
              child: Container(
                height: 500,
                child: WebView(
                  initialUrl: "https://shree-hari.github.io/laxmi_canva/index.html",
                  javascriptMode: JavascriptMode.unrestricted,
                  onWebViewCreated: (WebViewController webViewController){
                    _controller.complete(webViewController);
                  },
                ),
              ),
            )
          ],
        ),
      ),
    );

  }
}

Please Help me to address this issue 🙄.

Answer 1

Google not allow native Flutter Web-Views to initiate OAuth.
For more info read Google Blog

In your case, I can suggest 3 Possible Solutions.

1. Try to Sign in with Email/Password instead of Google Sign In.
2. Use url_launcher to redirect the user to the browser.
3. If you don't want the user to leave your app
   then you can use flutter_custom_tabs
   this plugin use Chrome Custom Tabs to create a native experience inside the Flutter App.