Mostrar html local usando webview2

Mostrar html local usando webview2

Postby leandro » Fri Feb 10, 2023 1:04 pm

Buenos días para todos

Queremos mostrar un html local en webview, pero no logramos hacer que funcione, nos basamos en el ejemplo webviewuni.prg, para tratar de halar el archivo desde el disco duro, pero no logramos hacer que funcione.

webview3.prg
Code: Select all  Expand view

#include "FiveWin.ch"

//----------------------------------------------------------------------------//

function Main()

   local oWebView := TWebView():New()

   oWebView:bOnBind = { | cJson, nCalls | MsgInfo( cJson, nCalls ) }
   oWebView:Bind( "SendToFWH" )
   oWebView:Navigate( Html() )
   Sleep( 200 )
   oWebView:Run()
   oWebView:Destroy()

return nil

//----------------------------------------------------------------------------//

function Html()
   local cHtml := memoread(".\index.html")
   //memoedit(cHtml)
return cHtml

//----------------------------------------------------------------------------//
 


index.html
Code: Select all  Expand view

<html>
 <head>
 </head>
 <body style="background-color:cyan">
    <h2>Using WebView from FWH</h2>
    <button onclick='SendToFWH( 123 )'>Call FWH app from web browser</button>
    <button onclick='SendToFWH( 456 )'>Test 2</button>
    <button onclick='SendToFWH( 123, 456, "yes it works!" )'>Test 3</button>
 </body>
</html>
 


Image
Saludos
LEANDRO AREVALO
Bogotá (Colombia)
https://hymlyma.com
https://hymplus.com/
leandroalfonso111@gmail.com
leandroalfonso111@hotmail.com

[ Embarcadero C++ 7.60 for Win32 ] [ FiveWin 23.07 ] [ xHarbour 1.3.0 Intl. (SimpLex) (Build 20230914) ]
User avatar
leandro
 
Posts: 1481
Joined: Wed Oct 26, 2005 2:49 pm
Location: Colombia

Re: Mostrar html local usando webview2

Postby cnavarro » Fri Feb 10, 2023 1:31 pm

Leandro, cambia la funcion Html() así
Code: Select all  Expand view

function Html()

   local cHtml
   cHtml  := "data:text/html," + CRLF + hb_MemoRead( ".\index.html" )

Return cHtml
 

El método :Navigate, espera una URL
Para que puedas poner codigo HTML, has de "convertirlo" en URL con el prefijo: "data:...." ( el CRLF que he puesto no es estrictamente necesario )
https://developer.mozilla.org/es/docs/W ... /Data_URLs
Cristobal Navarro
Hay dos tipos de personas: las que te hacen perder el tiempo y las que te hacen perder la noción del tiempo
El secreto de la felicidad no está en hacer lo que te gusta, sino en que te guste lo que haces
User avatar
cnavarro
 
Posts: 6500
Joined: Wed Feb 15, 2012 8:25 pm
Location: España

Re: Mostrar html local usando webview2

Postby leandro » Fri Feb 10, 2023 2:48 pm

Amigo gracias por responder...

Listo solucionado, pero ahora nos surge otra pregunta, como agregamos los archivos de estilos "css" que están dentro del html?
Por que muestra el código html, pero no los estilos.

Code: Select all  Expand view

<!doctype html>
<html>
<head>

...

    <title>HymLyma | Digital Products</title>
     
    <link href="css/bootstrap.min.css" rel="stylesheet">
    <link href="css/style.css" rel="stylesheet">   

...

</head>
<body>

</body>
</html>
 

Image
Saludos
LEANDRO AREVALO
Bogotá (Colombia)
https://hymlyma.com
https://hymplus.com/
leandroalfonso111@gmail.com
leandroalfonso111@hotmail.com

[ Embarcadero C++ 7.60 for Win32 ] [ FiveWin 23.07 ] [ xHarbour 1.3.0 Intl. (SimpLex) (Build 20230914) ]
User avatar
leandro
 
Posts: 1481
Joined: Wed Oct 26, 2005 2:49 pm
Location: Colombia

Re: Mostrar html local usando webview2

Postby cnavarro » Fri Feb 10, 2023 3:40 pm

Busca en google
"not allowed to load local resource"
lo más sencillo es que tengas "levantado" un server ( local o remoto ) y pongas los recursos a partir del htdocs del server
Cristobal Navarro
Hay dos tipos de personas: las que te hacen perder el tiempo y las que te hacen perder la noción del tiempo
El secreto de la felicidad no está en hacer lo que te gusta, sino en que te guste lo que haces
User avatar
cnavarro
 
Posts: 6500
Joined: Wed Feb 15, 2012 8:25 pm
Location: España

Re: Mostrar html local usando webview2

Postby leandro » Fri Feb 10, 2023 4:21 pm

Amigo gracias por responder, si así lo tenemos en otra parte de la aplicación.

Pero lo que nos gustaría lograr, es hacer el front de la aplicación en html y css, tambien usar los recursos de imágenes locales y el resto de la caja negra con FW.

Es posible esto con WebView2?

