Subir imagen con WebBrowser

Darkwizz · 18 Junio 2015, 14:42 PM

Hola, estaba intentando rellenar un formulario por internet con WebBrowser, pero dentro de éste hay una parte que me pide subir imágenes y se abre un cuadro de exploración en mi PC para seleccionar las que quiero subir, quería saber si existe alguna forma de poder hacer esto usando WebBrowser.

El link de la página es: http://www2.yapo.cl/ai/form/7?ca=15_s y en caso de que fuera imposible, habrá alguna forma de hacer que ese cuadro se abra y pueda manualmente seleccionar las imágenes?

Gracias por el tiempo y buena voluntad.

okik · 18 Junio 2015, 21:14 PM

Yo creo que este cuadro debe ser alguna aplicación html, un script o algo así que se crea con la página y no cosa del navegador. Es decir que se debe de hacer en creación de páginas web y no con un control como el webbrowser, ya que el webbrowser es sólo una herramienta para visualizar páginas web e interactuar con ellas, como obtener el código de la misma y datos, valores o logear

Abre el Notepad (en windows) y mete este código. Luego lo guardas con extensión HTML:

Código (html4strict) [Seleccionar]


<html> 
<head> 
<title>intento de msg box</title> 
<STYLE type="text/css"> 
#mantonegro{ 
display:none; 
position:absolute; 
top:0; 
left:0; 
background-color: #000000; 
width:2000; 
height:3000; 
filter:alpha(opacity=72); 
z-index:0; 
} 
#dthing{ 
display:none; 
position:absolute; 
top:70; 
left:120; 
background-color: #CAE0F0; 
z-index:0; 
} 
</STYLE> 

</head> 
<body onload='alert("bienvenidos a Mi Web, dejen su comentario");'>
<h1>TITULO</h1> 
<br> 
</div> 


</body> 
</html>

Al poner esto :
<body onload='alert("bienvenidos a Mi Web, dejen su comentario");'>

se muestra un cuadro de mensaje

Pues el cuadro que tu nombras debe de conseguirse con código html o complementos del mismo. Dicho cuadro envía la imagen a algún disco duro en alguna parte para ser usado por el servidor.

No se, pregunta en Desarrollo web, a ver
http://foro.elhacker.net/desarrollo_web-b7.0/

Darkwizz · 18 Junio 2015, 21:57 PM

Disculpa, soy medio nuevo en esto y no te entendí muy bien, me dices que para poder hacerle click al botón de subir imagen y que se me abra el cuadro de diálogo para buscar la ubicación, tengo que desarrollar un cuadro yo?.

No habría alguna forma de hacerle click a ese botón mediante el programa, porque cuando tengo cargado el WebBrowser y manualmente hago click carga sin problema.

Gracias por tu tiempo

okik · 19 Junio 2015, 00:18 AM

Perdona, entendí mal, pensaba que querías hacer el cuadro tu mismo $:-\$

Lo que tu quieres lo suelen llamar 'loguear una web'. Consiste en automatizar una serie de acciones como rellenar cuadros de contraseñas y hacer clics en botones y checkboxs.

Debes obtener el código de la página para obtener el ID del control de la páginas que quieres "atacar". Puedes hacerlo mediante código, en plan complicado o simplemente entras con tu navegador habitual y pulsas con le botón derecho del ratón en cualquier lugar y cuando salga el menú emergente selecciona "Ver código fuente". Luego buscas el ID o el Valor del control con el que quieras interactuar con el.

Del link que has facilitado he sacado esto que hace referencia a los botones de aquí se saca la información para poder hacer referencia a los botones y otros controles desde nuestro programa.

Código (html4strict) [Seleccionar]

<!-- BEGIN SUBMIT FORM -->
			<div class="footer-ai">
				<input id="submit_preview" class="btn btn-primary visualize" name="validate" type="submit" value="Vista previa">
				<input id="submit_create_now" class="btn btn-primary publish_now" name="create" type="submit" value="Publicar ahora">
			</div>
			<!-- END SUBMIT FORM -->

Ahora, una vez encontrada la información en VB.NET mete el siguiente código (el de arriba no, el de abajo), que como verás para hacer referencia al botón 'Publicar ahora' he usado el valor '"Publicar ahora':

Crea dos botones y un control Webbrowser

Código (vbnet) [Seleccionar]

