Share via

イベントベースまたはスパムレポートの Outlook アドインをデバッグする

  • [アーティクル]

この記事では、 アドインでイベント ベースのアクティブ化 または 統合スパム レポート を実装するときに、コードでブレークポイントを有効にして設定するための主要なデバッグ ステージについて説明します。 先に進む前に、開発エラーを解決する方法の追加の手順については 、トラブルシューティング ガイド を確認することをお勧めします。

デバッグを開始するには、該当するクライアントのタブを選択します。

Office アドイン用 Yeoman ジェネレーターを使用してアドイン プロジェクトを作成した場合 (たとえば、イベント ベースのアクティブ化のチュートリアルを完了するなど)、この記事全体を通じて[Yeoman ジェネレーターで作成] オプションに従います。 それ以外の場合は、 その他 の手順に従います。 Visual Studio Code は、少なくともバージョン 1.56.1 である必要があります。

デバッグ用にアドインをマークし、デバッガー ポートを設定する

  1. マニフェストからアドインの ID を取得します。

    • XML マニフェスト: ルート <OfficeApp> 要素の <Id> 要素の子の値を使用します。
    • Microsoft 365 の統合マニフェスト: ルート匿名 { ... } オブジェクトの "id" プロパティの値を使用します。

  2. という名前UseDirectDebuggerHKEY_CURRENT_USER\SOFTWARE\Microsoft\Office\16.0\Wef\Developer\[Add-in ID]のレジストリDWORD値をCreateします。 をマニフェストのアドインの ID に置き換えます [Add-in ID] 。

    注:

    の下HKEY_CURRENT_USER\SOFTWARE\Microsoft\Office\16.0\WEF\にDeveloperキー (フォルダー) がまだ存在しない場合は、次の手順を実行して作成します。

    1. [WEF] キー (フォルダー) を右クリックし、[新規]、[キー] の順に選択します。
    2. 新しいキーに Developer という名前を付けます。

    Yeoman ジェネレーターを使用して作成: コマンド ライン ウィンドウで、アドイン フォルダーのルートに移動し、次のコマンドを実行します。

    npm start

    このコマンドは、コードをビルドしてローカル サーバーを起動するだけでなく、このアドインの UseDirectDebugger レジストリ DWORD 値データを に 1設定します。

    その他: レジストリ DWORD HKEY_CURRENT_USER\SOFTWARE\Microsoft\Office\16.0\WEF\Developer\[Add-in ID]\UseDirectDebugger 値で、ここで [Add-in ID] 、マニフェストからのアドインの ID を に設定します 1。

  3. レジストリ キー HKEY_CURRENT_USER\SOFTWARE\Microsoft\Office\16.0\Wef\Developer\[Add-in ID]で、マニフェスト [Add-in ID] からのアドインの ID を指定し、次の構成で新 DWORD しい値を作成します。

    • 値名: DebuggerPort
    • 値データ (16 進数): 00002407

    これにより、デバッガー ポートが に 9223設定されます。

  4. Outlook を起動するか、既に開いている場合は再起動します。

  5. イベントを開始する新しいメッセージの作成やスパム メッセージの報告など、開発対象のイベントを開始 OnNewMessageCompose するアクションを実行します。 [デバッグ イベント ベースのハンドラー] ダイアログが表示されます。 ダイアログをまだ操作 しないでください 。

    Windows の [デバッグ イベント ベースのハンドラー] ダイアログ。

Visual Studio Code を構成する

Yeoman ジェネレーターを使用して作成

  1. コマンド ライン ウィンドウに戻り、次を実行して、Visual Studio Code でアドイン プロジェクトを開きます。

    code .

  2. Visual Studio Code で 、./.vscode/launch.json ファイルを 開き、構成の一覧に次の抜粋を追加します。 変更内容を保存します。

    {
  "name": "Direct Debugging",
  "type": "node",
  "request": "attach",
  "port": 9223,
  "timeout": 600000,
  "trace": true
}

その他

  1. デバッグという名前の新しいフォルダーをCreateします (デスクトップ フォルダー内など)。

  2. Visual Studio Code を開きます。

  3. [ファイル>を開くフォルダー] に移動し、先ほど作成したフォルダーに移動し、[フォルダーの選択] を選択します。

  4. アクティビティ バーで、 実行とデバッグ (Ctrl + Shift + D) を選択します。

    アクティビティ バーの [実行とデバッグ] アイコン。

  5. [ launch.json ファイルの作成 ] リンクを選択します。

    Visual Studio Code でlaunch.json ファイルを作成するための [実行とデバッグ] オプションの下にあるリンク。

  6. [ 環境の選択 ] ドロップダウンで、[ Edge: 起動 ] を選択して、launch.json ファイルを作成します。

  7. 構成の一覧に次の抜粋を追加します。 変更内容を保存します。

    {
  "name": "Direct Debugging",
  "type": "node",
  "request": "attach",
  "port": 9223,
  "timeout": 600000,
  "trace": true
}

デバッガーをアタッチする

アドイン のbundle.js ファイルには、アドインの JavaScript コードが含まれています。 これは、Outlook on Windows を開いたときに作成されます。 Outlook が起動すると、インストールされている各アドインの bundle.js ファイルがコンピューターの Wef フォルダーにキャッシュされます。

  1. アドインのbundle.jsファイルを見つけるには、エクスプローラー内の次のフォルダーに移動します。 で [] 囲まれたテキストを、該当する Outlook とアドインの情報に置き換えます。

    %LOCALAPPDATA%\Microsoft\Office\16.0\Wef\{[Outlook profile GUID]}\[Outlook mail account encoding]\Javascript\[Add-in ID]_[Add-in Version]_[locale]

    ヒント

    bundle.js ファイルが Wef フォルダーに表示されない場合は、次の手順を試してください。

    • アドインがインストールされているかサイドロードされている場合は、Outlook を再起動します。
    • Outlook からアドインを削除し、もう一度サイドロードします。

  2. Visual Studio Code で bundle.js を開きます。

  3. デバッガーを停止 する場所bundle.js にブレークポイントを配置します。

  4. [ デバッグ ] ドロップダウンで、[ 直接デバッグ] を選択し、[ デバッグの開始 ] アイコンを選択します。

    [Visual Studio Code デバッグ] ドロップダウンの構成オプションから選択された [直接デバッグ] オプション。

デバッガーを実行する

  1. デバッガーがアタッチされていることを確認したら、Outlook に戻り、[ デバッグ イベント ベースのハンドラー ] ダイアログで [OK] を選択 します 。

  2. Visual Studio Code でブレークポイントにヒットし、イベント ベースのアクティブ化またはスパムレポート コードをデバッグできるようになりました。

デバッガーを停止する

現在の Outlook on Windows セッションの残りの部分のデバッグを停止するには、[ イベント ベースのハンドラーのデバッグ ] ダイアログで [キャンセル] を選択 します。 デバッグを再度有効にするには、Outlook を再起動します。

[イベント ベースのハンドラーのデバッグ] ダイアログがポップアップ表示されないようにし、後続の Outlook セッションのデバッグを停止するには、関連付けられているレジストリ キーを削除するか、HKEY_CURRENT_USER\SOFTWARE\Microsoft\Office\16.0\Wef\Developer\[Add-in ID]\UseDirectDebuggerその値を に0設定します。

関連項目