How to update all WebView tabs when a login is detected?

Question

It seems I am not finding the right term for searching my problem. I have an app now that is almost complete with one problem. First I would like to explain the app first. The app is a webview app with 5 tabs on the bottom navigation bar. I am using the official Flutter dev team webview_flutter

I have 2 problems btw, they are in a blockquote

Now the remaining problems is that when i logged in to the url that I've set in the one of the tabs where I used webview, it produces

(1) an error (image below, for some reason the error wont appear again on my emulator (it happened on the first time) BUT on my phone it appears) in the tab I used to login and not redirects automatically to the URL ive set

(2) and not all tabs refreshes automatically to detect the login event (I need to navigate in the url of the website and go back to detect the login event (which is what I dont want to happen)

below are my codes:

main.dart

import 'package:syncshop_webview/widgets/cart_page.dart';
import 'package:syncshop_webview/widgets/categories_page.dart';
import 'package:syncshop_webview/widgets/home_page.dart';
import 'package:syncshop_webview/widgets/profile_account.dart';
import 'package:syncshop_webview/widgets/search_page.dart';

void main() => runApp(MyApp());

class MyApp extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    return MyAppState();
  }
}

class MyAppState extends State<MyApp> {
int _selectedPage = 2;
final _pageOptions = [
  CategoriesPage(),
  SearchPage(),
  HomePage(),
  CartPage(),
  ProfileAccount(),
];

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      title: 'Sync Shop',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: Scaffold(
      body: IndexedStack(
        index: _selectedPage,
        children: _pageOptions,
      ),
      bottomNavigationBar: BottomNavigationBar(
          type: BottomNavigationBarType.fixed,
          currentIndex: _selectedPage,
          onTap: (int index) {
            setState((){
      _selectedPage = index;
            });
          },
          items: [
          BottomNavigationBarItem(icon: Icon(Icons.category), title: Text("Categories"),
          ),
          BottomNavigationBarItem(icon: Icon(Icons.search), title: Text("Search"),
          ),
          BottomNavigationBarItem(icon: Icon(Icons.home), title: Text("Home"),
          ),
          BottomNavigationBarItem(icon: Icon(Icons.shopping_cart), title: Text("Cart"),
          ),
          BottomNavigationBarItem(icon: Icon(Icons.account_circle), title: Text("Profile"),
          ),
          ],
          ),
      ),
      );
  }
}

one of my tabs, specifically where the user should login

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

class ProfileAccount extends StatefulWidget {

  @override
  _ProfileAccountState createState() => _ProfileAccountState();
}

class _ProfileAccountState extends State<ProfileAccount> with AutomaticKeepAliveClientMixin<ProfileAccount>{

WebViewController _myController;
  Widget build(BuildContext context) {
    super.build(context);
    return SafeArea(
          child: Scaffold(
            body: WebView(
            initialUrl: 'https://syncshop.online/en/login',
            javascriptMode: JavascriptMode.unrestricted,
            onWebViewCreated: (controller) {
              _myController = controller;
            },
          onPageFinished: (initialUrl) {
              _myController.evaluateJavascript("document.getElementsByClassName('footer-container')[0].style.display='none';");
          },
        ),
      ),
    );
  }
  @override
  bool get wantKeepAlive => true;
}

score 1 · Answer 1 · answered Dec 12 '19 at 03:32

1

make sure to use https instead of http or you can opt out your app to allow http traffic.

answered Dec 12 '19 at 03:32

hakim

3,819
3
21
25

im using ```https``` for all the links – KDC Dec 12 '19 at 06:37

score 1 · Accepted Answer · answered Dec 12 '19 at 04:04

1

it is an issue in API level 28 or higher. They disabled android:usesCleartextTraffic for security purposes. here you can find the solutions.

answered Dec 12 '19 at 04:04

Niraj

903
8
23

got it thanks. But do you have any idea how to fix my (2) problem ? Ive been searching for hours now and i cant seem to find the exact solution – KDC Dec 12 '19 at 05:56
I haven't used flutter much, but if you need help in the logical part(i.e. to handle flow), I can guide you. For that, I need detailed information about what exactly you want to do(code not needed). – Niraj Dec 13 '19 at 07:14
I fixed it :) my problerm right now is different can I pm you ? – KDC Dec 13 '19 at 07:16
you can ask here, it'll help someone else. – Niraj Dec 17 '19 at 04:00

How to update all WebView tabs when a login is detected?

2 Answers2