Public Class Form1


    Private Sub Form1_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
        WebBrowser1.Navigate("http://www2.yapo.cl/ai/form/7?ca=15_s")
    End Sub

    Private Sub Button1_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Button1.Click

        'Marca el checkbox "[x]Estoy de acuerdo con los Términos y Condiciones"
        Dim theElementCollection As HtmlElementCollection = WebBrowser1.Document.GetElementsByTagName("Input")

        '<input class="ipt_checkbox" id="accept_conditions" name="ai_accept_conditions"  type="checkbox">  
        theElementCollection = WebBrowser1.Document.GetElementsByTagName("Input")
        For Each curElement As HtmlElement In theElementCollection
            Dim controlName As String = curElement.GetAttribute("id").ToString
            If controlName = "accept_conditions" Then
                curElement.SetAttribute("checked", "1")
            End If
        Next
    End Sub

    Private Sub Button2_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Button2.Click
        Dim theElementCollection As HtmlElementCollection = WebBrowser1.Document.GetElementsByTagName("Input")

        ' Simula el clic en el botón
        '<input id="submit_create_now" class="btn btn-primary publish_now" name="create" type="submit" value="Publicar ahora">
        theElementCollection = WebBrowser1.Document.GetElementsByTagName("Input")
        For Each curElement As HtmlElement In theElementCollection
            If curElement.GetAttribute("value").Equals("Publicar ahora") Then
                curElement.InvokeMember("click")
                'javascript has a click method for we need to invoke on the current submit button element.  
            End If
        Next
    End Sub
End Class

- La línea de código html de la página que hace referencia al checkbox de aceptar las condiciones es:

Código (html4strict) [Seleccionar]

<input class="ipt_checkbox" id="accept_conditions" name="ai_accept_conditions" type="checkbox">

Para activarlo he necesitado el ID = accept_conditions

Y se activa al pulsar el button1.

La línea de código html de la página que hace referencia al botón "Publicar Ahora" es:

Código (html4strict) [Seleccionar]

        '<input id="submit_create_now" class="btn btn-primary publish_now" name="create" type="submit" value="Publicar ahora">

He necesitado el valor "Publicar ahora" para accionarlo como puedes comprobar en el código para el Button2. Al pulsar Button2 se accionará el botón de la página.

Si quieres que de forma automática al entrar se active el checkbox y se pulse el botón, metes el código en el evento WebBrowser1_DocumentCompleted

Código (vbnet) [Seleccionar]

Public Class Form1


    Private Sub Form1_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
        WebBrowser1.Navigate("http://www2.yapo.cl/ai/form/7?ca=15_s")
    End Sub


    Private Sub WebBrowser1_DocumentCompleted(ByVal sender As System.Object, ByVal e As System.Windows.Forms.WebBrowserDocumentCompletedEventArgs) Handles WebBrowser1.DocumentCompleted


        Dim theElementCollection As HtmlElementCollection = WebBrowser1.Document.GetElementsByTagName("Input")

        'Marca el checkbox "[x]Estoy de acuerdo con los Términos y Condiciones"
        '<input class="ipt_checkbox" id="accept_conditions" name="ai_accept_conditions"  type="checkbox">  
        theElementCollection = WebBrowser1.Document.GetElementsByTagName("Input")
        For Each curElement As HtmlElement In theElementCollection
            Dim controlName As String = curElement.GetAttribute("id").ToString
            If controlName = "accept_conditions" Then
                curElement.SetAttribute("checked", "1")
            End If
        Next

        ' Simula el clic en el botón
        '<input id="submit_create_now" class="btn btn-primary publish_now" name="create" type="submit" value="Publicar ahora">
        theElementCollection = WebBrowser1.Document.GetElementsByTagName("Input")
        For Each curElement As HtmlElement In theElementCollection
            If curElement.GetAttribute("value").Equals("Publicar ahora") Then
                curElement.InvokeMember("click")
                'javascript has a click method for we need to invoke on the current submit button element.  
            End If
        Next
    End Sub
End Class

Con los demás controles de la página pues lo mismo. Para cuadros de texto:

Código (vbnet) [Seleccionar]

       
 
        theElementCollection = WebBrowser1.Document.GetElementsByTagName("Input")
        For Each curElement As HtmlElement In theElementCollection
            Dim controlName As String = curElement.GetAttribute("id").ToString
            If controlName = [ID_OBJETO] Then
                curElement.SetAttribute("Value", [TEXTO])
            End If
        Next

Sl2

Darkwizz · 19 Junio 2015, 00:37 AM

Genial, esto andaba buscando, ya tenía más o menos una idea pero con esto me queda más claro.

Ahora lo que me está rompiendo la cabeza es el tema del botón para subir imágenes, no puedo hacerlo funcionar de ninguna manera.

Hay alguna forma de hacerlo funcionar?.

Saludos y muchas gracias por tu tiempo

okik · 19 Junio 2015, 00:55 AM

