Windows Device Portal 用のカスタム プラグインを作成する

Windows Device Portal を使用して Web ページをホストし、診断情報を提供するパッケージ アプリ (Windows アプリ SDK を使用して UWP またはパッケージ化された Win32) を作成できます。 Device Portal プラグイン機能は、UI フレームワークに関係なく、パッケージ化されたすべてのアプリで使用できる windows.devicePortalProvider 拡張機能を使用して実装されます。

Device Portal プラグインのサポートは、Windows 10 以降で利用できます。

プロジェクトを作成する

Microsoft Visual Studioで新しいアプリ プロジェクトを作成します。 [ファイル] > [新しい> Project] に移動し、次のproject テンプレートのいずれかを選択します。

• UWP アプリの場合: C# 用の空のアプリ (Windows ユニバーサル)
• WinUI 3 デスクトップ アプリの場合: パッケージ化された空のアプリ (Desktop の WinUI 3)

[ 新しいプロジェクトの構成 ] ダイアログ ボックスで、プロジェクトに DevicePortalProvider という名前を付け、[ 作成] をクリックします。 これは、アプリ サービスを含むアプリになります。

devicePortalProvider 機能を追加する

アプリのrescap:devicePortalProvider ファイルにPackage.appxmanifest機能を追加します。

ソリューション エクスプローラーで、Package.appxmanifestをダブルクリックしてマニフェスト デザイナーを開き、[機能] タブに切り替えて、デバイス ポータル プロバイダーが表示されている場合はオンにするか、XML を編集して手動で追加します。

<Capabilities>
  <rescap:Capability Name="devicePortalProvider" />
</Capabilities>

アプリ サービスを設定する

Device Portal プラグインは、 アプリ サービス を使用して、プラグイン ホスト プロセスと Device Portal の間で通信します。 Package.appxmanifest開き、[宣言] タブに切り替え、Windows Device Portal プロバイダー宣言を追加して、サービス名で構成します。

または、XML を直接編集します。

<Applications>
  <Application Id="App" ...>
    ...
    <Extensions>
      <uap3:Extension Category="windows.appService" EntryPoint="DevicePortalProvider.DevicePortalPluginService">
        <uap3:AppService Name="com.microsoft.myapp.devicePortalService" SupportsRemoteSystems="true"/>
      </uap3:Extension>
      <uap4:Extension Category="windows.devicePortalProvider">
        <uap4:DevicePortalProvider DisplayName="My App Plugin" AppServiceName="com.microsoft.myapp.devicePortalService" HandlerRoute="/MyCustomApp/"/>
      </uap4:Extension>
    </Extensions>
  </Application>
</Applications>

<Package
  ...
  xmlns:uap3="http://schemas.microsoft.com/appx/manifest/uap/windows10/3"
  xmlns:uap4="http://schemas.microsoft.com/appx/manifest/uap/windows10/4"
  IgnorableNamespaces="... uap3 uap4">

次の属性には、アプリに固有の構成が必要です。

App Service コードを追加する

Windows ランタイム コンポーネント プロジェクトをソリューションに追加して、バックグラウンド アプリ サービスをホストします。

1. ソリューション エクスプローラーで、ソリューションを右クリックし、[新しいProject>追加] を選択します。
2. Windows ランタイム コンポーネント (ユニバーサル Windows) を選択し、DevicePortalProvider という名前を付けます。
3. 新しいプロジェクトを右クリックし、[ Add > New Item > App Service] を選択します。

App Service コードの実装の詳細については、 App Service の作成と使用に関する記事を 参照してください。

Device Portal ハンドラーを実装する

Device Portal プラグイン アプリ サービスの実装例を次に示します。

using Windows.ApplicationModel.AppService;
using Windows.ApplicationModel.Background;
using Windows.Storage;
using Windows.System.Diagnostics.DevicePortal;
using Windows.Web.Http;

namespace DevicePortalProvider
{
    public sealed class DevicePortalPluginService : IBackgroundTask
    {
        private BackgroundTaskDeferral _taskDeferral;
        private DevicePortalConnection _connection;

        public void Run(IBackgroundTaskInstance taskInstance)
        {
            _taskDeferral = taskInstance.GetDeferral();
            taskInstance.Canceled += OnTaskCanceled;

            var triggerDetails = taskInstance.TriggerDetails as AppServiceTriggerDetails;
            _connection = DevicePortalConnection.GetForAppServiceConnection(triggerDetails.AppServiceConnection);
            _connection.RequestReceived += _connection_RequestReceived;
        }

        private void OnTaskCanceled(IBackgroundTaskInstance taskInstance, BackgroundTaskCancellationReason reason)
        {
            _taskDeferral.Complete();
        }

        private async void _connection_RequestReceived(DevicePortalConnection sender, DevicePortalConnectionRequestReceivedEventArgs args)
        {
            // Handle the incoming request and send a response
        }
    }
}

受信要求を処理する

プラグイン ハンドラーは、Device Portal が HandlerRouteにルーティングするすべての GET、POST、DELETE、および PUT 要求を受け取ります。 一般的な実装:

private async void _connection_RequestReceived(
    DevicePortalConnection sender, 
    DevicePortalConnectionRequestReceivedEventArgs args)
{
    var request = args.RequestMessage;
    var response = args.ResponseMessage;

    // Use the request's path to determine what data to return
    // The path must begin with the HandlerRoute declared in the manifest (e.g. "/MyCustomApp/")
    if (request.RequestUri.LocalPath.Equals("/MyCustomApp/info", StringComparison.OrdinalIgnoreCase))
    {
        response.Content = new HttpStringContent(
            "{ \"appVersion\": \"1.0\" }",
            Windows.Storage.Streams.UnicodeEncoding.Utf8,
            "application/json");
        response.StatusCode = HttpStatusCode.Ok;
    }
}

静的コンテンツを提供する

アプリのパッケージ内から Web コンテンツ (HTML、CSS、JavaScript) を提供する場合は、それらのファイルをフォルダーに配置し、ファイル コンテンツを使用して要求に応答できます。

private async void _connection_RequestReceived(
    DevicePortalConnection sender,
    DevicePortalConnectionRequestReceivedEventArgs args)
{
    var storageFile = await Windows.ApplicationModel.Package.Current.InstalledLocation.GetFileAsync(@"data\content.html");
    string htmlContent = await FileIO.ReadTextAsync(storageFile);

    args.ResponseMessage.Content = new HttpStringContent(
        htmlContent,
        Windows.Storage.Streams.UnicodeEncoding.Utf8,
        "text/html");
    args.ResponseMessage.StatusCode = HttpStatusCode.Ok;
}

アプリ サービスをシステムとして実行する

場合によっては、Device Portal プラグインの完全なテストのために、プラグインをシステム アカウントとして実行することが必要になる場合があります。 詳細については、 MSDN マガジンの記事 を参照してください。

こちらも参照ください

• Windows デバイス ポータルの概要
• アプリ機能宣言
• アプリサービスを作成および使用する
• Windows Device Portal のコア API リファレンス