Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How can Android write a value onto HTML5 localstorage?

I have a webview android application which opens a web page containing some HTML5/ JavaScript code. I want to pass some values from the android side of my application to the browser side. So I thought to write onto HTML5 localstorage from Android and then the Javascript part of the web page reads the value from the localstorage.

How can Android webview write onto the HTML5 localstorage?

Or is there at all a way the android can pass some values to javascript of the page it loads? ( without having to reload the entire page) Say writing something onto HTML5 localstorage and then the javascript code reads that thing from HTML5 localstorage

its different from how to pass json formatted data from a webview to a html page. I need a way of writing onto HTML5 localstorage by android

like image 703
Waterfr Villa Avatar asked May 18 '17 17:05

Waterfr Villa


2 Answers

Pass variables like a string stackoverflow post:

   webView.getSettings().setJavaScriptEnabled(true);
   webView.setWebViewClient(new WebViewClient() {
            @Override
            public void onPageFinished(WebView view, String url) {
               String key = "hello";
               String val = "world";
               if (android.os.Build.VERSION.SDK_INT >= android.os.Build.VERSION_CODES.KITKAT) {
                   webView.evaluateJavascript("localStorage.setItem('"+ key +"','"+ val +"');", null);
               } else {
                   webView.loadUrl("javascript:localStorage.setItem('"+ key +"','"+ val +"');");
               }
            }
   });

The second variant is to use JavaScriptInterface

Init section

 JavaScriptInterface jsInterface = new JavaScriptInterface(this);
 webView.getSettings().setJavaScriptEnabled(true);
 webView.addJavascriptInterface(jsInterface, "JSInterface");

JavaScriptInterface

  public class JavaScriptInterface {
        private Activity activity;

        public JavaScriptInterface(Activity activiy) {
            this.activity = activiy;
        }

        public string getData(String someParameter){
           //also you can return json data as string  and at client side do JSON.parse
           if (someParameter == "give me data" && this.activity.data) {
                return this.activity.data;
           }else{
                return null;
           }
        }
    }

Js section

<script>
  function ready() {
        var data = window.JSInterface.getData("give me data");
        localStorage.put("give me data", data)
  };

  document.addEventListener("DOMContentLoaded", ready);
</script>
like image 169
Alex Nikulin Avatar answered Nov 19 '22 01:11

Alex Nikulin


How can Android webview write onto the HTML5 localstorage?

   localStorage.setItem("data", value);

Note: With local storage, web applications can store data locally within the user's browser. HTML local storage; better than cookies.
Try addJavaScriptInterface() to bind your android class and webpage.

like image 33
paulcab Avatar answered Nov 19 '22 02:11

paulcab