Seit kurzem verwende ich JS, um lustige Dinge zu tun und Bilder zu verarbeiten. Im Internet gibt es viele Tutorials mit verschiedenen Methoden, und einige Methoden funktionieren möglicherweise nicht unbedingt. In diesem Artikel stellen wir Ihnen eine vom Autor verifizierte Methode vor, mit der Sie NodeJS zum Verarbeiten von Bildern verwenden können.
npm i gm
gm ist eine Knotenbibliothek, die einige JS-APIs bereitstellt, damit Entwickler Bilder verarbeiten können. Aber es basiert auf GraphicsMagick oder ImageMagick darunter. Tatsächlich ist gm die Befehlszeile zum Aufrufen dieser beiden Tools.
Mit anderen Worten: Zusätzlich zur Installation von gm müssen wir auch entweder GraphicsMagick oder ImageMagick installieren.
ImageMagickDer Autor arbeitet unter MacOS und hat sich direkt für die Installation von ImageMagick entschieden.
Laut dem offiziellen Website-Befehl ist nur 1 Zeile Code erforderlich (vorausgesetzt, Sie haben brew auf Ihrem Mac installiert):
brew installiere imagemagick --with-webp
Lassen Sie mich den Parameter --with-webp einführen. Sie können ihn löschen, aber wenn Sie Bilder im Webp-Format verarbeiten möchten, müssen Sie ihn hinzufügen.
Es ist bequemer, brew zu verwenden. Sie müssen sich keine Gedanken über Umgebungsvariablen machen.
GraphicsMagick
Wenn Sie ImageMagick nicht verwenden, können Sie natürlich auch GraphicsMagick verwenden:
brew installiere Graphicsmagick
Zuerst habe ich mich für die Installation von ImageMagick entschieden, und als ich das schrieb, bekam ich immer eine Fehlermeldung:
const gm = require('gm');
gm('Pfad der Bilddatei').crop(width, height, 0, 0).resize(width2, height2).quality(quality).write('Pfad der Ausgabedatei', function (err) {
if (irre) {
return console.log(err);
} anders {
console.log('success');
}
}); Wenn Sie ImageMagick verwenden möchten, ist die obige Schreibweise tatsächlich falsch. Sie sollten es so schreiben und klar angeben, dass ich das ImageMagick Tool verwenden möchte:
const g = require('gm');
const gm = g.subClass({imageMagick: true});
gm('Pfad der Bilddatei').crop(width, height, 0, 0).resize(width2, height2).quality(quality).write('Pfad der Ausgabedatei', function (err) {
if (irre) {
return console.log(err);
} anders {
console.log('success');
}
});Notieren Sie die häufig verwendeten Funktionen von gm als Referenz:
Hinweis: gm kann in einer Kette aufgerufen werden, und das Schreiben macht sehr viel Spaß. Es liest die Bilddatei aus gm (Dateiname), verarbeitet sie Schicht für Schicht und schreibt sie schließlich in die Datei.write (Dateiname, Rückruf).
Bild vergrößern
.resize(width, height)
Bild zuschneiden
.crop(width, height, x, y)
Bild drehen
.rotate(color, deg)
Farbe ist die Hintergrundfarbe (wenn der Grad-Drehwinkel kein Vielfaches von 90 ist, ist die Hintergrundfarbe praktisch, verwenden Sie einfach das Format „#ededed“).