Verteilen einer Windows 10-App über einen IIS-Server

In diesem Tutorial wird veranschaulicht, wie Sie einen IIS-Server einrichten, überprüfen, ob Ihre Web-App App-Pakete hosten und App-Installer effektiv aufrufen und verwenden kann.

Mit der App-Installer-App können Entwickler und IT-Experten Windows 10-Apps verteilen, indem sie in ihrem eigenen Content Delivery Network (CDN) gehostet werden. Dies ist nützlich für Unternehmen, die ihre Apps nicht im Microsoft Store veröffentlichen wollen oder müssen, aber dennoch die Vorteile der Verpackungs- und Bereitstellungsplattform von Windows 10 nutzen möchten.

Einrichten

Um dieses Tutorial erfolgreich durchzuführen, benötigen Sie Folgendes:

  1. Visual Studio 2017
  2. Webentwicklungs-Tools und IIS
  3. Windows 10-App-Paket – Das App-Paket, das Sie verteilen möchten

Optional: Startprojekt auf GitHub. Dies ist hilfreich, wenn Sie nicht über App-Pakete verfügen, mit denen Sie arbeiten können, aber dennoch erfahren möchten, wie Sie dieses Feature verwenden.

Schritt 1 - Installieren von IIS und ASP.NET

Internetinformationsdienste ist ein Windows-Feature, das über das Startmenü installiert werden kann. Suchen Sie im Startmenü nach Windows-Features aktivieren oder deaktivieren.

Suchen und wählen Sie Internetinformationsdienste aus, um IIS zu installieren.

Hinweis

Sie müssen nicht alle Kontrollkästchen unter Internetinformationsdienste auswählen. Nur die ausgewählten, wenn Sie Internetinformationsdienste überprüfen, sind ausreichend.

Außerdem müssen Sie ASP.NET 4.5 oder höher installieren. Um es zu installieren, suchen Sie Internetinformationsdienste -> World Wide Web Services -> Anwendungsentwicklungsfunktionen. Wählen Sie eine Version von ASP.NET aus, die höher oder gleich ASP.NET 4.5 ist.

Screenshot of installing ASP.NET feature

Schritt 2 - Installieren von Visual Studio 2017 und Webentwicklungs-Tools

Installieren Sie Visual Studio 2017, falls Sie es nicht bereits installiert haben. Wenn Sie bereits über Visual Studio 2017 verfügen, stellen Sie sicher, dass die folgenden Workloads installiert sind. Wenn die Workloads in Ihrer Installation nicht vorhanden sind, folgen Sie dieser Anleitung mit dem Visual Studio-Installer (zu finden über das Startmenü).

Wählen Sie während der Installation ASP.NET und Webentwicklung und alle anderen Workloads aus, an denen Sie interessiert sind.

Sobald die Installation abgeschlossen ist, starten Sie Visual Studio und erstellen Sie ein neues Projekt (Datei ->Neues Projekt).

Schritt 3 - Erstellen einer Web-App

Starten Sie Visual Studio 2017 als Administrator und erstellen Sie ein neues Visual C#-Webanwendungsprojekt mit einer leeren Projektvorlage.

Screenshot of creating a new web project

Schritt 4 - Konfigurieren von IIS mit unserer Web-App

Klicken Sie im Projektmappen-Explorer mit der rechten Maustaste auf das Stammprojekt und wählen Sie Eigenschaften aus.

Wählen Sie in den Web-App-Eigenschaften die Registerkarte Web aus. Wählen Sie im Abschnitt Server im Dropdownmenü Lokales IIS aus und klicken Sie auf Virtuelles Verzeichnis erstellen.

Screenshot of web tab in project properties

Schritt 5 - Hinzufügen eines App-Pakets zu einer Webanwendung

Fügen Sie das App-Paket hinzu, das Sie in die Webanwendung verteilen möchten. Sie können das App-Paket verwenden, das Teil der bereitgestellten Startprojektpakete auf GitHub ist, wenn Sie kein App-Paket verfügbar haben. Das Zertifikat (MySampleApp.cer), mit dem das Paket signiert wurde, ist auch mit dem Beispiel auf GitHub. Sie müssen das Zertifikat vor der Installation der App (Schritt 9) auf Ihrem Gerät installiert haben.

In der Startprojekt-Webanwendung wurde der Web-App ein neuer Ordner namens Pakete hinzugefügt, der die zu verteilenden App-Pakete enthält. Um den Ordner in Visual Studio zu erstellen, klicken Sie mit der rechten Maustaste auf den Projektknoten im Projektmappen-Explorer, wählen Sie Hinzufügen ->Neuen Ordner und benennen Sie ihn Pakete. Um dem Ordner Anwendungspakete hinzuzufügen, klicken Sie mit der rechten Maustaste auf den Ordner Pakete und wählen Sie Hinzufügen - >Vorhandenes Element…. und suchen Sie den Speicherort des Anwendungspakets.

Screenshot of adding a package

Schritt 6 - Erstellen einer Webseite

Diese Beispiel-Web-App verwendet einfaches HTML. Es steht Ihnen frei, Ihre Web-App nach Ihren Bedürfnissen zu gestalten.

Klicken Sie mit der rechten Maustaste auf das Stammprojekt des Projektmappen-Explorers, wählen Sie Hinzufügen - >Neues Element aus und fügen Sie eine neue HTML-Seite aus dem Anschnitt Web hinzu.

