Cannot display HTML string

Question:

I am struggling with display string HTML in Android WebView.

On the server side, I downloaded a web page and escape HTML characters and quotes (I used Python):

my_string = html.escape(my_string, True)

On the Android client side: strings are unescaped by:

myString = StringEscapeUtils.unescapeHtml4(myString)
webview.loadData( myString, "text/html", "encoding");

However webview just display them as literal strings. Here are the result:

enter image description here

Edit: I add original string returned from server side:

"<!DOCTYPE html> <html
lang="en"> <head> <meta
charset="utf-8"> <meta
http-equiv="X-UA-Compatible"
content="IE=edge"> <meta
name="viewport"
content="width=device-width,
initial-scale=1.0"> <meta
name="description"
content="">
<title>Saulify</title> <!– All the
Favicons… –> <link rel="shortcut
icon"
href="/static/favicon/favicon.ico">
<link rel="apple-touch-icon"
sizes="57×57"
href="/static/favicon/apple-touch-icon-57×57.png">
<link rel="apple-touch-icon"
sizes="114×114"
href="/static/favicon/apple-touch-icon-114×114.png">
<link rel="apple-touch-icon"
sizes="72×72"
href="/static/favicon/apple-touch-icon-72×72.png">
<link rel="apple-touch-icon"
sizes="144×144"
href="/static/favicon/apple-touch-icon-144×144.png">
<link rel="apple-touch-icon"
sizes="60×60"
href="/static/favicon/apple-touch-icon-60×60.png">
<link rel="apple-touch-icon"
sizes="120×120"
href="/static/favicon/apple-touch-icon-120×120.png">
<link rel="apple-touch-icon"
sizes="76×76"
href="/static/favicon/apple-touch-icon-76×76.png">
<link rel="apple-touch-icon"
sizes="152×152"
href="/static/favicon/apple-touch-icon-152×152.png">
<link rel="apple-touch-icon"
sizes="180×180"
href="/static/favicon/apple-touch-icon-180×180.png">
<link rel="icon"
type="image/png"
href="/static/favicon/favicon-192×192.png"
sizes="192×192"> <link
rel="icon" type="image/png"
href="/static/favicon/favicon-160×160.png"
sizes="160×160"> <link
rel="icon" type="image/png"
href="/static/favicon/favicon-96×96.png"
sizes="96×96"> <link
rel="icon" type="image/png"
href="/static/favicon/favicon-16×16.png"
sizes="16×16"> <link
rel="icon" type="image/png"
href="/static/favicon/favicon-32×32.png"
sizes="32×32"> <meta
name="msapplication-TileColor"
content="#da532c"> <meta
name="msapplication-TileImage"
content="/static/favicon/mstile-144×144.png">
<meta name="msapplication-config"
content="/static/favicon/browserconfig.xml">
<!– External CSS –> <link
rel="stylesheet"
href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
<!– External Fonts –> <link
href="//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css"
rel="stylesheet"> <link
href='//fonts.googleapis.com/css?family=Open+Sans:300,600'
rel='stylesheet'
type='text/css'> <link
href='//fonts.googleapis.com/css?family=Lora:400,700'
rel='stylesheet'
type='text/css'> <!–[if lt IE
9]> <script
src="//cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7.2/html5shiv.min.js"></script>
<script
src="//cdnjs.cloudflare.com/ajax/libs/respond.js/1.4.2/respond.min.js"></script>
<![endif]–> <!– Site CSS –>
<link rel="stylesheet"
type="text/css"
href="/static/css/style.css"> <link
rel="stylesheet" type="text/css"
href="/static/css/glyphicon.css">
</head> <body> <div
class="container article-page"> <div
class="row"> <div
class="col-md-8 col-md-offset-2">
<h2><a
href="http://www.huffingtonpost.com/2015/03/22/ted-cruz-climate-change_n_6919002.html">Gov.
Jerry Brown Says Ted Cruz Is 'Absolutely
Unfit' To Run For Office Because Of Climate Change
Views</a></h2> <h4>Sam
Levine</h4> <div
class="article"> <p>California
Gov. Jerry Brown (D) said on Sunday that Texas Sen. Ted Cruz (R-Texas)
is "absolutely unfit to be running for office"
because of his position on climate change.</p>
<p>"I just came back from New Hampshire, where
there's snow and ice everywhere. My view on this is simple:
Debates on this should follow science and should follow data, and many
of the alarmists on global warming, they have a problem because the
science doesn't back them up," Cruz <a
href="https://www.youtube.com/watch?v=m0UJ_Sc0Udk">said</a>
on "Late Night with Seth Meyers" last
week.</p> <p>To back up his claim, Cruz
cited satellite data that has shown a lack of significant warming over
the last 17 years. But Cruz's reasoning <a
href="http://www.politifact.com/truth-o-meter/statements/2015/mar/20
/ted-cruz/ted-cruzs-worlds-fire-not-last-17-years/">has
been debunked by Politifact</a>, which has shown that
scientists have ample evidence to believe that the climate will
continue to warm.</p> <p>"What he
said is absolutely false,” Brown said on <a
href="http://www.nbcnews.com/meet-the-press/california-governor-ted-cruz-
unfit-be-running-n328046">NBC's
"Meet the Press."</a> He added that
<a
href="http://climate.nasa.gov/scientific-consensus/">over
90 percent</a> of scientists who study the climate agree
that climate change is caused by human activity. "That man
betokens such a level of ignorance and a direct falsification of
existing scientific data. It's shocking, and I think that man
has rendered himself absolutely unfit to be running for
office," Brown said.</p> <p>Brown
added that climate change has <a
href="http://www.huffingtonpost.com/2015/03/06/california-drought-february-
record_n_6820704.html?utm_hp_ref=california-drought">caused
droughts in his state</a>, as well as severe cold and
storms on the east coast.</p> <p>While
Cruz may have seen snow and ice everywhere in New Hampshire, data
shows that the country is actually experiencing a <a
href="http://www.huffingtonpost.com/2015/02/19/cold-weather-
winter_n_6713104.html">warmer than
average</a> winter.</p>
<p>Brown’s criticism of Cruz comes one day before the
Texas senator is set to announce a <a
href="http://www.huffingtonpost.com/2015/03/22
/ted-cruz-2016_n_6917824.html">presidential
campaign</a>. </p> </div>
<div class="original"> <a
href="http://www.huffingtonpost.com/2015/03/22/ted-cruz-climate-change_n_6919002.html">VIEW
ORIGINAL</a> </div> </div>
</div> </div> <script
src="//code.jquery.com/jquery-latest.js"></script>
<script
src="/static/js/modal.js"></script>
<script
src="/static/js/bootbox.min.js"></script>
<script
src="/static/js/site.js"></script> <script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new
Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','//www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-56257533-1',
'auto'); ga('send',
'pageview'); </script>
</body> </html>"

