So wird’s gemacht: Herstellen einer Verbindung mit einem Datagrammsocket (HTML)

Artikel
12/12/2015

[ Dieser Artikel richtet sich an Windows 8.x- und Windows Phone 8.x-Entwickler, die Windows-Runtime-Apps schreiben. Wenn Sie für Windows 10 entwickeln, finden Sie weitere Informationen unter neueste Dokumentation]

In diesen Themen wird gezeigt, wie Sie mit UDP Netzwerkdaten in einer Windows-Runtime-App mit einem DatagramSocket senden und empfangen.

Die Clientkomponente des Beispiels erstellt einen UDP-Socket, verwendet den Socket, um Daten zu senden und zu empfangen, und schließt den Socket. Die Serverkomponente des Beispiels erstellt einen UDP-Socket, um auf eingehende Netzwerkpakete zu lauschen, empfängt eingehende UDP-Pakete vom Client, sendet Daten an den Client und schließt den Socket. Für dieses Beispiel werden die Programmiersprachen JavaScript, C# und C++ verwendet.

Die Clientkomponente des Beispiels veranschaulicht die folgenden Features:

Verwenden der DatagramSocket-Klasse zum Erstellen eines UDP-Sockets für den Client, um Daten zu senden und zu empfangen.
Hinzufügen eines Handlers für ein DatagramSocket.MessageReceived-Ereignis, das angibt, dass ein UDP-Datagramm vom DatagramSocket-Objekt empfangen wurde.
Festlegen des Remoteendpunkts für einen UDP-Netzwerkserver, an den Pakete mit einer der DatagramSocket.ConnectAsync-Methoden gesendet werden sollen.
Senden von Daten an den Server mit dem Streams.DataWriter-Objekt, das es Programmierern ermöglicht, allgemeine Typen (z. B. ganze Zahlen und Zeichenfolgen) in Streams zu schreiben.
Schließen des Sockets.

Die Serverkomponente des Beispiels veranschaulicht die folgenden Features:

Verwenden der DatagramSocket-Klasse zum Erstellen eines UDP-Sockets, um auf eingehende Datagrammpakete zu lauschen und diese zu empfangen sowie Pakete zu senden.
Hinzufügen eines Handlers für ein DatagramSocket.MessageReceived-Ereignis, das angibt, dass ein UDP-Datagramm vom DatagramSocket-Objekt empfangen wurde.
Binden des Sockets an einen lokalen Dienstnamen mit der DatagramSocket.BindServiceNameAsync-Methode, um auf eingehende UDP-Pakete zu lauschen.
Empfangen eines DatagramSocket.MessageReceived-Ereignisses, das angibt, dass ein UDP-Datagramm vom DatagramSocket-Objekt empfangen wurde.
Empfangen von Daten vom Client mithilfe des DatagramSocket.MessageReceived-Handlers. Das an den DatagramSocket.MessageReceived-Handler übergebene DatagramSocketMessageReceivedEventArgs-Objekt ermöglicht es einer App, Daten vom Client zu empfangen und festzustellen, von welcher Remoteadresse und welchem Port die Daten gesendet wurden.
Schließen des Sockets.

Hinweis Dieses Beispiel erfordert Netzwerkzugriff über die Loopbackschnittstelle.

Ziel: Stellen Sie eine Netzwerkverbindung mit einem anderen Computer oder Gerät mit einem DatagramSocket-Socket her.

Voraussetzungen

In den folgenden Beispielen wird JavaScript verwendet. Informationen zum Erstellen der ersten App finden Sie unter Erstellen Ihrer ersten Windows Store-App mit JavaScript.

Damit die Windows Store-App im Netzwerk verwendet werden kann, müssen Sie die entsprechende Funktion in der Projektdatei Package.appxmanifest festlegen. Definitionen zu den einzelnen Netzwerkfunktionen finden Sie unter So wird's gemacht: Konfigurieren von Netzwerkisolationsfunktionen.

Anweisungen

1. Erstellen eines neuen Projekts

