Foro de elhacker.net

Programación => .NET (C#, VB.NET, ASP) => Mensaje iniciado por: Darkwizz en 18 Junio 2015, 14:42 pm


Título: Subir imagen con WebBrowser
Publicado por: Darkwizz en 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.

Título: Re: Subir imagen con WebBrowser
Publicado por: okik en 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
  1. <html> 
  2. <head> 
  3. <title>intento de msg box</title> 
  4. <STYLE type="text/css"> 
  5. #mantonegro{ 
  6. display:none; 
  7. position:absolute; 
  8. top:0; 
  9. left:0; 
  10. background-color: #000000; 
  11. width:2000; 
  12. height:3000; 
  13. filter:alpha(opacity=72); 
  14. z-index:0; 
  15. } 
  16. #dthing{ 
  17. display:none; 
  18. position:absolute; 
  19. top:70; 
  20. left:120; 
  21. background-color: #CAE0F0; 
  22. z-index:0; 
  23. } 
  24. </STYLE> 
  25.  
  26. </head> 
  27. <body onload='alert("bienvenidos a Mi Web, dejen su comentario");'>
  28. <h1>TITULO</h1> 
  29. <br> 
  30. </div> 
  31.  
  32.  
  33. </body> 
  34. </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/ (http://foro.elhacker.net/desarrollo_web-b7.0/)


Título: Re: Subir imagen con WebBrowser
Publicado por: Darkwizz en 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 :)

Título: Re: Subir imagen con WebBrowser
Publicado por: okik en 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
  1. <!-- BEGIN SUBMIT FORM -->
  2. 			<div class="footer-ai">
  3. 				<input id="submit_preview" class="btn btn-primary visualize" name="validate" type="submit" value="Vista previa">
  4. 				<input id="submit_create_now" class="btn btn-primary publish_now" name="create" type="submit" value="Publicar ahora">
  5. 			</div>
  6. 			<!-- 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
  1. Public Class Form1
  2.  
  3.  
  4.     Private Sub Form1_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
  5.         WebBrowser1.Navigate("http://www2.yapo.cl/ai/form/7?ca=15_s")
  6.     End Sub
  7.  
  8.     Private Sub Button1_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Button1.Click
  9.  
  10.         'Marca el checkbox "[x]Estoy de acuerdo con los Términos y Condiciones"
  11.         Dim theElementCollection As HtmlElementCollection = WebBrowser1.Document.GetElementsByTagName("Input")
  12.  
  13.         '<input class="ipt_checkbox" id="accept_conditions" name="ai_accept_conditions"  type="checkbox">  
  14.         theElementCollection = WebBrowser1.Document.GetElementsByTagName("Input")
  15.         For Each curElement As HtmlElement In theElementCollection
  16.             Dim controlName As String = curElement.GetAttribute("id").ToString
  17.             If controlName = "accept_conditions" Then
  18.                 curElement.SetAttribute("checked", "1")
  19.             End If
  20.         Next
  21.     End Sub
  22.  
  23.     Private Sub Button2_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Button2.Click
  24.         Dim theElementCollection As HtmlElementCollection = WebBrowser1.Document.GetElementsByTagName("Input")
  25.  
  26.         ' Simula el clic en el botón
  27.         '<input id="submit_create_now" class="btn btn-primary publish_now" name="create" type="submit" value="Publicar ahora">
  28.         theElementCollection = WebBrowser1.Document.GetElementsByTagName("Input")
  29.         For Each curElement As HtmlElement In theElementCollection
  30.             If curElement.GetAttribute("value").Equals("Publicar ahora") Then
  31.                 curElement.InvokeMember("click")
  32.                 'javascript has a click method for we need to invoke on the current submit button element.  
  33.             End If
  34.         Next
  35.     End Sub
  36. 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
  1. <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
  1.         '<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
  1. Public Class Form1
  2.  
  3.  
  4.     Private Sub Form1_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
  5.         WebBrowser1.Navigate("http://www2.yapo.cl/ai/form/7?ca=15_s")
  6.     End Sub
  7.  
  8.  
  9.     Private Sub WebBrowser1_DocumentCompleted(ByVal sender As System.Object, ByVal e As System.Windows.Forms.WebBrowserDocumentCompletedEventArgs) Handles WebBrowser1.DocumentCompleted
  10.  
  11.  
  12.         Dim theElementCollection As HtmlElementCollection = WebBrowser1.Document.GetElementsByTagName("Input")
  13.  
  14.         'Marca el checkbox "[x]Estoy de acuerdo con los Términos y Condiciones"
  15.         '<input class="ipt_checkbox" id="accept_conditions" name="ai_accept_conditions"  type="checkbox">  
  16.         theElementCollection = WebBrowser1.Document.GetElementsByTagName("Input")
  17.         For Each curElement As HtmlElement In theElementCollection
  18.             Dim controlName As String = curElement.GetAttribute("id").ToString
  19.             If controlName = "accept_conditions" Then
  20.                 curElement.SetAttribute("checked", "1")
  21.             End If
  22.         Next
  23.  
  24.         ' Simula el clic en el botón
  25.         '<input id="submit_create_now" class="btn btn-primary publish_now" name="create" type="submit" value="Publicar ahora">
  26.         theElementCollection = WebBrowser1.Document.GetElementsByTagName("Input")
  27.         For Each curElement As HtmlElement In theElementCollection
  28.             If curElement.GetAttribute("value").Equals("Publicar ahora") Then
  29.                 curElement.InvokeMember("click")
  30.                 'javascript has a click method for we need to invoke on the current submit button element.  
  31.             End If
  32.         Next
  33.     End Sub
  34. End Class


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


