WebBrowser captures the verification code image on the webpage

Introduction

I recently discussed with a friend how to obtain a verification image on the Web page accessed by WebBrowser. The first thought was to directly download the verification code image referenced on the current page through WebClient, however, this involves some problems: first, the verification code may change during each request, and second, it is very difficult to associate the WebClient with the Cookies or even sessions of WebBrowser.

Then I thought that I could give up WebBrowser and always use WebRequest for lower-layer access to avoid the inconsistency caused by multiple changes to the obtained verification code, however, this method is still complicated.

Then I thought of this work ing method-screenshot. You only need to directly use WebBrowser and crop out the part other than the verification code.

Ideas

First, analyze the image element features that the friend wants to obtain:

URL: http://www.jcard.cn/Charge/UCardDirectCharge.aspx? Category = AAWYVVWYKV & product = AAWYVVWYKV010CV

This is simple. We only need to find the image ending with the src attribute "RandomImage. aspx" and find the element we need.

After finding this element, we need to assign it an inline style to keep it in the absolute upper left corner of the page to help determine its position and ensure that it does not go beyond the WebBrowser visible range, and set the z-index to 9999 to avoid being overwritten by other elements. This style is:

"Position: absolute; z-index: 9999; top: 0px; left: 0px"

After that, you can use the DrawToBitmap method of WebBrowser. The width and height can be obtained through the ClientRectangle attribute of the preceding element.

Implementation

Now, create a WinForm project for testing and design the following interface:

Then write the event processing function for the button:

Privatevoid button#click (object sender, EventArgs e)

{

Var wb = newWebBrowser ();

Wb. Navigate ("http://www.jcard.cn/Charge/UCardDirectCharge.aspx? Category = AAWYVVWYKV & product = AAWYVVWYKV010CV ");

// Wait until loading is complete

While (wb. ReadyState

// Traverse to find the element where the verification image is located

Foreach (HtmlElement f in wb. Document. Images)

{

If (f. GetAttribute ("src"). ToLower (). EndsWith ("randomimage. aspx "))

{

// Locate the element to the upper left corner of the page

F. Style = "position: absolute; z-index: 9999; top: 0px; left: 0px ";

// Capture images

Var B = newBitmap (f. ClientRectangle. Width, f. ClientRectangle. Height );

Wb. DrawToBitmap (B, newRectangle (newPoint (), f. ClientRectangle. Size ));

PictureBox1.Image = B;

Break;

}

}

}

Compile and run to test:

Click the button and wait a moment to display the complete verification code image in PictureBox.

Prompt

The DrawToBitmap method of WebBrowser is hidden and not supported by smart sensing prompts. I don't know why, but I know that the DrawToBitmap method does have a problem, that is, it is completely white. According to my observation, this is related to whether the WebBrowser control is displayed. As long as the WebBrowser control is displayed on the form, it is completely white. If the WebBrowser is not loaded to the form, it is normal. The specific reason is unknown, I can only sigh again that the powerful control WebBrowser is too crude.