Öffnen Sie Microsoft Visual Studio 2013, und wählen Sie Neues Projekt im Menü Datei aus.
Wählen Sie aus der Liste der Vorlagen JavaScript aus.
Wählen Sie unterhalb des Abschnitts die Option Store apps aus.
Wählen Sie unterhalb des Abschnitts je nach Zielplattform die Option Universal Apps, Windows apps oder Windows Phone apps und anschließend die Option Leere Anwendung aus.
Geben Sie für die App den Namen socketsSample ein, und klicken Sie auf OK.

2. Einrichten der Funktionen zur Aktivierung des Netzwerkzugriffs

Wenn Ihre App Netzwerkzugriff benötigt, müssen Sie Netzwerkfunktionen für sie festlegen. Für eine App, die mit einem DatagramSocket eine Verbindung mit einem Netzwerkdienst herstellt, müssten Netzwerkfunktionen festgelegt werden.

Wenn die App als Client eine Verbindung mit Remotediensten im Internet herstellen können muss, ist die Funktion Internet (Client) erforderlich. Wenn die App als Client eine Verbindung mit Remotediensten in einem Heim- oder Arbeitsplatznetzwerk herstellen können muss, ist die Funktion Private Netzwerke (Client und Server) erforderlich.

Wenn die App den DatagramSocket verwenden muss, um auf eingehende Verbindungen von Remoteendpunkten im Internet zu lauschen, ist die Funktion Internet (Client und Server) erforderlich. Wenn die App den DatagramSocket verwenden muss, um auf eingehende Verbindungen von Remoteendpunkten in einem Heim- oder Arbeitsplatznetzwerk zu lauschen, ist die Funktion Private Netzwerke (Client und Server) erforderlich.

Hinweis Unter Windows Phone gibt es nur eine Netzwerkfunktion – Internet (Client und Server) –, die den Netzwerkzugriff komplett für die App aktiviert.

Wenn die Serverkomponente des Beispiels, die auf eingehende Verbindungen lauscht, auf demselben Gerät ausgeführt wird wie die Clientkomponente, ist Loopbackzugriff erforderlich. In Visual Studio 2013 entwickelte und ausgeführte Apps werden automatisch so registriert, dass sie von den Loopbackbeschränkungen ausgenommen werden. Weitere Informationen finden Sie unter Aktivieren von Loopback und Debuggen der Netzwerkisolation.

Weitere Informationen zum Netzwerkzugriff finden Sie unter Konfigurieren von Netzwerkisolationsfunktionen.

Diese Schritte müssen durchgeführt werden, um vor der Bereitstellung Netzwerkfunktionen für eine App einzurichten, wenn sie auf einen Netzwerkdienst im Internet oder auf ein Heim- oder Arbeitsplatznetzwerk zugreift.

Öffnen Sie die Datei "package.appxmanifest" in Microsoft Visual Studio.
Wählen Sie die Registerkarte Funktionen aus.
Wählen Sie zum Erstellen der Windows-Version des Beispiels die Funktionen Internet (Client) und Private Netzwerke (Client und Server) aus.

Wählen Sie zum Erstellen der Windows Phone-Version des Beispiels die Funktion Internet (Client und Server) aus.
Speichern und schließen Sie die Manifestdatei.

3. Hinzufügen einer HTML-Benutzeroberfläche

Öffnen Sie den Ordner html. Öffnen Sie eine neue startListener.html-Datei, und fügen Sie folgenden HTML-Code in den Bereichen <head> und <body> hinzu.


<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <script src="/js/socketsSample.js"></script>
    <script src="/js/startListener.js"></script>
</head>
<body>
    <div data-win-control="SdkSample.ScenarioInput">
        <p>
            DatagramSocket is used to create the 'server' side of a connection. It listens on a 'service name' (often a port number) and 
            each time a datagram is received on the port number it fires MessageReceived event.
        </p>
        <p>
            <label for="serviceNameAccept">Service Name:</label>
            <input id="serviceNameAccept" type="text" />
        </p>
        <p>
            <button id="buttonStartListener">Listen</button>
        </p>
    </div>
    <div data-win-control="SdkSample.ScenarioOutput">
        <p id="statusBox"></p>
        <p id="outputBox"></p>
    </div>