Cita de: Darkwizz en 19 Junio 2015, 00:37 AM
Genial, esto andaba buscando, ya tenía más o menos una idea pero con esto me queda más claro.

Ahora lo que me está rompiendo la cabeza es el tema del botón para subir imágenes, no puedo hacerlo funcionar de ninguna manera.

Hay alguna forma de hacerlo funcionar?.

Saludos y muchas gracias por tu tiempo

Pues ahora mismo estaba yo intentándolo

El código html que hacer referencia a ese botón es este:

Código (html4strict) [Seleccionar]

<div class="rightcol">
		<div class="images_container">
			<div class="line single-image">
				<ul id="uploaded_images" class="list_ai-images"></ul>
				<div id="wrapper_image_upload_button" class="wrapper_image_upload_button">
					<div class="title">
						<label class="ipt_label img-txt">Imagen principal</label>
					</div>
					<div class="image">
						<span id="image_upload_button" class="image_upload_button">Agregar imágenes</span>
					</div>
				</div>
			</div>
			<span id="err_extra_image" class="validation_msg success" style="display:none;">

</span>

Estoy rompiéndome la cabeza intentando accionarlo pero no lo consigo. Hay que encontrar la forma de hacer referencia al mismo y accionarlo.

Más abajo hay un Script que como te decía (que era lo que creía que querías hacer), es lo que genera el cuadro

Código (javascript) [Seleccionar]

<script type="text/javascript">
var ai_images = [];
var ai_images_on_init = true;
var ai_images_button = null;
var max_allowed_images=5;
var state = null;
var submitted = 0;
var completed = 0;

$(document).ready(function () {
	state = $('#image_upload_status');

	$('.ipt_radio.main_image').on('change', function(){
 		$('.ipt_radio.main_image').parent().parent().removeClass('checked');
 		$(this).parent().parent().addClass('checked');
	});

....

Pues no he conseguido clicar el botón pero he descubierto algo muy curioso. Se me ocurrió que debería de haber algunar manera de invocar el Script para que se ejecutara y se mostrara el cuadro. En dicho Scritp hay unas funciones y es posible reproducirlas.

En el Script hay la siguiente función:

Código (html4strict) [Seleccionar]

function ai_image_add(filename, thumbnail_digest, digest_present) {
	var index = ai_images.length;
	if (filename == "") return;
	ai_images[index] = {
		'file': filename,
		'thumbnail_digest': (thumbnail_digest == '' ? 'EMPTYDIGEST' : thumbnail_digest),
		'digest_present': digest_present
	};
	ai_image_insert_before(index);
	ai_image_insert(index);
	completed++;
	submitted++;

}

y para ejecutarla desde el Webbrowser se hace lo siguiente:

Código (vbnet) [Seleccionar]

    Private Sub Button3_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Button3.Click
        If (Not (WebBrowser1.Document Is Nothing)) Then
            Dim ObjArr(2) As Object
            ObjArr(0) = CObj(New String("file:///c:\...")) '<---Se supones que aquí va el directorio de la imagen
            ObjArr(1) = CObj(New String(""))
            ObjArr(2) = CObj(New String(""))
            WebBrowser1.Document.InvokeScript("ai_image_add", ObjArr)
        End If

    End Sub

La función es: function ai_image_add(filename, thumbnail_digest, digest_present)

ObjArr(0) representa al valor filename
ObjArr(1) representa al valor thumbnail_digest
ObjArr(2) representa al valor digest_present

Al hacer clic en el botón se crea en la página un cuadrito en la que se supone que debería estar la imagen pero no se carga. Si siges haciendo clic siguen creandose cuadritos.

Pero es mera curiosidad.

Darkwizz · 19 Junio 2015, 04:18 AM

Tienes razón, la función es la parte gráfica, pero según vi las fotos las sube al server y para esta función solo usa el link.

Darkwizz · 19 Junio 2015, 18:58 PM

Lo otro que estaba viendo, es por último si existe alguna forma de darles coordenadas específicas para que ejecute un click, quizás así pueda funcionar.

okik · 19 Junio 2015, 19:35 PM

A ver si lo consigues

He encontrado esto, creo que es lo que buscas. Ahora no lo no puedo mirar yo. A ver si te sirve

https://support.microsoft.com/en-us/kb/315832

Darkwizz · 19 Junio 2015, 21:33 PM

Hola, he estado viendo el link que me mandaste y me surgió la duda de si servirá en un servidor que no es mio, porque según lo que vi parece que solo funciona en un server propio y he intentado con lo que sale pero no me ha funcionado, quizás lo esté haciendo mal pero no estoy seguro.