Requisiti: Come può WebView2 rendere e visualizzare risorse web per le azioni dell'utente, come può l'interfaccia web comunicare con l'applicazione WinForm? Ad esempio, il web legge le informazioni hardware tramite l'applicazione, e l'applicazione aggiorna attivamente il contenuto della pagina web.
Recensione:
Per prima cosa, guarda i rendering della comunicazione tra il web e l'applicazione WinForm, il web invia un messaggio all'applicazione,Invoca la funzione Calcolatrice che apre il sistema WindowsAllo stesso tempo, l'applicazione può anche ricevere con successo i messaggi inviati al lato web, come mostrato nella figura sottostante:
Comunicazione tra host e contenuti web
Host e contenuti web possono essere utilizzati per comunicare tra loro in postMessages, come segue:
- I contenuti web nel controllo WebView2 possono essere utilizzati per pubblicare un messaggio all'host in window.chrome.webview.postMessage. L'host elabora il messaggio con qualsiasi messaggio che registri WebMessageReceived sull'host.
- L'host pubblica i messaggi sui contenuti Web nel controllo WebView2 CoreWebView2.PostWebMessageAsString usando o CoreWebView2.PostWebMessageAsJSON. Questi messaggi vengono catturati dal gestore aggiunto a window.chrome.webview.addEventListener.
Creare un nuovo progetto Angular SPA
Questo articolo utilizza Angular 8.2.14 per creare un nuovo progetto web che dimostri la comunicazione tra il web e l'applicazione WinForm.
Il codice è il seguente:
Allo stesso tempo, modificare i file app.component.html e app.component.ts per realizzare le funzioni di invio e ricezione dei messaggi.
app.component.html codice è il seguente:
app.component.ts codice è il seguente:
Gestisci il progetto come mostrato qui sotto:
Applicazione WinForm
L'applicazione host deve modificare il codice come segue:
Modifica il controllo di WebView2Attributo fonte è: http://localhost:4200/per lanciare l'applicazione, come mostrato di seguito:
Infine, prova a inviarti messaggi tra di te tramite le applicazioni Web e WinForm, e puoi vedere che entrambe le parti riescono a ricevere con successo i messaggi, come mostrato nella figura seguente:
(Fine)
|