Asked By: Hoa Vu

||

Answers:

I have modified the code here:

public class test extends Activity {
    private WebView wv;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.test);
        wv = (WebView) findViewById(R.id.wv);
        String s = "<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="description" content=""> <title>Saulify</title> <!-- All the Favicons... --> <link rel="shortcut icon" href="/static/favicon/favicon.ico"> <link rel="apple-touch-icon" sizes="57x57" href="/static/favicon/apple-touch-icon-57x57.png"> <link rel="apple-touch-icon" sizes="114x114" href="/static/favicon/apple-touch-icon-114x114.png"> <link rel="apple-touch-icon" sizes="72x72" href="/static/favicon/apple-touch-icon-72x72.png"> <link rel="apple-touch-icon" sizes="144x144" href="/static/favicon/apple-touch-icon-144x144.png"> <link rel="apple-touch-icon" sizes="60x60" href="/static/favicon/apple-touch-icon-60x60.png"> <link rel="apple-touch-icon" sizes="120x120" href="/static/favicon/apple-touch-icon-120x120.png"> <link rel="apple-touch-icon" sizes="76x76" href="/static/favicon/apple-touch-icon-76x76.png"> <link rel="apple-touch-icon" sizes="152x152" href="/static/favicon/apple-touch-icon-152x152.png"> <link rel="apple-touch-icon" sizes="180x180" href="/static/favicon/apple-touch-icon-180x180.png"> <link rel="icon" type="image/png" href="/static/favicon/favicon-192x192.png" sizes="192x192"> <link rel="icon" type="image/png" href="/static/favicon/favicon-160x160.png" sizes="160x160"> <link rel="icon" type="image/png" href="/static/favicon/favicon-96x96.png" sizes="96x96"> <link rel="icon" type="image/png" href="/static/favicon/favicon-16x16.png" sizes="16x16"> <link rel="icon" type="image/png" href="/static/favicon/favicon-32x32.png" sizes="32x32"> <meta name="msapplication-TileColor" content="#da532c"> <meta name="msapplication-TileImage" content="/static/favicon/mstile-144x144.png"> <meta name="msapplication-config" content="/static/favicon/browserconfig.xml"> <!-- External CSS --> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css"> <!-- External Fonts --> <link href="//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet"> <link href='//fonts.googleapis.com/css?family=Open+Sans:300,600' rel='stylesheet' type='text/css'> <link href='//fonts.googleapis.com/css?family=Lora:400,700' rel='stylesheet' type='text/css'> <!--[if lt IE 9]> <script src="//cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7.2/html5shiv.min.js"></script> <script src="//cdnjs.cloudflare.com/ajax/libs/respond.js/1.4.2/respond.min.js"></script> <![endif]--> <!-- Site CSS --> <link rel="stylesheet" type="text/css" href="/static/css/style.css"> <link rel="stylesheet" type="text/css" href="/static/css/glyphicon.css"> </head> <body> <div class="container article-page"> <div class="row"> <div class="col-md-8 col-md-offset-2"> <h2><a href="http://www.huffingtonpost.com/2015/03/22/ted-cruz-climate-change_n_6919002.html">Gov. Jerry Brown Says Ted Cruz Is 'Absolutely Unfit' To Run For Office Because Of Climate Change Views</a></h2> <h4>Sam Levine</h4> <div class="article"> <p>California Gov. Jerry Brown (D) said on Sunday that Texas Sen. Ted Cruz (R-Texas) is "absolutely unfit to be running for office" because of his position on climate change.</p> <p>"I just came back from New Hampshire, where there's snow and ice everywhere. My view on this is simple: Debates on this should follow science and should follow data, and many of the alarmists on global warming, they have a problem because the science doesn't back them up," Cruz <a href="https://www.youtube.com/watch?v=m0UJ_Sc0Udk">said</a> on "Late Night with Seth Meyers" last week.</p> <p>To back up his claim, Cruz cited satellite data that has shown a lack of significant warming over the last 17 years. But Cruz's reasoning <a href="http://www.politifact.com/truth-o-meter/statements/2015/mar/20 /ted-cruz/ted-cruzs-worlds-fire-not-last-17-years/">has been debunked by Politifact</a>, which has shown that scientists have ample evidence to believe that the climate will continue to warm.</p> <p>"What he said is absolutely false,” Brown said on <a href="http://www.nbcnews.com/meet-the-press/california-governor-ted-cruz- unfit-be-running-n328046">NBC's "Meet the Press."</a> He added that <a href="http://climate.nasa.gov/scientific-consensus/">over 90 percent</a> of scientists who study the climate agree that climate change is caused by human activity. "That man betokens such a level of ignorance and a direct falsification of existing scientific data. It's shocking, and I think that man has rendered himself absolutely unfit to be running for office," Brown said.</p> <p>Brown added that climate change has <a href="http://www.huffingtonpost.com/2015/03/06/california-drought-february- record_n_6820704.html?utm_hp_ref=california-drought">caused droughts in his state</a>, as well as severe cold and storms on the east coast.</p> <p>While Cruz may have seen snow and ice everywhere in New Hampshire, data shows that the country is actually experiencing a <a href="http://www.huffingtonpost.com/2015/02/19/cold-weather- winter_n_6713104.html">warmer than average</a> winter.</p> <p>Brown’s criticism of Cruz comes one day before the Texas senator is set to announce a <a href="http://www.huffingtonpost.com/2015/03/22 /ted-cruz-2016_n_6917824.html">presidential campaign</a>. </p> </div> <div class="original"> <a href="http://www.huffingtonpost.com/2015/03/22/ted-cruz-climate-change_n_6919002.html">VIEW ORIGINAL</a> </div> </div> </div> </div> <script src="//code.jquery.com/jquery-latest.js"></script> <script src="/static/js/modal.js"></script> <script src="/static/js/bootbox.min.js"></script> <script src="/static/js/site.js"></script> <script> (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o), m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m) })(window,document,'script','//www.google-analytics.com/analytics.js','ga'); ga('create', 'UA-56257533-1', 'auto'); ga('send', 'pageview'); </script> </body> </html>";


        wv.loadData(stripHtml(s), "text/html", "UTF-8");

    }

    public String stripHtml(String html) {
        return Html.fromHtml(html).toString();
    }

}

enter image description here

Answered By: MrDumb

Try this:

wv = (WebView) findViewById(R.id.wv);
String s = "You HTML string";
wv.loadData(stripHtml(s), "text/html", "UTF-8");

public String stripHtml(String html) {
    return Html.fromHtml(html).toString();
}
Answered By: user6139219

Try this code,

if (android.os.Build.VERSION.SDK_INT >= android.os.Build.VERSION_CODES.N){
   yourtextview.setText(Html.fromHtml(yourstring,Html.FROM_HTML_MODE_LEGACY));
}
else {
   yourtextview.setText(Html.fromHtml(yourstring));
}
Answered By: feri
Categories: questions Tags: , , ,
Answers are sorted by their score. The answer accepted by the question owner as the best is marked with
at the top-right corner.