</body>
</html>

Öffnen Sie den Ordner html. Öffnen Sie eine neue connectToListener.html-Datei, und fügen Sie folgenden HTML-Code in den Bereichen <head> und <body> hinzu.

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <script src="/js/connectToListener.js"></script>
</head>
<body>
    <div data-win-control="SdkSample.ScenarioInput">
        <p>
            Next, you need the 'other side of the connection' -- you need to connect to a listener. The host name
            and service name (often a port number) to connect to are the 'Host name:' and 'Service name:' entries.
            The service name should match what you started to listen to!
        </p>
        <p>
            The connection will automatically use IPv6 as needed. It will also resolve internationalized
            domain names.
        </p>
        <p>
            Due to the network security system, you cannot connect to other applications running on the same
            machine. This means that you can only use 'localhost' to connect to the same application (specifically,
            you can connect to a listener on the same machine running in the same app container)
        </p>
        <p>
            <label for="hostNameConnect">Host Name:</label>
            <input id="hostNameConnect" type="text" disabled="disabled" />
        </p>
        <p>
            <label for="serviceNameConnect">Service Name:</label>
            <input id="serviceNameConnect" type="text" />
        </p>
        <p>
            <button id="buttonOpen">Connect Now</button>
        </p>
    </div>
    <div data-win-control="SdkSample.ScenarioOutput">
        <p id="statusBox"></p>
        <p id="outputBox"></p>
    </div>
</body>
</html>

Öffnen Sie den Ordner html. Öffnen Sie eine neue sendData.html-Datei, und fügen Sie folgenden HTML-Code in den Abschnitten <head> und <body> hinzu.

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <script src="/js/sendData.js"></script>
</head>
<body>
    <div data-win-control="SdkSample.ScenarioInput">
        <p>
            Now you can send data to the "server". Sending data is often done with the DataWriter
            object; it will write to the socket stream.
        </p>
        <p>
            <button id="buttonSend">Send 'hello' now</button>
        </p>
    </div>
    <div data-win-control="SdkSample.ScenarioOutput">
        <p id="statusBox"></p>
        <p id="outputBox"></p>
    </div>
</body>
</html>

Öffnen Sie den Ordner html. Öffnen Sie eine neue closeSocket.html-Datei, und fügen Sie folgenden HTML-Code in den Bereichen <head> und <body> hinzu.

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <script src="/js/closeSocket.js"></script>
</head>
<body>
    <div data-win-control="SdkSample.ScenarioInput">
        <p>
            Lastly, you can close all sockets.
        </p>
        <p>
            If you don't close your socket, it will be closed for you when the application exits.
        </p>
        <p>
            <button id="buttonClose">Close all sockets</button>
        </p>
    </div>
    <div data-win-control="SdkSample.ScenarioOutput">
        <p id="statusBox"></p>
        <p id="outputBox"></p>
    </div>
</body>
</html>

4. Definieren des Beispiels und der Szenarien

Der Code in diesem Schritt definiert das Beispiel, die HTML-Dateien und die Szenarien, die im Beispiel verwendet werden. Außerdem fügt der Code Ereignislistener hinzu und startet die App. Die Szenariooptionen ermöglichen es dem Benutzer, den Socketlistener sowie den Client für die Verbindung mit dem Listener zu starten, Daten mit dem Client an den Server zu senden und die Sockets zu schließen.