Se pueden capturar los datos del html, ósea recoger la info de los inputs?
Saludos
LEANDRO AREVALO
Bogotá (Colombia)
https://hymlyma.com
https://hymplus.com/
leandroalfonso111@gmail.com
leandroalfonso111@hotmail.com

[ Embarcadero C++ 7.60 for Win32 ] [ FiveWin 23.07 ] [ xHarbour 1.3.0 Intl. (SimpLex) (Build 20230914) ]
User avatar
leandro
 
Posts: 1481
Joined: Wed Oct 26, 2005 2:49 pm
Location: Colombia

Re: Mostrar html local usando webview2

Postby cnavarro » Fri Feb 10, 2023 6:22 pm

leandro wrote:Amigo gracias por responder, si así lo tenemos en otra parte de la aplicación.

Pero lo que nos gustaría lograr, es hacer el front de la aplicación en html y css, tambien usar los recursos de imágenes locales y el resto de la caja negra con FW.

Es posible esto con WebView2?

Se pueden capturar los datos del html, ósea recoger la info de los inputs?


A ver si queda claro: lo que no permiten los exploradores por seguridad, la carga de recursos locales ( css, js, etc. ), por lo tanto no es un problema de webview. Es posible que indagando y modificando el tema de la seguridad de los exploradores que uséis ( Chrome, Edge, etc. ) te permita hacerlo cambiando su configuración ( ojo con esto por si tuviera efectos colaterales ), googlea un ratillo a ver qué encuentras.
Si levantas un Apache en tu máquina, o el uHttpd de Mindaugas de Harbour, es decir, cualquier servidor que esté corriendo en la máquina, podrás usarlos haciendo la llamada a los CSS haciendo referencia a tu localhost.
Por supuesto que el resto puedes meterlo todo dentro del webview, y por lo tanto hacer una aplicación Fivewin cerrada
En cuanto a tu última pregunta, de si se pueden recoger los datos de los inputs que tienes en la página web desde la aplicación Fivewin, por supuesto, para eso se inventó el Webview. Un poco de Javascript y las funcionalidades del "bind" y listo.
Y al revés: desde un diálogo de Fw, puedes mandar lo que tengas en tus gets a un input de un formulario Html que tengas en el webview
Cristobal Navarro
Hay dos tipos de personas: las que te hacen perder el tiempo y las que te hacen perder la noción del tiempo
El secreto de la felicidad no está en hacer lo que te gusta, sino en que te guste lo que haces
User avatar
cnavarro
 
Posts: 6500
Joined: Wed Feb 15, 2012 8:25 pm
Location: España

Re: Mostrar html local usando webview2

Postby leandro » Sun Feb 12, 2023 12:32 am

Excelente amigo, muchas gracias por la info

Estuve buscando en google las funcionalidades "bind", pero no encuentro documentación, de casualidad podrías montar un ejemplo :oops:, que nos muestre el envió y recepción de variables?

De antemano gracias
Saludos
LEANDRO AREVALO
Bogotá (Colombia)
https://hymlyma.com
https://hymplus.com/
leandroalfonso111@gmail.com
leandroalfonso111@hotmail.com

[ Embarcadero C++ 7.60 for Win32 ] [ FiveWin 23.07 ] [ xHarbour 1.3.0 Intl. (SimpLex) (Build 20230914) ]
User avatar
leandro
 
Posts: 1481
Joined: Wed Oct 26, 2005 2:49 pm
Location: Colombia

Re: Mostrar html local usando webview2

Postby cnavarro » Sun Feb 12, 2023 2:19 pm

En tu ejemplo inicial de este hilo, ya usas la function "bind"
Creo que este ejemplo te puede servir
https://fivetechsupport.com/forums/view ... c3#p248110
Cristobal Navarro
Hay dos tipos de personas: las que te hacen perder el tiempo y las que te hacen perder la noción del tiempo
El secreto de la felicidad no está en hacer lo que te gusta, sino en que te guste lo que haces
User avatar
cnavarro
 
Posts: 6500
Joined: Wed Feb 15, 2012 8:25 pm
Location: España

Re: Mostrar html local usando webview2

Postby leandro » Sun Feb 12, 2023 10:05 pm

Amigo gracias de nuevo por responder
Pero es que ese ejemplo es muy limitado, monte este nuevo ejemplo, la idea es poder correr dos funciones diferentes con los botones que están definidos, no logro entender como indicarle al navegador que ejecute las funciones por separado, de momento solo funciona lafuncionacorrer(), tampoco entiendo como se pasan los parámetros a la función lafunciondecerrardialogo()

Espero haberme hecho entender, de antemano gracias.

Code: Select all  Expand view

#include "FiveWin.ch"

//----------------------------------------------------------------------------//

function Main()

   local oWebView := TWebView():New()

   oWebView:bOnBind = { | cJson, nCalls | lafuncionacorrer() }
   oWebView:Bind( "lafuncionacorrer" )
   oWebView:Navigate( Html() )
   //Sleep( 200 )
   oWebView:Run()
   oWebView:Destroy()

return nil

//----------------------------------------------------------------------------//

