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

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

Mit der App Installer-App können Entwickler und IT-Spezialisten Windows 10-Apps verteilen, indem sie sie auf ihrem eigenen Content Delivery Network (CDN) hosten. Dies ist nützlich für Unternehmen, die ihre Apps nicht im Microsoft Store veröffentlichen möchten oder veröffentlichen müssen, aber trotzdem die Windows 10-Paket- und Bereitstellungsplattform nutzen möchten.

Setup

Um mit diesem Lernprogramm erfolgreich zu durchlaufen, benötigen Sie folgendes:

  1. Visual Studio 2017
  2. Webentwicklungstools und IIS
  3. Windows 10-App-Paket – Das App-Paket, das Sie verteilen werden

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

Schritt 1 – Installieren von IIS und ASP.NET

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

Suchen und Auswählen von Internetinformationsdienste zum Installieren von IIS.

Hinweis

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

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

Screenshot of installing ASP.NET feature

Schritt 2 – Installieren von Visual Studio 2017- und Webentwicklungstools

Installieren Sie Visual Studio 2017 , wenn Sie es noch nicht 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 dem Visual Studio Installer (gefunden im Startmenü).

Wählen Sie während der Installation ASP.NET und Webentwicklung und alle anderen Workloads aus, die Sie interessieren.

Nachdem die Installation abgeschlossen ist, starten Sie Visual Studio, und erstellen Sie ein neues Projekt (File ->New Project).

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ü lokale 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 Startprojektwebanwendung wurde einem neuen Ordner der Web-App namens "Pakete " hinzugefügt, die die zu verteilenden App-Pakete enthalten. Um den Ordner in Visual Studio zu erstellen, klicken Sie mit der rechten Maustaste auf den Projektknoten im Projektmappen-Explorer, wählen Sie "NeuenOrdner hinzufügen>" aus, und benennen Sie sie pakete. Um App-Pakete zum Ordner hinzuzufügen, klicken Sie mit der rechten Maustaste auf den Paketordner, und wählen Sie "Vorhandenes Element hinzufügen" aus, und navigieren Sie zum App-Paketspeicherort.>

Screenshot of adding a package

Schritt 6 – Erstellen einer Webseite

In dieser Beispielweb-App werden einfache HTML-Dateien verwendet. Sie können Ihre Web-App nach Bedarf erstellen.

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

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

Doppelklicken Sie auf die HTML-Datei, um sie im Code-Editorfenster zu öffnen. In diesem Lernprogramm werden nur die Elemente auf der Webseite benötigt, um die App Installer-App erfolgreich zu installieren, um eine Windows 10-App zu installieren.

Fügen Sie den folgenden HTML-Code auf Ihrer Webseite hinzu. Der Schlüssel zum erfolgreichen Aufrufen des App-Installers besteht darin, das benutzerdefinierte Schema zu verwenden, das app Installer mit dem Betriebssystem registriert: ms-appinstaller:?source= Weitere Details finden Sie im folgenden Codebeispiel.

Hinweis

Stellen Sie sicher, dass der URL-Pfad, der nach dem benutzerdefinierten Schema mit der Projekt-URL in 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 App-Paket-MIME-Typen

Öffnen Sie die Web.config Datei aus dem <configuration> Projektmappen-Explorer, und fügen Sie die folgenden Zeilen im Element 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 neuester Microsoft-Webtechnologie .NET Core. Websitebuild mit .NET Core ASP ignorieren web.config statische Inhalts mimeMap. Daher müssen Sie eine richtige Konfiguration der .NET Core-Website ausführen, die Ihre MSIX-Installation hostet, die Sie in der Datei "Startup.cs" ändern müssen. Besuchen Sie die Dokumentation .NET Core , um weitere Informationen zu erhalten.

Schritt 8 – Hinzufügen von Loopback-Ausnahme für App Installer

Aufgrund der Netzwerkisolierung sind Windows 10-Apps wie App Installer auf die Verwendung von IP-Loopbackadressen beschränkt wie z. B. http://localhost/. Wenn Sie lokalen IIS-Server verwenden, muss das App-Installationsprogramm 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

Verwenden Sie zum Überprüfen, ob die App zur ausgenommenen Liste hinzugefügt wird, verwenden Sie den folgenden Befehl, um die Apps in der Loopback-ausnahmeliste anzuzeigen:

CheckNetIsolation.exe LoopbackExempt -s

Sie sollten in der Liste finden microsoft.desktopappinstaller_8wekyb3d8bbwe .

Sobald die lokale Überprüfung der App-Installation über App Installer abgeschlossen ist, können Sie die Loopback-Ausnahme 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, 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 genügend Berechtigungen

Wenn die Web-App in Visual Studio einen Fehler anzeigt, z. B. "Sie verfügen nicht über ausreichende Berechtigungen zum 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.

Startseite festlegen

Wenn das Ausführen der Web-App bewirkt, dass der Browser mit einem HTTP 403.14 -Verbotenen Fehler geladen wird, liegt es daran, dass die Web-App keine definierte Startseite hat. Informationen zum Definieren einer Startseite finden Sie in diesem Lernprogramm in Schritt 6.