WebView in Android app does not load images

Question

So I looked everywhere before I asked and I couldn't get loading images to work

I have a little app that's supposed to check if my server is online or not by loading a image from it. It works via html and javascript

Html code

<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
    <meta name="description" content="Android Check" />
    <link href="https://fonts.googleapis.com/css?family=Quicksand&display=swap" rel="stylesheet">

    <title>Server Monitoring</title>

    <link rel="stylesheet" type="text/css" href="css/style.css" />
    <script src="main.js"></script>
</head>

<body>
    <div class=contents>
        <div style='margin:auto;'>
            <span class=content_text id=textbox style="font-family: 'Quicksand';">Server Monitoring</span>
        </div>
    </div>
         <div class="status">
           <p style="font-family: 'Quicksand';" id="check"><img src="servericon.png" height="60px" width="60px" align="middle"> Status: Checking Status...</p>
         </div>

</body>

</html>

Java-script code


window.onload = function () {


function ifServerOnline(ifOnline, ifOffline)
{
    var img = document.body.appendChild(document.createElement("img"));
    img.onload = function()
    {
        ifOnline && ifOnline.constructor == Function && ifOnline();
    };
    img.onerror = function()
    {
        ifOffline && ifOffline.constructor == Function && ifOffline();
    };
    img.src = "http://myurl.com/img.jpg";
}

ifServerOnline(function()
{
    document.getElementById("check").innerHTML = "Status: Online!";
},
function ()
{
    document.getElementById("check").innerHTML = "Status: Offline!";
});
};

I tried this so far

package com.highgames.svmngm;

import androidx.appcompat.app.AppCompatActivity;

import android.webkit.WebSettings;
import android.webkit.WebView;
import android.os.Bundle;



public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        WebView webView = (WebView)findViewById(R.id.webView);
        webView.loadUrl("file:///android_asset/index.html");
        WebSettings webSettings = webView.getSettings();
        webView.getSettings().setJavaScriptEnabled(true);
        webSettings.setDomStorageEnabled(true);
        webSettings.setAppCacheEnabled(true);
        webSettings.setLoadsImagesAutomatically(true);
        webView.getSettings().setMixedContentMode(WebSettings.MIXED_CONTENT_ALWAYS_ALLOW);

    }
}

I don`t know why but it doesn't show the local image neither the url image and I can't figure it out how to make it work

Can anyone help me?

All device has an error? – Cuong Nguyen Dec 21 '19 at 02:44 — Cuong Nguyen, Dec 21 '19 at 02:44

Ryan M · Answer 1 · 2019-12-22T00:06:00.123

0

You need to change the settings before loading the URL - that is, move webView.loadUrl("file:///android_asset/index.html"); to the end of your onCreate method.

It looks like your URL is an http:// (unencrypted) URL - you may also need to enable cleartext HTTP traffic or enable HTTPS on your server.

edited Dec 22 '19 at 00:06

answered Dec 20 '19 at 23:02

Ryan M

18,333
31
67
74

Nope, still offline – cygnushg Dec 21 '19 at 15:16
You may also need to [enable cleartext HTTP traffic](https://stackoverflow.com/questions/45940861/android-8-cleartext-http-traffic-not-permitted) or enable HTTPS on your server. – Ryan M Dec 22 '19 at 00:05

WebView in Android app does not load images

1 Answers1