function Html()

   local cHtml

   TEXT INTO cHtml
      data:text/html,
      <html>
         <head>
         </head>
         <body style="background-color:cyan">
            <h2>Ejecutando Acciones</h2>
            <button onclick='lafunciondecerrardialogo( 123 )'>Cerrar Dialogo</button>
            <button onclick='lafuncionacorrer()'>Correr funcion</button>
         </body>
      </html>
   ENDTEXT      

return cHtml

//----------------------------------------------------------------------------//

function lafuncionacorrer()
msginfo("corriendo la funcion")
Return nil

//----------------------------------------------------------------------------//

function lafunciondecerrardialogo()
msginfo("Cerrando dialogo")
oWebView:Destroy()
Return nil
 


Image
Saludos
LEANDRO AREVALO
Bogotá (Colombia)
https://hymlyma.com
https://hymplus.com/
leandroalfonso111@gmail.com
leandroalfonso111@hotmail.com

[ Embarcadero C++ 7.60 for Win32 ] [ FiveWin 23.07 ] [ xHarbour 1.3.0 Intl. (SimpLex) (Build 20230914) ]
User avatar
leandro
 
Posts: 1481
Joined: Wed Oct 26, 2005 2:49 pm
Location: Colombia

Re: Mostrar html local usando webview2

Postby cnavarro » Sun Feb 12, 2023 11:41 pm

Crea otro bind para la otra function
Cristobal Navarro
Hay dos tipos de personas: las que te hacen perder el tiempo y las que te hacen perder la noción del tiempo
El secreto de la felicidad no está en hacer lo que te gusta, sino en que te guste lo que haces
User avatar
cnavarro
 
Posts: 6500
Joined: Wed Feb 15, 2012 8:25 pm
Location: España

Re: Mostrar html local usando webview2

Postby leandro » Mon Feb 13, 2023 3:20 am

De nuevo gracias por responder

Deje el código así pero no funciona :(

En los dos botones corre la función lafunciondecerrardialogo()

Code: Select all  Expand view

#include "FiveWin.ch"

//----------------------------------------------------------------------------//

function Main()

   local oWebView := TWebView():New()

   oWebView:bOnBind = { | cJson, nCalls | lafuncionacorrer() }
   oWebView:Bind( "lafuncionacorrer" )

   oWebView:bOnBind = { | cJson, nCalls | lafunciondecerrardialogo() }
   oWebView:Bind( "lafunciondecerrardialogo" )


   oWebView:Navigate( Html() )
   //Sleep( 200 )
   oWebView:Run()
   oWebView:Destroy()

return nil

//----------------------------------------------------------------------------//

function Html()

   local cHtml

   TEXT INTO cHtml
      data:text/html,
      <html>
         <head>
         </head>
         <body style="background-color:cyan">
            <h2>Ejecutando Acciones</h2>
            <button onclick='lafunciondecerrardialogo()'>Cerrar Dialogo</button>
            <button onclick='lafuncionacorrer()'>Correr funcion</button>
         </body>
      </html>
   ENDTEXT      

return cHtml

//----------------------------------------------------------------------------//

function lafuncionacorrer()
msginfo("corriendo la funcion")
Return nil

//----------------------------------------------------------------------------//


function lafunciondecerrardialogo()
msginfo("Cerrando dialogo")
Return nil
 
Saludos
LEANDRO AREVALO
Bogotá (Colombia)
https://hymlyma.com
https://hymplus.com/
leandroalfonso111@gmail.com
leandroalfonso111@hotmail.com

[ Embarcadero C++ 7.60 for Win32 ] [ FiveWin 23.07 ] [ xHarbour 1.3.0 Intl. (SimpLex) (Build 20230914) ]
User avatar
leandro
 
Posts: 1481
Joined: Wed Oct 26, 2005 2:49 pm
Location: Colombia

Re: Mostrar html local usando webview2

Postby Antonio Linares » Mon Feb 13, 2023 7:50 am

Estimado Leandro,

Solo puedes usar una función "bind"
regards, saludos

Antonio Linares
www.fivetechsoft.com
User avatar
Antonio Linares
Site Admin
 
Posts: 41315
Joined: Thu Oct 06, 2005 5:47 pm
Location: Spain

Re: Mostrar html local usando webview2

Postby leandro » Mon Feb 13, 2023 8:15 pm

Antonio gracias por responder, pero entonces como podemos hacer la programación de varios eventos, como en el ejemplo, programar los dos botones?
Saludos
LEANDRO AREVALO
Bogotá (Colombia)
https://hymlyma.com
https://hymplus.com/
leandroalfonso111@gmail.com
leandroalfonso111@hotmail.com

[ Embarcadero C++ 7.60 for Win32 ] [ FiveWin 23.07 ] [ xHarbour 1.3.0 Intl. (SimpLex) (Build 20230914) ]
User avatar
leandro
 
Posts: 1481
Joined: Wed Oct 26, 2005 2:49 pm
Location: Colombia


Return to FiveWin para Harbour/xHarbour

Who is online

Users browsing this forum: No registered users and 86 guests