Android Question Downloading an Image from WebView

Dysanix

New Member
Dear B4A Community,

First of all I'd like to thank you all A LOT for all the help you've been to me. I learned a lot in a very small time! Great tutorials and content for people who are just starting out. :)

Now let's get to the point: I trying to port a program I made on the PC, to Android.
This is the code from Visual Basic:

B4X:
Private Sub WebBrowser1_DocumentCompleted(ByVal sender As System.Object, ByVal e As System.Windows.Forms.WebBrowserDocumentCompletedEventArgs) Handles WebBrowser1.DocumentCompleted
    Try
       Dim htmlDocument As HtmlDocument = Me.WebBrowser1.Document
       Dim htmlElementCollection As HtmlElementCollection = htmlDocument.Images
       Dim ImagesFound As Integer = 0
       For Each htmlElement As HtmlElement In htmlElementCollection
          Dim imgUrl As String = htmlElement.GetAttribute("src")
          If imgUrl.Contains("imgur") Then
             ImagesFound += 1
             Select Case ImagesFound
                Case 1
                   PictureBox1.ImageLocation = imgUrl
            End Select
          End If
       Next
    Catch ex As Exception
    End Try
End Sub

Basically what it does, is download the source code of a page, checks for the image that matches "imgur" and downloads that image. Then the image is shown in a PictureBox.

The reason it needs to be done like this, is because the URL of the image will change every time, so I can't just hardcode the URLs.

I've tried loads of things with HttpUtils2 and ImageDownloader, but I just can't figure it out. I don't have any code to show you because I just erase code and try all over again if it faisl and I have nothing which comes near working.

If someone could please direct me to the right path, I'd GREATLY appreciate it. :)
Showing the image in a WebView is good too, because it allows zooming by default.

Thanks in advance,
Dysanix

EDIT: Even if this isn't possible with the free Trail version, I'd still like the answer for when I buy the program or when other people need help with the same problem! :)
 
Last edited:

Dysanix

New Member
You need to first download the html page. Then parse it and find the image link and download the image.

It is similar to the FlickrViewer example: https://www.b4x.com/android/forum/t...ple-way-to-download-images.30875/#post-179524
I am getting this error:
B4X:
<!DOCTYPE html>


<!--[if lt IE 7]> <html class="no-js ie6 oldie" lang="en-US"> <![endif]-->
<!--[if IE 7]>  <html class="no-js ie7 oldie" lang="en-US"> <![endif]-->
<!--[if IE 8]>  <html class="no-js ie8 oldie" lang="en-US"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js" lang="en-US"> <!--<![endif]-->
<head>
<title>Attention Required! | CloudFlare</title>
<meta charset="UTF-8" />
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1" />


<meta name="robots" content="noindex, nofollow" />
<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1" />
<link rel="stylesheet" id="cf_styles-css" href="/cdn-cgi/styles/cf.errors.css" type="text/css" media="screen,projection" />
<!--[if lt IE 9]><link rel="stylesheet" id='cf_styles-ie-css' href="/cdn-cgi/styles/cf.errors.ie.css" type="text/css" media="screen,projection" /><![endif]-->
<style type="text/css">body{margin:0;padding:0}</style>
<!--[if lte IE 9]><script type="text/javascript" src="/cdn-cgi/scripts/jquery.min.js"></script><![endif]-->
<!--[if gte IE 10]><!--><script type="text/javascript" src="/cdn-cgi/scripts/zepto.min.js"></script><!--<![endif]-->
<script type="text/javascript" src="/cdn-cgi/scripts/cf.common.js"></script>


</head>
<body>
  <div id="cf-wrapper">
  <div class="cf-alert cf-alert-error cf-cookie-error" id="cookie-alert" data-translate="enable_cookies">Please enable cookies.</div>
  <div id="cf-error-details" class="cf-error-details-wrapper">
  <div class="cf-wrapper cf-header cf-error-overview">
  <h1 data-translate="challenge_headline">One more step</h1>
  <h2 class="cf-subheadline"><span data-translate="complete_sec_check">Please complete the security check to access</span></h2>
  </div><!-- /.header -->

  <div class="cf-section cf-highlight cf-captcha-container">
  <div class="cf-wrapper">
  <div class="cf-columns two">
  <div class="cf-column">
  <div class="cf-highlight-inverse cf-form-stacked">
  <form class="challenge-form" id="challenge-form" action="/591637?__cf_waf_tk__=089622002Yp_edPqIicreNlOhQzqOzrHUptQ" method="post" enctype="application/x-www-form-urlencoded">