Öffnen Sie den Ordner js. Öffnen Sie die Datei default.js, und fügen Sie ihr den folgenden Code hinzu.

    var sampleTitle = "DatagramSocket";

    var scenarios = [
        { url: "/html/startListener.html", title: "Start DatagramSocket Listener" },
        { url: "/html/connectToListener.html", title: "Connect to Listener" },
        { url: "/html/sendData.html", title: "Send Data" },
        { url: "/html/closeSocket.html", title: "Close Socket" }
    ];

    function activated(eventObject) {
        if (eventObject.detail.kind === Windows.ApplicationModel.Activation.ActivationKind.launch) {
            // Use setPromise to indicate to the system that the splash screen must not be torn down
            // until after processAll and navigate complete asynchronously.
            eventObject.setPromise(WinJS.UI.processAll().then(function () {
                // Navigate to either the first scenario or to the last running scenario
                // before suspension or termination.
                var url = WinJS.Application.sessionState.lastUrl || scenarios[0].url;
                return WinJS.Navigation.navigate(url);
            }));
        }
    }

    WinJS.Navigation.addEventListener("navigated", function (eventObject) {
        var url = eventObject.detail.location;
        var host = document.getElementById("contentHost");
        // Call unload method on current scenario, if there is one
        host.winControl && host.winControl.unload && host.winControl.unload();
        WinJS.Utilities.empty(host);
        eventObject.detail.setPromise(WinJS.UI.Pages.render(url, host, eventObject.detail.state).then(function () {
            WinJS.Application.sessionState.lastUrl = url;
        }));
    });

    WinJS.Namespace.define("SdkSample", {
        sampleTitle: sampleTitle,
        scenarios: scenarios
    });

    WinJS.Application.addEventListener("activated", activated, false);
    WinJS.Application.start();

5. Definieren von Variablen für Sockets und Ereignisfunktionen

Der Code in diesem Schritt erstellt einige Variablen, einschließlich Listenersocket, Clientsocket sowie verschiedene Variablen für Fehler und Ereignisse. Variablen werden erstellt, um nachzuverfolgen, ob der Clientsocket sich im verbundenen oder geschlossenen Zustand befindet. In diesem Schritt wird auch der Hostname und der Dienstname (UDP-Port) zum Verbinden und Senden von Daten sowie der lokale Dienstname (UDP-Port) definiert, für den Daten akzeptiert und empfangen werden sollen. Die Werte für den Remotehostnamen, den Remotedienstnamen und den lokalen Dienstnamen werden auf einen Standardwert festgelegt, der in der Benutzeroberfläche geändert werden kann.

Öffnen Sie den Ordner js. Öffnen Sie eine neue Datei socketsSample.js, und fügen Sie ihr folgenden Code hinzu.

var socketsSample = {};

(function () {
    "use strict";

    socketsSample.listener = null;
    socketsSample.listenerOutputStream = null;
    socketsSample.listenerPeerAddress = null;
    socketsSample.listenerPeerPort = null;
    socketsSample.clientSocket = null;
    socketsSample.clientDataWriter = null;
    socketsSample.connected = false;
    socketsSample.closing = false;
    socketsSample.bindingToService = false;

    socketsSample.serviceNameAccept = "22112";
    socketsSample.hostNameConnect = "localhost";
    socketsSample.serviceNameConnect = "22112";

    socketsSample.close = function () {

        socketsSample.closing = true;

        if (socketsSample.listener) {
            socketsSample.listener.close();
        }

        if (socketsSample.clientSocket) {
            socketsSample.clientSocket.close();
        }

        socketsSample.listener = null;
        socketsSample.listenerOutputStream = null;
        socketsSample.listenerPeerAddress = null;
        socketsSample.listenerPeerPort = null;
        socketsSample.clientSocket = null;
        socketsSample.clientDataWriter = null;
        socketsSample.connected = false;
    };

    socketsSample.displayStatus = function (message) {
        document.getElementById("statusBox").innerHTML = message;
    };

    socketsSample.displayOutput = function (message) {
        document.getElementById("outputBox").innerHTML = message;
    };

    socketsSample.setValues = function () {
        var serviceNameAcceptInput = document.getElementById("serviceNameAccept");
        var hostNameConnectInput = document.getElementById("hostNameConnect");
        var serviceNameConnectInput = document.getElementById("serviceNameConnect");

        if (serviceNameAcceptInput) {
            serviceNameAcceptInput.value = socketsSample.serviceNameAccept;
        }
        if (hostNameConnectInput) {
            hostNameConnectInput.value = socketsSample.hostNameConnect;
        }
        if (serviceNameConnectInput) {
            serviceNameConnectInput.value = socketsSample.serviceNameConnect;
        }
    };

    socketsSample.getValues = function (evt) {
        switch (evt.target.id) {
            case "serviceNameAccept":
                socketsSample.serviceNameAccept = evt.target.value;
                break;
            case "hostNameConnect":
                socketsSample.hostNameConnect = evt.target.value;
                break;
            case "serviceNameConnect":
                socketsSample.serviceNameConnect = evt.target.value;
                break;
        }
    };
})();

