Verwenden eines benutzerdefinierten Gateway-Plug-Ins in der Toolerweiterung

Gilt für: Windows Admin Center, Windows Admin Center-Vorschau

In diesem Artikel verwenden wir ein benutzerdefiniertes Gateway-Plug-In in einer neuen, leeren Toolerweiterung, die wir mit der Windows Admin Center CLI erstellt haben.

Vorbereiten der Umgebung

Falls noch nicht erfolgt, befolgen Sie die Anweisungen unter Entwickeln einer Toolerweiterung , um Ihre Umgebung vorzubereiten und eine neue, leere Toolerweiterung zu erstellen.

Hinzufügen eines Moduls zu Ihrem Projekt

Falls noch nicht erfolgt, fügen Sie Ihrem Projekt ein neues leeres Modul hinzu, das wir im nächsten Schritt verwenden werden.

Hinzufügen der Integration zum benutzerdefinierten Gateway-Plug-In

Nun verwenden wir ein benutzerdefiniertes Gateway-Plug-In im neuen, leeren Modul, das wir gerade erstellt haben.

Erstellen von plugin.service.ts

Wechseln Sie zum Verzeichnis des oben erstellten neuen Toolmoduls (\src\app\{!Module-Name}), und erstellen Sie eine neue Datei plugin.service.ts.

Fügen Sie der soeben erstellten Datei den folgenden Code hinzu:

import { Injectable } from '@angular/core';
import { AppContextService, HttpService } from '@microsoft/windows-admin-center-sdk/angular';
import { Cim, Http, PowerShell, PowerShellSession } from '@microsoft/windows-admin-center-sdk/core';
import { AjaxResponse, Observable } from 'rxjs';

@Injectable()
export class PluginService {
    constructor(private appContextService: AppContextService, private http: Http) {
    }

    public getGatewayRestResponse(): Observable<any> {
        let callUrl = this.appContextService.activeConnection.nodeName;

        return this.appContextService.node.get(callUrl, 'features/Sample%20Uno').map(
            (response: any) => {
                return response;
            }
        )
    }
}

Ändern Sie verweise auf Sample Uno und Sample%20Uno nach Bedarf in Ihren Featurenamen.

Warnung

Es wird empfohlen, die integrierte this.appContextService.node zum Aufrufen jeder API zu verwenden, die in Ihrem benutzerdefinierten Gateway-Plug-In definiert ist. Dadurch wird sichergestellt, dass Anmeldeinformationen in Ihrem Gateway-Plug-In ordnungsgemäß verarbeitet werden, wenn anmeldeinformationen erforderlich sind.

Modify module.ts

Öffnen Sie die module.ts Datei des zuvor erstellten neuen Moduls (d. h. {!Module-Name}.module.ts):

Fügen Sie die folgenden import-Anweisungen hinzu:

import { HttpService } from '@microsoft/windows-admin-center-sdk/angular';
import { Http } from '@microsoft/windows-admin-center-sdk/core';
import { PluginService } from './plugin.service';

Fügen Sie die folgenden Anbieter (nach Deklarationen) hinzu:

  ,
  providers: [
    HttpService,
    PluginService,
    Http
  ]

Modify component.ts

Öffnen Sie die component.ts Datei des zuvor erstellten neuen Moduls (d. h. {!Module-Name}.component.ts):

Fügen Sie die folgenden import-Anweisungen hinzu:

import { ActivatedRouteSnapshot } from '@angular/router';
import { AppContextService } from '@microsoft/windows-admin-center-sdk/angular';
import { Subscription } from 'rxjs';
import { Strings } from '../../generated/strings';
import { PluginService } from './plugin.service';

Fügen Sie die folgenden Variablen hinzu:

  private serviceSubscription: Subscription;
  private responseResult: string;

Ändern Sie den Konstruktor, und ändern/fügen Sie die folgenden Funktionen hinzu:

  constructor(private appContextService: AppContextService, private plugin: PluginService) {
    //
  }

  public ngOnInit() {
    this.responseResult = 'click go to do something';
  }

  public onClick() {
    this.serviceSubscription = this.plugin.getGatewayRestResponse().subscribe(
      (response: any) => {
        this.responseResult = 'response: ' + response.message;
      },
      (error) => {
        console.log(error);
      }
    );
  }

Ändern component.html

Öffnen Sie die component.html Datei des zuvor erstellten neuen Moduls (d. h. {!Module-Name}.component.html):

Fügen Sie der HTML-Datei den folgenden Inhalt hinzu:

<button (click)="onClick()" >go</button>
{{ responseResult }}

Erstellen und Querladen der Erweiterung

Nun können Sie Ihre Erweiterung in Windows Admin Center erstellen und querladen.