FiveTech Software tech support forums

www.FiveTechSoft.com
https://fivetechsupport.com/forums/

Mostrar html local usando webview2

https://fivetechsupport.com/forums/viewtopic.php?f=6&t=42769

Page 1 of 1

Mostrar html local usando webview2

PostPosted: Fri Feb 10, 2023 1:04 pm
by leandro
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

Re: Mostrar html local usando webview2

PostPosted: Fri Feb 10, 2023 1:31 pm
by cnavarro
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

Re: Mostrar html local usando webview2

PostPosted: Fri Feb 10, 2023 2:48 pm
by leandro
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

Re: Mostrar html local usando webview2

PostPosted: Fri Feb 10, 2023 3:40 pm
by cnavarro
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

Re: Mostrar html local usando webview2

PostPosted: Fri Feb 10, 2023 4:21 pm
by leandro
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?

Re: Mostrar html local usando webview2

PostPosted: Fri Feb 10, 2023 6:22 pm
by cnavarro
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

Re: Mostrar html local usando webview2

PostPosted: Sun Feb 12, 2023 12:32 am
by leandro
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

Re: Mostrar html local usando webview2

PostPosted: Sun Feb 12, 2023 2:19 pm
by cnavarro
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

Re: Mostrar html local usando webview2

PostPosted: Sun Feb 12, 2023 10:05 pm
by leandro
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

Re: Mostrar html local usando webview2

PostPosted: Sun Feb 12, 2023 11:41 pm
by cnavarro
Crea otro bind para la otra function

Re: Mostrar html local usando webview2

PostPosted: Mon Feb 13, 2023 3:20 am
by leandro
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
 

Re: Mostrar html local usando webview2

PostPosted: Mon Feb 13, 2023 7:50 am
by Antonio Linares
Estimado Leandro,

Solo puedes usar una función "bind"

Re: Mostrar html local usando webview2

PostPosted: Mon Feb 13, 2023 8:15 pm
by leandro
Antonio gracias por responder, pero entonces como podemos hacer la programación de varios eventos, como en el ejemplo, programar los dos botones?
All times are UTC
Page 1 of 1
Powered by phpBB © 2000, 2002, 2005, 2007 phpBB Group
http://www.phpbb.com/