6. Erstellen eines Listeners und Überwachen eines Dienstnamens (Port)

Der Code in diesem Abschnitt erstellt einen Listener und beginnt mit der Überwachung. Es werden auch Funktionen zum Behandeln von Ereignissen hinzugefügt, wenn der Benutzer anfordert, dass der Listener an eine IP-Adresse und einen UDP-Port gebunden wird, eine Verbindung akzeptiert und vom Client gesendete Daten liest.

Hinweis Dieses spezifische Beispiel ist in sich geschlossen (Client und Server befinden sich in derselben App). Normalerweise gibt es jedoch separate Client- und Server-Apps.

Öffnen Sie den Ordner js. Öffnen Sie eine neue Datei startListener.js, und fügen Sie ihr folgenden Code hinzu.

    var page = WinJS.UI.Pages.define("/html/startListener.html", {
        ready: function (element, options) {
            document.getElementById("buttonStartListener").addEventListener("click", startListener, false);
            document.getElementById("serviceNameAccept").addEventListener("change", socketsSample.getValues, false);
            socketsSample.setValues();
        }
    });

    function startListener() {
        var serviceName = document.getElementById("serviceNameAccept").value;
        if (serviceName === "") {
            socketsSample.displayStatus("Please provide a service name.");
            return;
        }

        if (socketsSample.listener) {
            socketsSample.displayStatus("Already have a listener; call close to close the listener.");
            return;
        }

        socketsSample.closing = false;
        socketsSample.bindingToService = true;
        socketsSample.listener = new Windows.Networking.Sockets.DatagramSocket();
        socketsSample.listener.addEventListener("messagereceived", onServerMessageReceived);
        socketsSample.displayStatus("Server: listener creation started.");
        socketsSample.listener.bindServiceNameAsync(serviceName).done(function () {
            socketsSample.displayStatus("Server: listener creation completed.");
            socketsSample.bindingToService = false;
        }, onError);
    }

    function onServerMessageReceived(eventArgument) {
        if (socketsSample.listenerOutputStream) {
            echoMessage(socketsSample.listenerOutputStream, eventArgument);
            return;
        }

        socketsSample.listener.getOutputStreamAsync(eventArgument.remoteAddress, eventArgument.remotePort).done(function (outputStream) {
            if (!socketsSample.listenerOutputStream) {
                socketsSample.listenerOutputStream = outputStream;
                socketsSample.listenerPeerAddress = eventArgument.remoteAddress;
                socketsSample.listenerPeerPort = eventArgument.remotePort;
            }

            echoMessage(socketsSample.listenerOutputStream, eventArgument);
        });
    }

    function echoMessage(outputStream, eventArgument) {
        if (socketsSample.listenerPeerAddress !== eventArgument.remoteAddress ||
            socketsSample.listenerPeerPort !== eventArgument.remotePort) {
            socketsSample.displayStatus("Got datagram from " + eventArguments.remoteAddress + ":" + eventArguments.remotePort +
                ", but already 'connected' to " + socketsSample.listenerPeerAddress + ":" + socketsSample.listenerPeerPort);
            return;
        }

        outputStream.writeAsync(eventArgument.getDataReader().detachBuffer()).done(function () {
            // Do nothing - client will print out a message when data is received.
        });
    }

    function onError(reason) {
        // Clean up a listener if we failed to bind to a port.
        if (socketsSample.bindingToService) {
            socketsSample.listener = null;
            socketsSample.bindingToService = false;
        }

        // When we close a socket, outstanding async operations will be canceled and the
        // error callbacks called.  There's no point in displaying those errors.
        if (!socketsSample.closing) {
            socketsSample.displayStatus(reason);
        }
    }