Código
  1.  
  2.  
  3.         theElementCollection = WebBrowser1.Document.GetElementsByTagName("Input")
  4.         For Each curElement As HtmlElement In theElementCollection
  5.             Dim controlName As String = curElement.GetAttribute("id").ToString
  6.             If controlName = [ID_OBJETO] Then
  7.                 curElement.SetAttribute("Value", [TEXTO])
  8.             End If
  9.         Next


Sl2

Título: Re: Subir imagen con WebBrowser
Publicado por: 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

Título: Re: Subir imagen con WebBrowser
Publicado por: okik en 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  :xD

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

Código
  1. <div class="rightcol">
  2. 		<div class="images_container">
  3. 			<div class="line single-image">
  4. 				<ul id="uploaded_images" class="list_ai-images"></ul>
  5. 				<div id="wrapper_image_upload_button" class="wrapper_image_upload_button">
  6. 					<div class="title">
  7. 						<label class="ipt_label img-txt">Imagen principal</label>
  8. 					</div>
  9. 					<div class="image">
  10. 						<span id="image_upload_button" class="image_upload_button">Agregar imágenes</span>
  11. 					</div>
  12. 				</div>
  13. 			</div>
  14. 			<span id="err_extra_image" class="validation_msg success" style="display:none;">
  15.  
  16. </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
  1. <script type="text/javascript">
  2. var ai_images = [];
  3. var ai_images_on_init = true;
  4. var ai_images_button = null;
  5. var max_allowed_images=5;
  6. var state = null;
  7. var submitted = 0;
  8. var completed = 0;
  9.  
  10. $(document).ready(function () {
  11. 	state = $('#image_upload_status');
  12.  
  13. 	$('.ipt_radio.main_image').on('change', function(){
  14.  		$('.ipt_radio.main_image').parent().parent().removeClass('checked');
  15.  		$(this).parent().parent().addClass('checked');
  16. 	});
  17.  
  18. ....
  19.  




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
  1. function ai_image_add(filename, thumbnail_digest, digest_present) {
  2. 	var index = ai_images.length;
  3. 	if (filename == "") return;
  4. 	ai_images[index] = {
  5. 		'file': filename,
  6. 		'thumbnail_digest': (thumbnail_digest == '' ? 'EMPTYDIGEST' : thumbnail_digest),
  7. 		'digest_present': digest_present
  8. 	};
  9. 	ai_image_insert_before(index);
  10. 	ai_image_insert(index);
  11. 	completed++;
  12. 	submitted++;
  13.  
  14. }


y para ejecutarla desde el Webbrowser se hace lo siguiente:


Código
  1.     Private Sub Button3_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Button3.Click
  2.         If (Not (WebBrowser1.Document Is Nothing)) Then
  3.             Dim ObjArr(2) As Object
  4.             ObjArr(0) = CObj(New String("file:///c:\...")) '<---Se supones que aquí va el directorio de la imagen
  5.             ObjArr(1) = CObj(New String(""))
  6.             ObjArr(2) = CObj(New String(""))
  7.             WebBrowser1.Document.InvokeScript("ai_image_add", ObjArr)
  8.         End If
  9.  
  10.     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.

Título: Re: Subir imagen con WebBrowser
Publicado por: Darkwizz en 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.

Título: Re: Subir imagen con WebBrowser
Publicado por: Darkwizz en 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.

Título: Re: Subir imagen con WebBrowser
Publicado por: okik en 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 (https://support.microsoft.com/en-us/kb/315832)

Título: Re: Subir imagen con WebBrowser
Publicado por: Darkwizz en 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.

Título: Re: Subir imagen con WebBrowser
Publicado por: okik en 19 Junio 2015, 23:02 pm
Hola compañero

Mira no te complique más. Como no me rindo facilmente, finalmente encontré la solución  :P. Por lo menos para conseguir pulsar el botón. En cuanto a tu pregunta por lo del servidor, sinceramente no lo se.


Código
  1. Public Class Form1
  2.  
  3.  
  4.  
  5.     Private Sub Form1_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
  6.         WebBrowser1.ScriptErrorsSuppressed = True
  7.         WebBrowser1.Navigate("http://www2.yapo.cl/ai/form/7?ca=15_s")
  8.     End Sub
  9.  
  10.     Private Sub Button1_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Button1.Click
  11.  
  12.         Dim clElement As HtmlElementCollection = WebBrowser1.Document.GetElementsByTagName("Input")
  13.         For Each Element As HtmlElement In clElement
  14.             Dim controlName As String = Element.GetAttribute("input").ToString
  15.             If Element.GetAttribute("name").Equals("file") Then
  16.                 Element.InvokeMember("click")
  17.             End If
  18.         Next
  19.     End Sub
  20. End Class



Explico como lo he averiguado.

Se me ocurrió que era mejor guardar la página web y luego analizarla. Tras guardarla la he abierto con el vb.net como web y justo donde está el botón hay controles uno encima de otro. Los separé, y conseguí determinar realmente cual es el control a llamar. Para ello guardé los cambios y luego lo abrí con el Google Chrome sin conexión  para determinar cual era realmente el que abre el cuadro. No es visible pero se detecta al pasar el ratón porque se pone el dedo. Después le doy con el botón derecho del ratón y hago clic en Inspeccionar y Chrome me muestra el código exácto que hace referencia al mismo.

Código
  1. <input multiple="multiple" type="file" name="file" style="height: 46px; position: absolute; right: 18px; top: 50px; font-family: Arial; font-size: 118px; margin: 0px; padding: 0px; cursor: pointer; opacity: 0; width: 1925px;">


No encontraba el control porque no es visible desde el webbrowser al obtener el código de la página al conectarse online. Si no ubiera guardado la página para analizarla no lo hubiera encontrado.

El control se crea desde un archivo de jscript que se descarga en el caché que se llama ai.js:

Código
  1. e=document.createElement("input");this._options.multiple&&e.setAttribute("multiple","multiple"),this._options.acceptFiles&&e.setAttribute








Título: Re: Subir imagen con WebBrowser
Publicado por: Darkwizz en 20 Junio 2015, 18:49 pm
Genial, eres un maestro!. Al fin una forma de hacerlo, me salvaste.

La última duda que me queda es que trabajando con WebBrowrser no funciona si dentro del mismo botón cargo la página y luego trato de pulsar botones dentro de esta página, es obligatorio que se cargue antes para poder usar el botón. Mi duda es si existe alguna forma de hacerlo o no?, porque intenté con ciclos for y tampoco funciona, pero es una acotación nomas, el problema principal ya está solucionado y te agradezco por la amabilidad y el tiempo que te tomaste. Saludos

Título: Re: Subir imagen con WebBrowser
Publicado por: okik en 20 Junio 2015, 22:14 pm
Que tal esto:

Código
  1. Public Class Form1
  2.     Dim WB As New WebBrowser
  3.  
  4.     Private Sub Form1_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
  5.         Button1.Text = "Cargar página"
  6.         Button2.Text = "Upload Image"
  7.         Button2.Enabled = False
  8.     End Sub
  9.     Private Sub Button1_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Button1.Click
  10.         WB.ScriptErrorsSuppressed = True
  11.         Try
  12.             WB.Navigate("http://www2.yapo.cl/ai/form/7?ca=15_s")
  13.             Me.Cursor = Cursors.WaitCursor 'Cambia el cursor a espera
  14.  
  15.             'Espera a que cargue la página
  16.             Do While (WB.ReadyState <> WebBrowserReadyState.Complete)
  17.                 My.Application.DoEvents()
  18.             Loop
  19.  
  20.             If WB.ReadyState = WebBrowserReadyState.Complete Then
  21.                 Me.Cursor = Cursors.Default 'Retorna el cursor normal
  22.                 Button2.Enabled = True
  23.             End If
  24.         Catch ex As Exception
  25.             MsgBox("No se ha podido gargar la página")
  26.         End Try
  27.  
  28.     End Sub
  29.     Private Sub Button2_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Button2.Click
  30.         Dim clElement As HtmlElementCollection = WB.Document.GetElementsByTagName("Input")
  31.         For Each Element As HtmlElement In clElement
  32.             Dim controlName As String = Element.GetAttribute("input").ToString
  33.             If Element.GetAttribute("name").Equals("file") Then
  34.                 Element.InvokeMember("click")
  35.             End If
  36.         Next
  37.     End Sub
  38. End Class

No me acaba de gustar porque si metes mal la URL el segundo botón se activa igualmente, pero por ahí va la cosa. Crear un sistema de espera a que se cargue la página.

Por cierto, para este código NO necesistas introducir físicamente un WebBrowser en el formulario, gracias a :        Dim WB As New WebBrowser


De modo que puedes introducir datos y hacer clics a botones sin que se vea la página.





Título: Re: Subir imagen con WebBrowser
Publicado por: Darkwizz en 25 Junio 2015, 23:16 pm
Hola compañero, de nuevo yo jajaja, mientras seguía viendo la página encontré, que cuando subes un producto, este queda en estado de espera, y no puedo lograr identificar si un producto está en revisión. Tu crees que sea posible alguna forma?

Título: Re: Subir imagen con WebBrowser
Publicado por: nomed en 9 Junio 2017, 15:06 pm
Que bueno , estaba buscando esto , voy a ver paso a paso si soy capaz de conseguirlo, gracias fenomeno


Powered by SMF 1.1.21 | SMF © 2006-2008, Simple Machines