Gewusst wie: Implementieren der bidirektionalen Kommunikation zwischen DHTML-Code und Clientanwendungscode

Aktualisiert: November 2007

Mit dem WebBrowser-Steuerelement können Sie den Windows Forms-Clientanwendungen vorhandenen dynamischen HTML-(DHTML-)Webanwendungscode hinzufügen. Dies ist sinnvoll, wenn Sie viel Zeit in die Erstellung DHTML-basierter Steuerelemente investiert haben und von den Möglichkeiten der Windows Forms-Benutzeroberfläche profitieren möchten, ohne vorhandenen Code erneut schreiben zu müssen.

Das WebBrowser-Steuerelement ermöglicht es Ihnen, mithilfe der ObjectForScripting-Eigenschaft und der Document-Eigenschaft bidirektionale Kommunikation zwischen dem Clientanwendungscode und dem Webseitenskriptcode zu implementieren. Darüber hinaus können Sie das WebBrowser-Steuerelement so konfigurieren, dass die Websteuerelemente sich nahtlos mit anderen Steuerelementen auf dem Anwendungsformular einfügen, wodurch deren DHTML-Implementierung ausgeblendet wird. Zum nahtlosen Einfügen der Steuerelemente müssen Sie die angezeigte Seite so formatieren, dass die Hintergrundfarbe und der visuelle Stil mit dem restlichen Formular übereinstimmen. Mithilfe der AllowWebBrowserDrop-Eigenschaft, der IsWebBrowserContextMenuEnabled-Eigenschaft und der WebBrowserShortcutsEnabled-Eigenschaft müssen Sie dann die Standardbrowserfeatures deaktivieren.

So betten Sie DHTML in die Windows Forms-Anwendung ein

  1. Legen Sie die AllowWebBrowserDrop-Eigenschaft des WebBrowser-Steuerelements auf false fest, damit durch das WebBrowser-Steuerelement keine Dateien geöffnet werden, die darauf abgelegt werden.

    webBrowser1.AllowWebBrowserDrop = False
    
    webBrowser1.AllowWebBrowserDrop = false;
    
  2. Legen Sie die IsWebBrowserContextMenuEnabled-Eigenschaft auf false fest, um zu verhindern, dass das Kontextmenü des WebBrowser-Steuerelements angezeigt wird, wenn der Benutzer mit der rechten Maustaste darauf klickt.

    webBrowser1.IsWebBrowserContextMenuEnabled = False
    
    webBrowser1.IsWebBrowserContextMenuEnabled = false;
    
  3. Legen Sie die WebBrowserShortcutsEnabled-Eigenschaft des Steuerelements auf false fest, um zu verhindern, dass das WebBrowser-Steuerelement auf die Eingabe von Tastenkombinationen reagiert.

    webBrowser1.WebBrowserShortcutsEnabled = False
    
    webBrowser1.WebBrowserShortcutsEnabled = false;
    
  4. Legen Sie die ObjectForScripting-Eigenschaft im Konstruktor des Formulars oder einem Load-Ereignishandler fest.

    Im folgenden Code wird die Formularklasse selbst für das Skriptobjekt verwendet.

    Hinweis:

    Das COM (Component Object Model) muss in der Lage sein, auf das Skriptobjekt zuzugreifen. Um das Formular für COM sichtbar zu machen, fügen Sie der Formularklasse das ComVisibleAttribute-Attribut hinzu.

    webBrowser1.ObjectForScripting = Me
    
    webBrowser1.ObjectForScripting = this;
    
  5. Implementieren Sie öffentliche Eigenschaften oder Methoden im Anwendungscode, den der Skriptcode verwendet.

    Wenn Sie beispielsweise die Formularklasse für das Skriptobjekt verwenden, fügen Sie der Formularklasse folgenden Code hinzu.

    Public Sub Test(ByVal message As String)
        MessageBox.Show(message, "client code")
    End Sub
    
    public void Test(String message)
    {
        MessageBox.Show(message, "client code");
    }
    
  6. Verwenden Sie das window.external-Objekt im Skriptcode, um auf öffentliche Eigenschaften und Methoden des angegebenen Objekts zuzugreifen.

    Der folgende HTML-Code zeigt, wie eine Methode für das Skriptobjekt durch Klicken auf eine Schaltfläche aufgerufen wird. Kopieren Sie diesen Code in das BODY-Element eines HTML-Dokuments, das Sie mithilfe der Navigate-Methode des Steuerelements laden oder der DocumentText-Eigenschaft des Steuerelements zuweisen.

    <button onclick="window.external.Test('called from script code')">
        call client code from script code
    </button>
    
  7. Implementieren Sie Funktionen im Skriptcode, den der Anwendungscode verwendet.

    Das folgende HTML SCRIPT-Element stellt eine Beispielfunktion bereit. Kopieren Sie diesen Code in das HEAD-Element eines HTML-Dokuments, das Sie mithilfe der Navigate-Methode des Steuerelements laden oder der DocumentText-Eigenschaft des Steuerelements zuweisen.

    <script>
    function test(message) { 
        alert(message); 
    }
    </script>
    
  8. Mit der Document-Eigenschaft kann über den Clientanwendungscode auf den Skriptcode zugegriffen werden.

    Fügen Sie z. B. den folgenden Code einem Click-Ereignishandler für eine Schaltfläche hinzu.

    webBrowser1.Document.InvokeScript("test", _
        New String() {"called from client code"})
    
    webBrowser1.Document.InvokeScript("test",
        new String[] { "called from client code" });
    
  9. Nachdem Sie das Debuggen des DHTML-Codes abgeschlossen haben, legen Sie für die ScriptErrorsSuppressed-Eigenschaft des Steuerelements true fest, um zu verhindern, dass das WebBrowser-Steuerelement Fehlermeldungen zu Skriptcodefehlern anzeigt.

    ' Uncomment the following line when you are finished debugging.
    'webBrowser1.ScriptErrorsSuppressed = True
    
    // Uncomment the following line when you are finished debugging.
    //webBrowser1.ScriptErrorsSuppressed = true;
    