7. Erstellen des Sockets und Herstellen einer Verbindung zu einem Remote-Endpunkt

Der Code in diesem Schritt fügt eine Funktion zum Erstellen eines Sockets hinzu und stellt unter Verwendung der DatagramSocket.ConnectAsync-Methode eine Verbindung mit dem Remoteendpunkt, normalerweise einem Server, her. Es wird eine Funktion zum Behandeln von Nachrichten, die vom Client empfangen wurden, hinzugefügt. Außerdem wird eine Funktion zum Behandeln von Verbindungsfehlern des Clients hinzugefügt.

Öffnen Sie den Ordner js. Öffnen Sie eine neue Datei connectToListener.js, und fügen Sie ihr folgenden Code hinzu.

    var page = WinJS.UI.Pages.define("/html/connectToListener.html", {
        ready: function (element, options) {
            document.getElementById("buttonOpen").addEventListener("click", openClient, false);
            document.getElementById("hostNameConnect").addEventListener("change", socketsSample.getValues, false);
            document.getElementById("serviceNameConnect").addEventListener("change", socketsSample.getValues, false);
            socketsSample.setValues();
        }
    });

    function openClient() {
        var serviceName = document.getElementById("serviceNameConnect").value;
        if (serviceName === "") {
            socketsSample.displayStatus("Please provide a service name.");
            return;
        }

        // By default 'hostNameConnect' is disabled and host name validation is not required. When enabling the text
        // box validating the host name is required since it was received from an untrusted source (user input).
        // Note that when enabling the text box users may provide names for hosts on the intErnet that require the
        // "Internet (Client)" capability.
        var hostName;
        try {
            hostName = new Windows.Networking.HostName(document.getElementById("hostNameConnect").value);
        } catch (error) {
            socketsSample.displayStatus("Error: Invalid host name.");
            return;
        }

        if (socketsSample.clientSocket) {
            socketsSample.displayStatus("Already have a client; call close to close the listener and the client.");
            return;
        }

        socketsSample.closing = false;
        socketsSample.clientSocket = new Windows.Networking.Sockets.DatagramSocket();
        socketsSample.clientSocket.addEventListener("messagereceived", onMessageReceived);
        socketsSample.displayStatus("Client: connection started.");
        socketsSample.clientSocket.connectAsync(hostName, serviceName).done(function () {
            socketsSample.displayStatus("Client: connection completed.");
            socketsSample.connected = true;
        }, onError);
    }

    function onMessageReceived(eventArgument) {
        try {
            var messageLength = eventArgument.getDataReader().unconsumedBufferLength;
            var message = eventArgument.getDataReader().readString(messageLength);
            socketsSample.displayStatus("Client: receive message from server \"" + message + "\"");
        } catch (exception) {
            status = Windows.Networking.Sockets.SocketError.getStatus(exception.number);
            if (status === Windows.Networking.Sockets.SocketErrorStatus.connectionResetByPeer) {
                socketsSample.displayStatus("Peer does not listen on the specific port. Please make sure that you run step 1 first " +
                "or you have a server properly working on a remote server.");
            } else {
                socketsSample.displayStatus("Error happened when receiving a datagram: " + exception.message);
            }
        }
    }

    function onError(reason) {
        socketsSample.clientSocket = null;

        // When we close a socket, outstanding async operations will be canceled and the
        // error callbacks called.  There's no point in displaying those errors.
        if (!socketsSample.closing) {
            socketsSample.displayStatus(reason);
        }
    }

8. Senden und Empfangen von Daten auf dem Client

