One place for hosting & domains

      So installieren Sie MongoDB aus den Standard-APT-Repositorys unter Ubuntu 20.04


      Einführung

      MongoDB ist eine kostenlose und Open-Source-NoSQL-Dokumentendatenbank, die häufig in modernen Webanwendungen verwendet wird.

      In diesem Tutorial installieren Sie MongoDB, verwalten den Dienst und aktivieren optional den Fernzugriff.

      Hinweis: Zum jetzigen Zeitpunkt wird in diesem Tutorial die Version 3.6 von MongoDB installiert. Dies ist die Version, die in den Standard-Ubuntu-Repositorys verfügbar ist. Wir empfehlen jedoch generell, stattdessen die neueste Version von MongoDB zu installieren – Version 4.4 zum jetzigen Zeitpunkt. Wenn Sie die neueste Version von MongoDB installieren möchten, empfehlen wir Ihnen, diese Anleitung zur Installation von MongoDB unter Ubuntu 20.04 aus dem Quellcode zu befolgen.

      Voraussetzungen

      Um dieser Anleitung zu folgen, benötigen Sie:

      • Ein Ubuntu 20.04-Server, der gemäß des Leitfadens zur Ersteinrichtung des Servers für Ubuntu 20.04 eingerichtet wurde, einschließlich eines non-root users, der über sudo-Berechtigungen verfügt, und einer mit UFW konfigurierten Firewall.

      Schritt 1 — Installieren von MongoDB

      Zu den offiziellen Paket-Repositorys von Ubuntu gehört MongoDB, was bedeutet, dass wir die erforderlichen Pakete mit apt installieren können. Wie in der Einführung erwähnt, ist die aus den Standard-Repositorys verfügbare Version nicht die neueste. Befolgen Sie stattdessen dieses Tutorial, um die neueste Version von Mongo zu installieren.

      Aktualisieren Sie zunächst die Paketliste, um die neueste Version der Repository-Listen zu erhalten:

      Installieren Sie nun die MongoDB selbst:

      Dieser Befehl fordert Sie auf, zu bestätigen, dass Sie das Paket mongodb und seine Abhängigkeiten installieren möchten. Drücken Sie dazu Y und dann ENTER.

      Der Datenbankserver wird nach der Installation automatisch gestartet.

      Überprüfen wir als Nächstes, ob der Server ausgeführt wird und korrekt funktioniert.

      Schritt 2 — Überprüfen des Dienstes und der Datenbank

      Der Installationsprozess hat MongoDB automatisch gestartet. Überprüfen Sie jedoch, ob der Dienst gestartet wurde und die Datenbank funktioniert.

      Überprüfen Sie als erstes den Status des Dienstes:

      • sudo systemctl status mongodb

      Sie sehen diese Ausgabe:

      Output

      ● mongodb.service - An object/document-oriented database Loaded: loaded (/lib/systemd/system/mongodb.service; enabled; vendor preset: enabled) Active: active (running) since Thu 2020-10-08 14:23:22 UTC; 49s ago Docs: man:mongod(1) Main PID: 2790 (mongod) Tasks: 23 (limit: 2344) Memory: 42.2M CGroup: /system.slice/mongodb.service └─2790 /usr/bin/mongod --unixSocketPrefix=/run/mongodb --config /etc/mongodb.conf

      Laut dieser Ausgabe wird der MongoDB-Server ausgeführt.

      Wir können dies weiter überprüfen, indem wir tatsächlich eine Verbindung zum Datenbankserver herstellen und den folgenden Diagnosebefehl ausführen. Dadurch werden die aktuelle Datenbankversion, die Serveradresse und der Port sowie die Ausgabe des Statusbefehls ausgegeben:

      • mongo --eval 'db.runCommand({ connectionStatus: 1 })'

      Output

      MongoDB shell version v3.6.8 connecting to: mongodb://127.0.0.1:27017 Implicit session: session { "id" : UUID("e3c1f2a1-a426-4366-b5f8-c8b8e7813135") } MongoDB server version: 3.6.8 { "authInfo" : { "authenticatedUsers" : [ ], "authenticatedUserRoles" : [ ] }, "ok" : 1 }

      Ein Wert von 1 für das ok-Feld in der Antwort gibt an, dass der Server ordnungsgemäß funktioniert:

      Als Nächstes werden wir uns ansehen, wie Sie die Serverinstanz verwalten.

      Schritt 3 — Verwalten des MongoDB-Dienstes

      Der in Schritt 1 beschriebene Installationsprozess konfiguriert MongoDB als systemd-Dienst. Dies bedeutet, dass Sie ihn zusammen mit allen anderen Systemdiensten in Ubuntu mit Standard-systemctl-Befehlen verwalten können.

      Um den Status des Dienstes zu überprüfen, geben Sie Folgendes ein:

      • sudo systemctl status mongodb

      Sie können den Server jederzeit stoppen, indem Sie Folgendes eingeben:

      • sudo systemctl stop mongodb

      Um den Server zu starten, wenn er angehalten wurde, geben Sie Folgendes ein:

      • sudo systemctl start mongodb

      Sie können den Server auch mit dem folgenden Befehl neu starten:

      • sudo systemctl restart mongodb

      Standardmäßig ist MongoDB so konfiguriert, dass es automatisch mit dem Server gestartet wird. Falls Sie den automatischen Start deaktivieren möchten, geben Sie Folgendes ein:

      • sudo systemctl disable mongodb

      Sie können den automatischen Start jederzeit mit dem folgenden Befehl wieder aktivieren:

      • sudo systemctl enable mongodb

      Als nächstes passen wir die Firewall-Einstellungen für unsere MongoDB-Installation an.

      Schritt 4 — Anpassen der Firewall (optional)

      Angenommen, Sie haben die Anweisungen zum ersten Server-Setup-Tutorial befolgt, um die Firewall auf Ihrem Server zu aktivieren, ist der Zugriff auf den MongoDB-Server über das Internet nicht möglich.

      Wenn Sie MongoDB nur lokal mit Anwendungen verwenden möchten, die auf dem gleichen Server ausgeführt werden, ist dies die empfohlene und sichere Einstellung. Wenn Sie jedoch über das Internet eine Verbindung mit Ihrem MongoDB-Server herstellen möchten, müssen Sie die eingehenden Verbindungen durch Hinzufügen einer UFW-Regel zulassen.

      Um von überall aus auf MongoDB über den Standardport 27017 zuzugreifen, können Sie sudo ufw allow 27017 ausführen. Wenn Sie jedoch bei einer Standardinstallation den Internetzugang zum MongoDB-Server aktivieren, kann jeder uneingeschränkt auf den Datenbankserver und seine Daten zugreifen.

      In den meisten Fällen sollte nur von bestimmten vertrauenswürdigen Orten auf MongoDB zugegriffen werden, wie z. B. von einem anderen Server, der eine Anwendung hostet. Um nur einem anderen vertrauenswürdigen Server den Zugriff auf den Standardport von MongoDB zu ermöglichen, können Sie die IP-Adresse des Remote-Servers im Befehl ufw angeben. Auf diese Weise darf nur dieser Computer explizit eine Verbindung herstellen:

      • sudo ufw allow from trusted_server_ip/32 to any port 27017

      Sie können die Änderung der Firewall-Einstellungen mit ufw überprüfen:

      Sie sollten in der Ausgabe den Datenverkehr zu Port 27017 erlauben. Beachten Sie, dass, wenn Sie beschlossen haben, nur eine bestimmte IP-Adresse für die Verbindung zum MongoDB-Server zuzulassen, die IP-Adresse des zulässigen Speicherorts anstelle von Anywhere in der Ausgabe dieses Befehls aufgeführt wird:

      Output

      Status: active To Action From -- ------ ---- OpenSSH ALLOW Anywhere 27017 ALLOW Anywhere OpenSSH (v6) ALLOW Anywhere (v6) 27017 (v6) ALLOW Anywhere (v6)

      Weitere erweiterte Firewall-Einstellungen zum Einschränken des Zugriffs auf Dienste finden Sie in UFW-Grundlagen: gebräuchliche Firewall-Regeln und -Befehle.

      Obwohl der Port geöffnet ist, überwacht MongoDB immer noch nur die lokale Adresse 127.0.0.1. Fügen Sie der Datei mongodb.conf die öffentlich routbare IP-Adresse Ihres Servers hinzu, um Remoteverbindungen zuzulassen.

      Öffnen Sie die MongoDB-Konfigurationsdatei in Ihrem bevorzugten Editor. Dieser Beispielbefehl verwendet nano:

      • sudo nano /etc/mongodb.conf

      Fügen Sie die IP-Adresse Ihres MongoDB-Servers zum bindIP-Wert hinzu. Stellen Sie sicher, dass Sie ein Komma zwischen der vorhandenen IP-Adresse und der hinzugefügten Adresse einrichten:

      /etc/mongodb.conf

      ...
      logappend=true
      
      bind_ip = 127.0.0.1,your_server_ip
      #port = 27017
      
      ...
      

      Speichern Sie die Datei und beenden Sie den Editor. Wenn Sie nano zum Bearbeiten der Datei verwendet haben, drücken Sie dazu STRG + X, Y und dann ENTER.

      Starten Sie dann den MongoDB-Dienst neu:

      • sudo systemctl restart mongodb

      MongoDB wartet jetzt auf Remoteverbindungen, aber jeder kann darauf zugreifen. Befolgen Sie die Anweisungen zum Sichern von MongoDB unter Ubuntu 20.04, um einen Administrator hinzuzufügen und die Dinge weiter zu sperren.

      Zusammenfassung

      Weitere Anleitungen zum Konfigurieren und Verwenden von MongoDB finden Sie in diesen Community-Artikeln von DigitalOcean. Die offizielle MongoDB-Dokumentation ist auch eine großartige Ressource für die Möglichkeiten, die MongoDB bietet.



      Source link

      Verwenden von ViewChild in Angular für den Zugriff auf eine untergeordnete Komponente, Anweisung oder ein DOM-Element


      Einführung

      Dieser Artikel stellt Ihnen den Dekorateur ViewChild von Angular vor.

      Es kann Situationen geben, in denen Sie aus einer übergeordneten Komponentenklasse auf eine Anweisung, eine untergeordnete Komponente oder ein DOM-Element zugreifen möchten. Der ViewChild -Decorator gibt das erste Element zurück, das einer bestimmten Anweisung, einer Komponente oder einem Auswahlelement für die Vorlagenreferenz entspricht.

      Verwenden von ViewChild mit Anweisungen

      ViewChild ermöglicht es, auf Anweisungen zuzugreifen.

      Nehmen wir an, wir haben eine SharkDirective.

      Im Idealfall verwenden Sie @angular/cli, um Ihre Anweisung zu generieren:

      • ng generate directive shark

      Andernfalls müssen Sie sie gegebenenfalls manuell zu app.module.ts hinzufügen:

      app.module.ts

      import { SharkDirective } from './shark.directive';
      ...
      @NgModule({
        declarations: [
          AppComponent,
          SharkDirective
        ],
        ...
      })
      

      Unsere Anweisung sucht nach Elementen mit dem Attribut appShark und gibt den Text im Element mit dem Wort Shark vor:

      shark.directive.ts

      import {
        Directive,
        ElementRef,
        Renderer2
      } from '@angular/core';
      
      @Directive(
        { selector: '[appShark]' }
      )
      export class SharkDirective {
        creature="Dolphin";
      
        constructor(elem: ElementRef, renderer: Renderer2) {
          let shark = renderer.createText('Shark ');
          renderer.appendChild(elem.nativeElement, shark);
        }
      }
      

      Als Nächstes fügen wir Shark zu Fin hinzu, indem wir es in der Komponentenvorlage verwenden:

      app.component.html

      <span appShark>Fin!</span>
      

      Bei der Anzeige der Anweung in einem Browser wird es dargestellt als:

      Output

      Shark Fin!

      Jetzt können wir auf die Instanzvariable creature von SharkDirective zugreifen und eine Instanzvariable extraCreature mit ihrem Wert festlegen:

      app.component.ts

      import {
        Component,
        ViewChild,
        AfterViewInit
      } from '@angular/core';
      import { SharkDirective } from './shark.directive';
      
      @Component({
        selector: 'app-root',
        templateUrl: './app.component.html',
        styleUrls: ['./app.component.css']
      })
      export class AppComponent implements AfterViewInit {
        extraCreature: string;
      
        @ViewChild(SharkDirective)
        set appShark(directive: SharkDirective) {
          this.extraCreature = directive.creature;
        };
      
        ngAfterViewInit() {
          console.log(this.extraCreature); // Dolphin
        }
      }
      

      Wir haben hier einen Setter verwendet, um die Variable extraCreature festzulegen. Beachten Sie, dass wir warten, bis der AfterViewInit-Lifecycle-Hook auf unsere Variable zugreift, da dann untergeordnete Komponenten und Anweisungen verfügbar werden.

      Wenn wir die Anwendung in einem Browser anzeigen, sehen wir immer noch das "Shark Fin!" („es hat funktioniert!“ ). Im Konsolenprotokoll wird es jedoch folgendermaßen angezeigt:

      Output

      Dolphin

      Die übergeordnete Komponente konnte aus der Anweisung auf den Wert zugreifen.

      Verwenden von ViewChild mit DOM-Elementen

      ViewChild ermöglicht es Ihnen, auf native DOM-Elemente zuzugreifen, die eine Vorlagenreferenzvariable haben.

      Nehmen wir an, wir haben ein <input> unserer Vorlage mit der Referenzvariable #someInput:

      app.component.html

      <input #someInput placeholder="Your favorite sea creature">
      

      Jetzt können wir mit ViewChild auf das <input> zugreifen und den Wert festlegen:

      app.component.ts

      import {
        Component,
        ViewChild,
        AfterViewInit,
        ElementRef
      } from '@angular/core';
      
      @Component({
        selector: 'app-root',
        templateUrl: './app.component.html',
        styleUrls: ['./app.component.css']
      })
      export class AppComponent implements AfterViewInit {
        @ViewChild('someInput') someInput: ElementRef;
        ngAfterViewInit() {
          this.someInput.nativeElement.value="Whale!";
        }
      }
      

      Wenn ngAfterViewInit ausgelöst wird, wird der Wert unseres <input> auf Folgendes gesetzt:

      Output

      Whale!

      Die übergeordnete Komponente konnte den Wert des untergeordneten DOM-Elements festlegen.

      Verwenden von ViewChild mit untergeordneten Komponenten

      ViewChild ermöglicht den Zugriff auf eine untergeordnete Komponente und den Aufruf von Methoden oder den Zugriff auf Instanzvariablen, die dem untergeordneten Element zur Verfügung stehen.

      Nehmen wir an, wir haben eine ChildComponent. Im Idealfall verwenden Sie @angular/cli, um Ihre Komponente zu generieren:

      • ng generate component child --flat

      Andernfalls müssen Sie child.component.css und child.component.html-Dateien erstellen und manuell zu app.module.ts hinzufügen:

      app.module.ts

      import { ChildComponent } from './child.component';
      ...
      @NgModule({
        declarations: [
          AppComponent,
          ChildComponent
        ],
        ...
      })
      

      Wir fügen die whoAml-Methode zur ChildComponent hinzu, die eine Nachricht zurückgibt:

      child.component.ts

      whoAmI() {
        return 'I am a child component!';
      }
      

      Nächstes referieren wir die Komponente in unserer App-Vorlage:

      app.component.html

      <app-child>child works!</app-child>
      

      Jetzt können wir die whoAmI-Methode aus unserer übergeordneten Komponenten-Klasse mit ViewChild wie folgt aufrufen:

      app.component.ts

      import {
        Component,
        ViewChild,
        AfterViewInit
      } from '@angular/core';
      import { ChildComponent } from './child.component';
      
      @Component({
        selector: 'app-root',
        templateUrl: './app.component.html',
        styleUrls: ['./app.component.css'],
      })
      export class AppComponent implements AfterViewInit {
        @ViewChild(ChildComponent) child: ChildComponent;
        ngAfterViewInit() {
          console.log(this.child.whoAmI()); // I am a child component!
        }
      }
      

      Bei der Betrachtung der Anwendung in einem Browser wird das Konsolenprotokoll angezeigt:

      Output

      I am a child component!

      Die übergeordnete Komponente konnte whoAmI-Methode der untergeordneten Komponente aufrufen.

      Zusammenfassung

      Sie haben gelernt, ViewChild für den Zugriff auf eine Anweisung, eine untergeordnete Komponente und ein DOM-Element aus einer übergeordneten Komponenten-Klasse zu verwenden.

      Wenn sich die Referenz dynamisch in ein neues Element ändert, aktualisiert ViewChild automatisch ihre Referenz.

      In Fällen, in denen Sie auf mehrere untergeordnete Komponenten zugreifen möchten, verwenden Sie stattdessen ViewChild.

      Wenn Sie mehr über Angular erfahren möchten, lesen Sie unsere Seite Angular für Übungen und Programmierprojekte.



      Source link

      Wie man den Abfrageparameter in Angular verwendet


      Einführung

      Abfrageparameter in Angular ermöglichen die Übergabe optionaler Parameter über eine beliebige Route in der Anwendung. Abfrageparameter unterscheiden sich von regulären Routenparametern, die nur auf einer Route verfügbar und nicht optional sind (z. B. /product/:id).

      In diesem Artikel verweisen wir auf ein Beispiel für eine Anwendung, die eine Liste von Produkten anzeigt.  Wir bieten optionale Werte für order und price-range an, die von der empfangenden Komponente gelesen und umgesetzt werden können. Die angegebenen Werte wirken sich auf die Reihenfolge und Filterung der Produktliste aus.

      Verwenden der Abfrageparameter mit Router.navigate

      Wenn Sie unbedingt mit Router.navigate zur Route navigieren möchten, übergeben Sie Abfrageparameter mit qeryParams.

      Wenn wir in unserem Beispiel Besucher zu den Produkten mit der nach Beliebtheit geordneten Liste weiterleiten möchten, sieht dies folgendermaßen aus:

      goProducts() {
        this.router.navigate(["https://www.digitalocean.com/products"], { queryParams: { order: 'popular' } });
      }
      

      Dies führt zu einer URL, die wie folgt aussieht:

      http://localhost:4200/products?order=popular
      

      Sie können auch mehrere Abfrageparameter bereitstellen. Wenn wir in unserem Beispiel Besucher zu den Produkten mit der nach Beliebtheit geordneten und nach einer teuren Preisspanne gefilterten Liste weiterleiten möchten, sieht dies folgendermaßen aus:

      goProducts() {
        this.router.navigate(["https://www.digitalocean.com/products"], { queryParams: { order: 'popular', 'price-range': 'not-cheap' } });
      }
      

      Dies führt zu einer URL, die wie folgt aussieht:

      http://localhost:4200/products?order=popular&price-range=not-cheap
      

      Jetzt haben Sie ein Verständnis dafür, wie queryParams verwendet werden können, um Abfrageparameter festzulegen.

      Beibehalten oder Zusammenführen von Abfrageparametern mit queryParamsHandling

      Standardmäßig gehen die Abfrageparameter bei jeder nachfolgenden Navigationsaktion verloren.  Um dies zu verhindern, können Sie queryParamsHandling entweder auf 'preserve' oder 'merge' festlegen.

      Wenn wir in unserem Beispiel die Besucher von einer Seite mit dem Abfrageparameter{ Reihenfolge: „nach Beliebtheit“ } zur Seite /Benutzer unter Beibehaltung der Abfrageparameter weiterleiten, verwenden wir 'preserve' :

      goUsers() {
        this.router.navigate(['/users'], { queryParamsHandling: 'preserve' });
      }
      

      Dies führt zu einer URL, die wie folgt aussieht:

      http://localhost:4200/users?order=popular
      

      Wenn wir in unserem Beispiel die Besucher von einer Seite mit dem Abfrageparameter { Reihenfolge: „nach Beliebtheit“' } zur Seite /Benutzer weiterleiten, während wir den Abfrageparameter { Filter: „neu“ } übergeben, verwenden wir „zusammenführen“:

      goUsers() {
        this.router.navigate(['/users'], { queryParams: { filter: 'new' }, queryParamsHandling: 'merge' });
      }
      

      Dies führt zu einer URL, die wie folgt aussieht:

      http://localhost:4200/users?order=popular&filter=new
      

      Anmerkung: Die Beibehaltung von Abfrageparametern erfolgte früher mit perserveQueryParams, die auf wahr eingestellt waren, aber dies ist nun in Angular 4+ zugunsten von queryParamsHandling veraltet.

      Jetzt haben Sie ein Verständnis dafür, wie queryParamsHandling verwendet werden kann, um Abfrageparameter festzulegen.

      Wenn Sie stattdessen die Anforderung RouterLink verwenden, um zur Route zu navigieren, verwenden Sie queryParams wie folgt:

      <a [routerLink]="["https://www.digitalocean.com/products"]" [queryParams]="{ order: 'popular'}">
        Products
      </a>
      

      Und wenn Sie in unserem Beispiel Abfrageparameter für die nachfolgende Navigation „beibehalten“ oder „zusammenführen“ möchten, verwenden Sie queryParamsHandling wie folgt:

      <a [routerLink]="['/users']"
         [queryParams]="{ filter: 'new' }"
         queryParamsHandling="merge">
        Users
      </a>
      

      Jetzt verstehen Sie, wie queryParams und queryParamsHandling mit RouterLink verwendet werden können.

      Zugriff auf Abfrageparameterwerte

      Nachdem wir nun wissen, wie optionale Abfrageparameter an eine Route übergeben werden, wollen wir sehen, wie auf diese Werte auf den resultierenden Routen zugegriffen werden kann. Die Klasse ActivatedRoute verfügt über eine Eigenschaft queryParams, die eine Beobachtung der Abfrageparameter zurückgibt, die in der aktuellen URL verfügbar sind.

      Angesichts der folgenden Routen-URL:

      http://localhost:4200/products?order=popular
      

      Können wir wie folgt auf den Abfrageparameter Reihenfolge zugreifen:

      // ...
      import { ActivatedRoute } from '@angular/router';
      import 'rxjs/add/operator/filter';
      
      @Component({ ... })
      export class ProductComponent implements OnInit {
        order: string;
        constructor(private route: ActivatedRoute) { }
      
        ngOnInit() {
          this.route.queryParams
            .filter(params => params.order)
            .subscribe(params => {
              console.log(params); // { order: "popular" }
      
              this.order = params.order;
              console.log(this.order); // popular
            }
          );
        }
      }
      

      Im Konsolenprotokoll sehen wir das Objekt params wie folgt:

      Output

      { order: "popular" }

      Und den Wert params.order:

      Output

      popular

      Es gibt auch queryParamMap, der eine Beobachtung mit einem paramMap-Objekt zurückgibt.

      Angesichts der folgenden Routen-URL:

      http://localhost:4200/products?order=popular&filter=new
      

      Können wir wie folgt auf die Abfrageparameter zugreifen:

      this.route.queryParamMap
        .subscribe((params) => {
          this.orderObj = { ...params.keys, ...params };
        }
      );
      

      Wir haben hier den Objektverteilungsoperator verwendet, und dies ist die resultierende Form der Daten in orderObj:

      {
        "0": "order",
        "1": "filter",
        "params": {
          "order": "popular",
          "filter": "new"
        }
      }
      

      Jetzt wissen Sie, wie queryParams und queryParamMap verwendet werden können, um auf die Werte der resultierenden Routen zuzugreifen.

      Zusammenfassung

      In diesem Artikel haben Sie verschiedene Beispiele zum Festlegen und Abrufen von Abfrageparametern in Angular verwendet. Ihnen wurde queryParams und queryParamsHandling mit Router.navigate und RouterLink vorgestellt. Ihnen wurde auch mit ActivatedRoute queryParams und queryParamMap vorgestellt.

      Wenn Sie mehr über Angular erfahren möchten, lesen Sie unsere Seite Angular für Übungen und Programmierprojekte.



      Source link