Nachdem die HTML-Seite erstellt wurde, klicken Sie im Projektmappen-Explorer mit der rechten Maustaste auf die HTML-Seite und wählen Sie Als Startseite festlegen aus.

Doppelklicken Sie auf die HTML-Datei, um sie im Code-Editor-Fenster zu öffnen. In diesem Tutorial werden nur die Elemente verwendet, die auf der Webseite erforderlich sind, um die App-Installer-App erfolgreich aufzurufen und eine Windows 10-App zu installieren.

Fügen Sie den folgenden HTML-Code in Ihre Webseite ein. Der Schlüssel zum erfolgreichen Aufrufen von App-Installer besteht darin, das benutzerdefinierte Schema zu verwenden, das App-Installer beim Betriebssystem registriert: ms-appinstaller:?source=. Weitere Einzelheiten finden Sie im nachstehenden Codebeispiel.

Hinweis

Stellen Sie sicher, dass der nach dem benutzerdefinierten Schema angegebene URL-Pfad mit der Project-URL auf der Webregisterkarte Ihrer VS-Lösung übereinstimmt.

<html>
<head>
    <meta charset="utf-8" />
    <title> Install Page </title>
</head>
<body>
    <a href="ms-appinstaller:?source=http://localhost/SampleWebApp/packages/MySampleApp.msixbundle"> Install My Sample App</a>
</body>
</html>

Schritt 7 - Konfigurieren der Web-App für MIME-Typen des App-Pakets

Öffnen Sie die Datei Web.config aus dem Projektmappen-Explorer und fügen Sie die folgenden Zeilen innerhalb des <configuration>-Elements hinzu.

<system.webServer>
    <!--This is to allow the web server to serve resources with the appropriate file extension-->
    <staticContent>
      <mimeMap fileExtension=".appx" mimeType="application/appx" />
      <mimeMap fileExtension=".msix" mimeType="application/msix" />
      <mimeMap fileExtension=".appxbundle" mimeType="application/appxbundle" />
      <mimeMap fileExtension=".msixbundle" mimeType="application/msixbundle" />
      <mimeMap fileExtension=".appinstaller" mimeType="application/appinstaller" />
    </staticContent>
</system.webServer>

Hinweis

Auf der neuesten Microsoft-Webtechnologie .NET Core. Website-Erstellung mit .NET Core ASP ignoriert mimeMap mit statischem-web.config-Inhalt. Infolgedessen müssen Sie eine ordnungsgemäße Konfiguration der .NET Core-Website, die Ihre MSIX-Installation hosten wird, vornehmen und die Configure-Methode in der Datei Startup.cs ändern. Weitere Informationen finden Sie in der ASP.NET Core-Dokumentation.

Schritt 8 - Hinzufügen von Loopbackausnahmen für App-Installer

Aufgrund der Netzwerkisolation sind Windows 10-Apps wie App-Installer auf die Verwendung von IP-Loopbackadressen wie http://localhost/. beschränkt Wenn Sie einen lokalen IIS-Server verwenden, muss App-Installer der Loopback-Ausnahmeliste hinzugefügt werden.

Öffnen Sie dazu die Eingabeaufforderung als Administrator und geben Sie Folgendes ein:

CheckNetIsolation.exe LoopbackExempt -a -n=microsoft.desktopappinstaller_8wekyb3d8bbwe

Um zu überprüfen, ob die Anwendung zur Ausnahmeliste hinzugefügt wurde, verwenden Sie den folgenden Befehl, um die Anwendungen in der Loopback-Ausnahmeliste anzuzeigen:

CheckNetIsolation.exe LoopbackExempt -s

Sie sollten microsoft.desktopappinstaller_8wekyb3d8bbwe in der Liste finden.

Sobald die lokale Überprüfung der App-Installation über App-Installer abgeschlossen ist, können Sie die Loopbackausnahme entfernen, die Sie in diesem Schritt hinzugefügt haben:

CheckNetIsolation.exe LoopbackExempt -d -n=microsoft.desktopappinstaller_8wekyb3d8bbwe

Schritt 9 - Ausführen der Web-App

Erstellen Sie die Webanwendung und führen Sie sie aus, indem Sie auf die Schaltfläche Ausführen im VS-Menüband klicken, wie in der Abbildung unten dargestellt:

Screenshot of running web app in Visual Studio

Eine Webseite wird in Ihrem Browser geöffnet:

Screenshot of installing app from web page

Klicken Sie auf den Link auf der Webseite, um die App-Installer-App zu starten und Ihr Windows 10-App-Paket zu installieren.

Fragen zur Problembehandlung

Nicht ausreichende Berechtigungen

Wenn beim Ausführen der Web-App in Visual Studio ein Fehler angezeigt wird, z. B. „Sie verfügen nicht über ausreichende Berechtigungen für den Zugriff auf IIS-Websites auf Ihrem Computer“, müssen Sie Visual Studio als Administrator ausführen. Schließen Sie die aktuelle Instanz von Visual Studio und öffnen Sie sie als Administrator erneut.

Festlegen der Startseite

Wenn beim Ausführen der Webanwendung der Browser mit einem HTTP 403.14 - Forbidden-Fehler geladen wird, liegt das daran, dass die Webanwendung keine definierte Startseite hat. In diesem Tutorial erfahren Sie in Schritt 6, wie Sie eine Startseite definieren.