<script type="text/javascript" src="/cdn-cgi/scripts/cf.challenge.js" data-type="normal"  data-ray="22ddbf722f432b76" async></script>
<noscript id="cf-captcha-bookmark" class="cf-captcha-info">
  <iframe src="//www.google.com/recaptcha/api/noscript?k=6LeT6gcAAAAAAAZ_yDmTMqPH57dJQZdQcu6VFqog" height="300" width="500" frameborder="0"></iframe>
  <input type="hidden" name="recaptcha_response_field" value="manual_challenge">
  <label for="manual_recaptcha_challenge_field">Enter confirmation code after solving challenge above</label>
  <textarea id="manual_recaptcha_challenge_field" name="recaptcha_challenge_field" rows="3" cols="40"></textarea>
  <button type="submit" class="cf-btn cf-btn-accept"><span data-translate="submit">Submit</span></button>
</noscript>
</form>

  </div>
  </div>

  <div class="cf-column">
  <div class="cf-screenshot-container">
 
  <span class="cf-no-screenshot"></span>
 
  </div>
  </div>
  </div><!-- /.columns -->
  </div>
  </div><!-- /.captcha-container -->

  <div class="cf-section cf-wrapper">
  <div class="cf-columns two">
  <div class="cf-column">
  <h2 data-translate="why_captcha_headline">Why do I have to complete a CAPTCHA?</h2>

  <p data-translate="why_captcha_detail">Completing the CAPTCHA proves you are a human and gives you temporary access to the web property.</p>
  </div>

  <div class="cf-column">
  <h2 data-translate="resolve_captcha_headline">What can I do to prevent this in the future?</h2>

  <p data-translate="resolve_captcha_antivirus">If you are on a personal connection, like at home, you can run an anti-virus scan o
Message longer than Log limit (4000). Message was truncated.

It's a CloudFlare captcha error, but that's odd because I've never had that ever on that website using my Visual Basic script, even when I put it on automatic mode and making it get random URL's every second...

Do you know how this is caused and how I can circumvent this? It seems to do with cookies missing, so it might be better if I grab them directly from a webview like with my PC script? But I wouldn't know how to go around doing that.

Update: The odd thing, is that if I go to proxfree.com and visit the site, with cookies turned off and script remover turned on, I can still access the site with ease. I'm really not sure where this is coming from... Since you wrote the script, perhaps you know the answer?
 
Last edited:
Upvote 0

Dysanix

New Member
I've been trying really hard to recreate the code from PC onto my Android device, but nothing seems to work.. but surely it can't be this hard? I feel like I'm overlooking something, maybe a library or something. Someone guide me in the right direction with this please, I feel lost.

All I need to do is go to a random URL, find the imgur URL from the source code and display the imgur image to the end user.

This sounds really easy, but I can't figure this out for Android..
 
Last edited:
Upvote 0

Mark Read

Well-Known Member
Licensed User
Longtime User
I have a small project which may help. Adding a user header as Erel said was the only way to get the HTML out of the webpage. I now have the problem of parsing the html to get the image info. The html is very long and all on one line! I cannot see the whole text in the log as it is truncated. If you wish, I can upload my project as is later tonight.
 
Upvote 0

Dysanix

New Member
I have a small project which may help. Adding a user header as Erel said was the only way to get the HTML out of the webpage. I now have the problem of parsing the html to get the image info. The html is very long and all on one line! I cannot see the whole text in the log as it is truncated. If you wish, I can upload my project as is later tonight.
I already solved my issue. :) I came across the same issue, but I noticed it was an error in my Regex.Matcher code which I solved too!
I used code of the Flickr Viewer as a reference and it was of great help!
 
Upvote 0
Top