Issues in loading Angular JS website in Android Webview

Question

Hi EveryOne I am trying to load GTV into Android WebView.It loads in Mobile browser quite well but not in webview. Here is my Code.

  WebView theWebPage  = new WebView(this);
    theWebPage.getSettings().setJavaScriptEnabled(true);

    theWebPage.getSettings().setPluginState(WebSettings.PluginState.ON);
    super.onCreate(savedInstanceState);
    getSupportActionBar().hide();
    setContentView(theWebPage);
    WebViewClient client = new WebViewClient() {
        @Override
        public boolean shouldOverrideUrlLoading(WebView view, String url) {
            view.loadUrl(url);
            return false;
        }
    };
    theWebPage.setWebViewClient(client);

// client.onPageStarted(theWebPage);

    theWebPage.loadUrl("http://gtvqa.com/#!/");

Have a look at http://developer.android.com/guide/webapps/debugging.html — F43nd1r, Feb 16 '16 at 21:23

score 17 · Answer 1 · answered Sep 06 '18 at 15:44

17

I found this function helpful

this.webView.getSettings().setDomStorageEnabled(true);

answered Sep 06 '18 at 15:44

Zohar Revivo

485
1
7
18

3

Welcome to SO! When posting code as solutions, it is helpful to explain how your code solves OP's problem :) – Joel Sep 06 '18 at 16:02
1

I had the same issue. I tried to wrap a web application based on AngularJs with webView in android studio. When I tried to log in nothing happened. After putting this line of code the application worked like magic within webView :) – Zohar Revivo Sep 06 '18 at 16:12
2

This solved my issues. – Warpzit May 30 '22 at 09:09

score 8 · Accepted Answer · answered Feb 16 '16 at 21:43

8

AngularJS requires an HTML5-compliant browser and I don't think that the default Android WebView is. Unless you are the developer of that website and can add modernizer to the page to attempt to account for older, non-compliant browsers, you might not be able to solve this.

answered Feb 16 '16 at 21:43

MBielski

6,628
3
32
43

Ofcource I can add.By mordenizer do you mean modernizer.js ? I'll add and see. – Muhammad Ali Feb 17 '16 at 07:13
2

I found another way to enable HTML5 in [Enable HTML5 in WebView](http://stackoverflow.com/questions/10599739/does-android-webview-browsers-support-html5-features). By The way you identified the real problem.Thanks @mbielski – Muhammad Ali Feb 17 '16 at 07:32
2

Yes, that is what I meant (modernizer.js) but glad you found a better solution to the problem. – MBielski Feb 17 '16 at 18:05
I was looking for the reason why my angular 9 was not starting as expected. You saved me! Thanks! – Brijesh Lakkad Oct 31 '20 at 16:11

score 1 · Answer 3 · answered Jul 04 '18 at 05:58

By default android webview doesn't support HTML5 features, therefore sometimes there are issues with a AngularJS site.

You have to enable the HTML5 in webview to solve that issue.

Follow this method, you will be fine.

private void initWebView(View view) {
    webView=findViewById(R.id.webView);
    loadWebViewDatafinal(webView, webURL);
}

private void loadWebViewDatafinal(WebView wv, String url) {
        WebSettings ws=wv.getSettings();

        ws.setJavaScriptEnabled(true);
        ws.setAllowFileAccess(true);


        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.ECLAIR) {
            try {
                Log.e("WEB_VIEW_JS", "Enabling HTML5-Features");
                Method m1=WebSettings.class.getMethod("setDomStorageEnabled", new Class[]{Boolean.TYPE});
                m1.invoke(ws, Boolean.TRUE);

                Method m2=WebSettings.class.getMethod("setDatabaseEnabled", new Class[]{Boolean.TYPE});
                m2.invoke(ws, Boolean.TRUE);

                Method m3=WebSettings.class.getMethod("setDatabasePath", new Class[]{String.class});
                m3.invoke(ws, "/data/data/" + getActivity().getPackageName() + "/databases/");

                Method m4=WebSettings.class.getMethod("setAppCacheMaxSize", new Class[]{Long.TYPE});
                m4.invoke(ws, 1024 * 1024 * 8);

                Method m5=WebSettings.class.getMethod("setAppCachePath", new Class[]{String.class});
                m5.invoke(ws, "/data/data/" + getActivity().getPackageName() + "/cache/");

                Method m6=WebSettings.class.getMethod("setAppCacheEnabled", new Class[]{Boolean.TYPE});
                m6.invoke(ws, Boolean.TRUE);

                Log.e("WEB_VIEW_JS", "Enabled HTML5-Features");
            } catch (NoSuchMethodException e) {
                Log.e("WEB_VIEW_JS", "Reflection fail", e);
            } catch (InvocationTargetException e) {
                Log.e("WEB_VIEW_JS", "Reflection fail", e);
            } catch (IllegalAccessException e) {
                Log.e("WEB_VIEW_JS", "Reflection fail", e);
            }
        }

        wv.loadUrl(url);
    }

score -1 · Answer 4 · edited Sep 06 '18 at 18:23

-1

Just in case someone is wondering wants a c# answer,

webView.Settings.JavaScriptEnabled = true;

This one line saved my life.

edited Sep 06 '18 at 18:23

MarianD

13,096
12
42
54

answered Aug 03 '18 at 05:26

Pari Prakash

121
1
7

Add explanation to your code and format it correctly. – Michał Turczyn Aug 03 '18 at 05:47
My android webview was unable to load an angular website. After trying a lot of unsuccessful fixes, adding this line to my initialized webview worked and the website loaded perfectly: `webView.Settings.JavaScriptEnabled = true;` – Pari Prakash Sep 04 '18 at 12:55

Issues in loading Angular JS website in Android Webview

4 Answers4

Linked