Der Code in diesem Schritt fügt eine Funktion zum Senden von Daten an den Remote-UDP-Endpunkt mit Methoden der Windows.Storage.Streams.DataWriter-Klasse hinzu.

Öffnen Sie den Ordner js. Öffnen Sie eine neue Datei sendData.js, und fügen Sie ihr den folgenden Code hinzu.

    var page = WinJS.UI.Pages.define("/html/sendData.html", {
        ready: function (element, options) {
            document.getElementById("buttonSend").addEventListener("click", sendHello, false);
        }
    });

    function sendHello() {
        if (!socketsSample.connected) {
            socketsSample.displayStatus("Client: you must connect the client before using it.");
            return;
        }

        if (!socketsSample.clientDataWriter) {
            socketsSample.clientDataWriter = new Windows.Storage.Streams.DataWriter(socketsSample.clientSocket.outputStream);
        }

        var string = "Hello World";
        socketsSample.clientDataWriter.writeString(string);

        socketsSample.displayStatus("Client sending: " + string + ".");
        socketsSample.clientDataWriter.storeAsync().done(function () {
            socketsSample.displayStatus("Client sent: " + string + ".");
        }, onError);
    }

    function onError(reason) {
        // When we close a socket, outstanding async operations will be canceled and the
        // error callbacks called.  There's no point in displaying those errors.
        if (!socketsSample.closing) {
            socketsSample.displayStatus(reason);
        }
    }

9. Schließen der Sockets

Der Code in diesem Schritt schließt die Sockets mit der DatagramSocket.Close-Methode. Beim Schließen von Sockets werden alle ausstehenden Vorgänge beendet und Fehlerroutinen aufgerufen.

Öffnen Sie den Ordner js. Öffnen Sie eine neue Datei socketClose.js, und fügen Sie ihr folgenden Code hinzu.

    var page = WinJS.UI.Pages.define("/html/sendData.html", {
        ready: function (element, options) {
            document.getElementById("buttonSend").addEventListener("click", sendHello, false);
        }
    });

    function sendHello() {
        if (!socketsSample.connected) {
            socketsSample.displayStatus("Client: you must connect the client before using it.");
            return;
        }

        if (!socketsSample.clientDataWriter) {
            socketsSample.clientDataWriter = new Windows.Storage.Streams.DataWriter(socketsSample.clientSocket.outputStream);
        }

        var string = "Hello World";
        socketsSample.clientDataWriter.writeString(string);

        socketsSample.displayStatus("Client sending: " + string + ".");
        socketsSample.clientDataWriter.storeAsync().done(function () {
            socketsSample.displayStatus("Client sent: " + string + ".");
        }, onError);
    }

    function onError(reason) {
        // When we close a socket, outstanding async operations will be canceled and the
        // error callbacks called.  There's no point in displaying those errors.
        if (!socketsSample.closing) {
            socketsSample.displayStatus(reason);
        }
    }

10. Ausführen der App

Zum Ausführen der App drücken Sie in Visual Studio die F5-Taste, um das Projekt auszuführen. Wählen Sie die Schaltflächen aus, um den Listener zu starten, die Verbindung des Clients mit dem Listener herzustellen, Daten zu senden und Sockets zu schließen.

Zusammenfassung und nächste Schritte

In diesem Thema haben Sie eine App erstellt, die einen UDP-Datagrammsocket verwendet, um eine Netzwerkverbindung herzustellen und Daten mit einem DatagramSocket-Objekt zu senden. In dieser App wurde auch gezeigt, wie an einem UDP-Port gelauscht und Daten empfangen werden.

Quellcode und Builddateien für dieses Thema sind als DatagramSocket-Beispiel verfügbar.

Sie können auch einen Streamsocket verwenden, um Netzwerkverbindungen zum Senden und Empfangen von Daten herzustellen. Ein Beispiel dazu finden Sie unter So wird's gemacht: Herstellen einer Verbindung mit einem Streamsocket.

Freigeben über