Android Webview not loading javascript injected images

Question

I have the following application:

From start the webview is created and will load a local (to the app) HTML file. This local HTML file contains some javascript that is able to update the HTML when data parsed to it.

Only when i parse data to it the images will not load, however a am able to see the HTML change and see the correct img tags appear with the correct URL's. I tested the javascript and the data that i send to it in the browser and it works.

My app:

private static final String URL = "file:///android_asset/overview.html";
private WebView wView;

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);
    Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
    setSupportActionBar(toolbar);

    //Set settings
    wView = (WebView) findViewById(R.id.webView);
    wView.getSettings().setJavaScriptEnabled(true);
    wView.getSettings().setUseWideViewPort(true);
    wView.getSettings().setJavaScriptCanOpenWindowsAutomatically(true);
    wView.getSettings().setCacheMode(WebSettings.LOAD_NO_CACHE);

    //TMP DEBUDDING
    wView.setWebContentsDebuggingEnabled(true);

    //Create interface  called "AppBridge" for JavaScript
    wView.addJavascriptInterface(new WebAppInterface(this), "AppBridge");

    wView.setWebViewClient(new WebViewClient() {
        @Override
        public void onPageFinished(WebView view, String url) {
            super.onPageFinished(view, url);
            view.loadUrl("javascript:testInject('Hello World');");
            view.loadUrl("javascript:updateOverview(SOME DATA);");
        }
        @Override
        public void onLoadResource (WebView view, String url) {
            Log.v(TAG, "Webview load Resouce " + url);
        }
    });

    wView.setWebChromeClient(new WebChromeClient() {
        @Override
        public boolean onJsAlert(WebView view, String url, String message, JsResult result) {
            Log.d(TAG, message);
            return true;
        }
    });

    wView.loadUrl(URL);

Does anyone have an idea what is prohibiting the webview from loading my injected html images.

---- UPDATE ---- Some extra testing, when adding the img tag manually to the html the image is loaded and then when adding it again trough javascript it is shown. But only the same image is show all others are still not loaded.

Have you tried using content://your.app.name/ pattern for additional files? But for files that are bundled in your apk, you must use relative paths. In the example you give, you are using an absolute path, which almost certainly will be denied permission. — coladict
– coladict, Commented Dec 22, 2015 at 14:24

Msmit1993 · Accepted Answer · 2015-12-23 08:09:53Z

1

After about 8 hours of testing , debugging and head bashing. I found the solution.

Inspired by the following article http://artemzin.com/blog/android-webview-io/

By overriding shouldInterceptRequest the WebView wil load the images.

 wView.setWebViewClient(new WebViewClient() {
        @Override
        public void onPageFinished(WebView view, String url) {
            super.onPageFinished(view, url);
            view.loadUrl("javascript:testInject('Hello World');");
            view.loadUrl("javascript:updateOverview("SOME DATA");
        }

        @Override
        public WebResourceResponse shouldInterceptRequest(WebView view, WebResourceRequest request) {
            return super.shouldInterceptRequest(view, request);
        }

    });

answered Dec 23, 2015 at 8:09

Msmit1993

1,7404 gold badges21 silver badges35 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Android Webview not loading javascript injected images

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related