Autofill password and email

[venky9885]

Environment

Flutter version: Plugin version:
Android version:
iOS version: Xcode version:
Device information:

Description

What you'd like to happen:

Alternatives you've considered:
Autofill email and password Images:

[tneotia]

Just use JS to do this, many examples on the web.

[rikousik]

@tneotia can you share any link ?

[tneotia]

https://stackoverflow.com/questions/54615342/use-javascript-to-automatically-fill-in-html-forms/54615425

[ycv005]

That would very hard to detect field and fill them. You need to check each and every url.

[tneotia]

That is correct, my solution was intended for accessing a single website through webview, like if you wanted to make a PWA app and save the user's login, autofilling it in the background on app start.

I use this method, autofilling my website's login or autofilling Google login (depending which way the user has created their account)

[aaron-chu]

In issue https://github.com/pichillilorenzo/flutter_inappwebview/issues/598, the author said the Android autofill is solved in 5.0.5+3 with useHybridComposition: true. However, it still doesn't work even though I use the version 5.3.2 with useHybridComposition: true.

The following is an example to load github page, it should be able to auto fill the username and password when you are in the sign in page.

class InAppWebViewExampleScreen extends StatefulWidget {
  @override
  _InAppWebViewExampleScreenState createState() =>
      _InAppWebViewExampleScreenState();
}

class _InAppWebViewExampleScreenState extends State<InAppWebViewExampleScreen> {
  final GlobalKey webViewKey = GlobalKey();

  InAppWebViewController? webViewController;
  InAppWebViewGroupOptions options = InAppWebViewGroupOptions(
      crossPlatform: InAppWebViewOptions(
        useShouldOverrideUrlLoading: true,
        mediaPlaybackRequiresUserGesture: false,
      ),
      android: AndroidInAppWebViewOptions(
        useHybridComposition: true,
      ),
      ios: IOSInAppWebViewOptions(
        allowsInlineMediaPlayback: true,
      ));

  late PullToRefreshController pullToRefreshController;
  late ContextMenu contextMenu;
  String url = "";
  double progress = 0;
  final urlController = TextEditingController();

  @override
  void initState() {
    super.initState();

    pullToRefreshController = PullToRefreshController(
      options: PullToRefreshOptions(
        color: Colors.blue,
      ),
      onRefresh: () async {
        if (Platform.isAndroid) {
          webViewController?.reload();
        } else if (Platform.isIOS) {
          webViewController?.loadUrl(
              urlRequest: URLRequest(url: await webViewController?.getUrl()));
        }
      },
    );
  }

  @override
  void dispose() {
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(title: Text("InAppWebView")),
        body: SafeArea(
            child: Column(children: <Widget>[
          Expanded(
            child: Stack(
              children: [
                InAppWebView(
                  key: webViewKey,
                  // contextMenu: contextMenu,
                  initialUrlRequest:
                      URLRequest(url: Uri.parse('https://github.com/')),
                  // initialFile: "assets/index.html",
                  initialUserScripts: UnmodifiableListView<UserScript>([]),
                  initialOptions: options,
                  pullToRefreshController: pullToRefreshController,
                  onWebViewCreated: (controller) {
                    webViewController = controller;
                  },
                  onLoadStart: (controller, url) {
                    setState(() {
                      this.url = url.toString();
                      urlController.text = this.url;
                    });
                  },
                  androidOnPermissionRequest:
                      (controller, origin, resources) async {
                    return PermissionRequestResponse(
                        resources: resources,
                        action: PermissionRequestResponseAction.GRANT);
                  },
                  shouldOverrideUrlLoading:
                      (controller, navigationAction) async {
                    return NavigationActionPolicy.ALLOW;
                  },
                  onLoadStop: (controller, url) async {
                    pullToRefreshController.endRefreshing();
                    setState(() {
                      this.url = url.toString();
                      urlController.text = this.url;
                    });
                  },
                  onLoadError: (controller, url, code, message) {
                    pullToRefreshController.endRefreshing();
                  },
                  onProgressChanged: (controller, progress) {
                    if (progress == 100) {
                      pullToRefreshController.endRefreshing();
                    }
                    setState(() {
                      this.progress = progress / 100;
                      urlController.text = this.url;
                    });
                  },
                  onUpdateVisitedHistory: (controller, url, androidIsReload) {
                    setState(() {
                      this.url = url.toString();
                      urlController.text = this.url;
                    });
                  },
                  onConsoleMessage: (controller, consoleMessage) {
                    print(consoleMessage);
                  },
                ),
                progress < 1.0
                    ? LinearProgressIndicator(value: progress)
                    : Container(),
              ],
            ),
          ),
          ButtonBar(
            alignment: MainAxisAlignment.center,
            children: <Widget>[
              ElevatedButton(
                child: Icon(Icons.arrow_back),
                onPressed: () {
                  webViewController?.goBack();
                },
              ),
              ElevatedButton(
                child: Icon(Icons.arrow_forward),
                onPressed: () {
                  webViewController?.goForward();
                },
              ),
              ElevatedButton(
                child: Icon(Icons.refresh),
                onPressed: () {
                  webViewController?.reload();
                },
              ),
            ],
          ),
        ])));
  }
}

[xiejinpeng007]

I have the same problem

[TobiasHeidingsfeld]

Any update on this? Looking for the same feature for Android and iOS

[andychucs]

any solution? Android can auto suggest autofill by website. but ios cannot. looks like only safari can autofill?

[xiejinpeng007]

I think this is a bug from flutter sdk in Android , and has been fixed in latest version. check this https://github.com/flutter/flutter/issues/92165

[FaFre]

Did anyone manage to get the autofill work on Android (inappwebview 6.x)?

[andychucs]

any solution? Android can auto suggest autofill by website. but ios cannot. looks like only safari can autofill?

I noted that Brave browser is able to autofill, so it is possible on iOS. Maybe we should try to find how they do this. https://github.com/brave/brave-core I am not sure where they implement autofill.

[github-actions[bot]]

This issue is stale and has been automatically closed because it has been open for more than 365 days with no activity. Please reopen a new issue if you still have it.

[github-actions[bot]]

This thread has been automatically locked since there has not been any recent activity after it was closed. If you are still experiencing a similar issue, please open a new bug and a minimal reproduction of the issue.