ホームページ >ウェブフロントエンド >フロントエンドQ&A >Nodejsは画像サイズを変更します
Node.js は、非常に柔軟で実用的な人気の JavaScript プログラミング言語であり、バックエンドでさまざまな種類のアプリケーションを開発するために使用できます。そのようなユニバーサル アプリケーションの 1 つは、オンライン フォト ギャラリーおよび画像エディターです。この場合、画像を動的にサイズ変更または拡大縮小するのは非常に一般的なタスクです。この記事では、Node.js を使用して、アプリケーションのニーズに合わせて画像のサイズを変更する方法を説明します。
始める前に、npm を通じて必要なライブラリをいくつかインストールする必要があります。ターミナルからプロジェクトのルート ディレクトリに移動し、次のコマンドを実行します。
$ npm install Sharp
sharp は、次のことを可能にする効率的な Node.js モジュールです。トリミング、回転、拡大縮小などの画像を簡単に処理します。
次に、画像ズーム機能を実装するコードを記述します。このシンプルかつ強力なプログラムを見てみましょう:
const fs = require('fs'); const sharp = require('sharp'); sharp('input.jpg') .resize(200, 200) .toFile('output.jpg', (err, info) => { if (err) console.log(err); console.log(info); });
ここでは、最初に fs モジュールを使用してサイズを変更したいファイル (input.jpg) をロードします。次に、sharp モジュールの Resize() メソッドを使用して、新しい画像サイズを指定します (ここでは画像サイズを 200x200 に変更します)。最後に、出力ファイルをoutput.jpgに保存します。
このプログラムを実行すると、次のようないくつかの情報が端末出力に出力されます。
{ format: 'jpeg', width: 200, height: 200, channels: 3, premultiplied: false, size: 4370 }
ここでは、形式、形式など、出力画像のさまざまな属性を確認できます。幅、高さなど
実際のアプリケーションでは、画像のサイズやサイズをバッチで調整する必要がある場合があります。 Node.js を使用すると、最小限の時間で大量の画像を処理できます。画像のサイズ変更とサイズ変更をバッチで行う例を次に示します。
const fs = require('fs'); const sharp = require('sharp'); const inputFolder = './input/'; const outputFolder = './output/'; const imageSize = 400; fs.readdir(inputFolder, (err, files) => { if (err) console.log(err); files.forEach(file => { sharp(inputFolder + file) .resize(imageSize, imageSize) .toFile(outputFolder + 'resized_' + file, (err, info) => { if (err) console.log(err); console.log(info); }); }); });
ここでは、最初にサイズ変更するフォルダーと新しいフォルダーを指定します。次に、そのディレクトリ内のすべてのファイルを読み取り、それらをファイルの配列にホストします。次に、ファイルごとにシャープ オブジェクトをインスタンス化し、resize() メソッドを呼び出して新しい画像サイズを指定します。最後に、出力ファイルを新しいディレクトリに保存し、出力を端末に出力します。
Web アプリケーションでは、画像のサイズを動的に変更すると、アプリケーションの速度とパフォーマンスが向上します。アプリケーションで Web ブラウザに大量の画像を頻繁に読み込む必要がある場合は、レイアウトやスタイルに合わせて画像のサイズを変更したり拡大縮小したりすると便利です。これにより、大きな画像をダウンロードするのではなく、必要な画像だけをオンデマンドでサーバーから転送することが可能になります。この場合、Node.js を使用してアプリケーションを作成すると、Web ページの良好なパフォーマンスを維持しながら、高品質のユーザー エクスペリエンスを提供できます。
結論
この記事では、Node.js を使用して画像のサイズをすばやく簡単に変更する方法について詳しく説明しました。人気のシャープ ライブラリを使用すると、最小限の時間で画像のサイズを簡単に変更でき、Web アプリケーションの速度とパフォーマンスを向上させることができます。これらのテクノロジーをアプリケーションで簡単に使用できるようになり、ユーザー エクスペリエンスとアプリケーションのパフォーマンスが向上します。
以上がNodejsは画像サイズを変更しますの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。