Beispiel

Mit dem folgenden Codebeispiel steht Ihnen eine vollständige Demoanwendung zur Verfügung, die Ihnen dabei hilft, sich mit diesem Feature vertraut zu machen. Der HTML-Code wird in das WebBrowser-Steuerelement über die DocumentText-Eigenschaft anstelle einer separaten HTML-Datei geladen.

Imports System
Imports System.Windows.Forms
Imports System.Security.Permissions

<PermissionSet(SecurityAction.Demand, Name:="FullTrust")> _
<System.Runtime.InteropServices.ComVisibleAttribute(True)> _
Public Class Form1
    Inherits Form

    Private webBrowser1 As New WebBrowser()
    Private WithEvents button1 As New Button()

    <STAThread()> _
    Public Shared Sub Main()
        Application.EnableVisualStyles()
        Application.Run(New Form1())
    End Sub

    Public Sub New()
        button1.Text = "call script code from client code"
        button1.Dock = DockStyle.Top
        webBrowser1.Dock = DockStyle.Fill
        Controls.Add(webBrowser1)
        Controls.Add(button1)
    End Sub

    Private Sub Form1_Load(ByVal sender As Object, ByVal e As EventArgs) _
        Handles Me.Load

        webBrowser1.AllowWebBrowserDrop = False
        webBrowser1.IsWebBrowserContextMenuEnabled = False
        webBrowser1.WebBrowserShortcutsEnabled = False
        webBrowser1.ObjectForScripting = Me
        ' Uncomment the following line when you are finished debugging.
        'webBrowser1.ScriptErrorsSuppressed = True

        webBrowser1.DocumentText = _
            "<html><head><script>" & _
            "function test(message) { alert(message); }" & _
            "</script></head><body><button " & _
            "onclick=""window.external.Test('called from script code')"" > " & _
            "call client code from script code</button>" & _
            "</body></html>"
    End Sub

    Public Sub Test(ByVal message As String)
        MessageBox.Show(message, "client code")
    End Sub

    Private Sub button1_Click(ByVal sender As Object, ByVal e As EventArgs) _
        Handles button1.Click

        webBrowser1.Document.InvokeScript("test", _
            New String() {"called from client code"})

    End Sub

End Class
using System;
using System.Windows.Forms;
using System.Security.Permissions;

[PermissionSet(SecurityAction.Demand, Name="FullTrust")]
[System.Runtime.InteropServices.ComVisibleAttribute(true)]
public class Form1 : Form
{
    private WebBrowser webBrowser1 = new WebBrowser();
    private Button button1 = new Button();

    [STAThread]
    public static void Main()
    {
        Application.EnableVisualStyles();
        Application.Run(new Form1());
    }

    public Form1()
    {
        button1.Text = "call script code from client code";
        button1.Dock = DockStyle.Top;
        button1.Click += new EventHandler(button1_Click);
        webBrowser1.Dock = DockStyle.Fill;
        Controls.Add(webBrowser1);
        Controls.Add(button1);
        Load += new EventHandler(Form1_Load);
    }

    private void Form1_Load(object sender, EventArgs e)
    {
        webBrowser1.AllowWebBrowserDrop = false;
        webBrowser1.IsWebBrowserContextMenuEnabled = false;
        webBrowser1.WebBrowserShortcutsEnabled = false;
        webBrowser1.ObjectForScripting = this;
        // Uncomment the following line when you are finished debugging.
        //webBrowser1.ScriptErrorsSuppressed = true;

        webBrowser1.DocumentText =
            "<html><head><script>" +
            "function test(message) { alert(message); }" +
            "</script></head><body><button " +
            "onclick=\"window.external.Test('called from script code')\">" +
            "call client code from script code</button>" +
            "</body></html>";
    }

    public void Test(String message)
    {
        MessageBox.Show(message, "client code");
    }

    private void button1_Click(object sender, EventArgs e)
    {
        webBrowser1.Document.InvokeScript("test",
            new String[] { "called from client code" });
    }

}

Kompilieren des Codes

Für diesen Code ist Folgendes erforderlich:

  • Verweise auf die Assemblys System und System.Windows.Forms.

Informationen zum Erstellen dieses Beispiels über die Befehlszeile für Visual Basic oder Visual C# finden Sie unterErstellen von der Befehlszeile aus (Visual Basic) und Erstellen über die Befehlszeile mit csc.exe. Sie können dieses Beispiel auch in Visual Studio erstellen, indem Sie den Code in ein neues Projekt einfügen.

Siehe auch

Referenz

WebBrowser

WebBrowser.Document

WebBrowser.ObjectForScripting

Weitere Ressourcen

WebBrowser-Steuerelement (Windows Forms)