Remove ImageMagick from thumbnail samples (1st and 2nd gen) (#1079)

Author: jhuleatt

2nd-gen/thumbnails/README.md

@@ -11,7 +11,7 @@ This sample automatically generates thumbnails for images that are uploaded to C
 
 See file [functions/index.js](functions/index.js) for the thumbnail generation code.
 
-The thumbnail generation is performed using ImageMagick which is installed by default on all Cloud Functions instances. This is a CLI so we execute the command from node using the [child-process-promise](https://www.npmjs.com/package/child-process-promise) package. The image is first downloaded locally from the Cloud Storage bucket to the `tmp` folder using the [google-cloud](https://github.com/GoogleCloudPlatform/google-cloud-node) SDK.
+The thumbnail generation is performed using [sharp](https://www.npmjs.com/package/sharp).
 
 The dependencies are listed in [functions/package.json](functions/package.json).
 

2nd-gen/thumbnails/functions/index.js

@@ -24,10 +24,10 @@ const {onObjectFinalized} = require("firebase-functions/v2/storage");
 const {initializeApp} = require("firebase-admin/app");
 const {getStorage} = require("firebase-admin/storage");
 const logger = require("firebase-functions/logger");
-const spawn = require("child-process-promise").spawn;
 const path = require("path");
-const os = require("os");
-const fs = require("fs");
+
+// library for image resizing
+const sharp = require("sharp");
 
 initializeApp();
 // [END v2storageAdditionalImports]
@@ -36,7 +36,7 @@ initializeApp();
 // [START v2storageGenerateThumbnail]
 /**
  * When an image is uploaded in the Storage bucket,
- * generate a thumbnail automatically using ImageMagick.
+ * generate a thumbnail automatically using sharp.
  */
 // [START v2storageGenerateThumbnailTrigger]
 exports.generateThumbnail = onObjectFinalized({cpu: 2}, async (event) => {
@@ -61,30 +61,30 @@ exports.generateThumbnail = onObjectFinalized({cpu: 2}, async (event) => {
   // [END v2storageStopConditions]
 
   // [START v2storageThumbnailGeneration]
-  // Download file from bucket.
+  // Download file into memory from bucket.
   const bucket = getStorage().bucket(fileBucket);
-  const tempPath = path.join(os.tmpdir(), fileName);
-  await bucket.file(filePath).download({destination: tempPath});
-  logger.log("Image downloaded locally to", tempPath);
+  const downloadResponse = await bucket.file(filePath).download();
+  const imageBuffer = downloadResponse[0];
+  logger.log("Image downloaded!");
 
-  // Generate a thumbnail using ImageMagick.
-  await spawn("convert", [tempPath, "-thumbnail", "200x200>", tempPath]);
-  logger.log("Thumbnail created at", tempPath);
+  // Generate a thumbnail using sharp.
+  const thumbnailBuffer = await sharp(imageBuffer).resize({
+    width: 200,
+    height: 200,
+    withoutEnlargement: true,
+  }).toBuffer();
+  logger.log("Thumbnail created");
 
   // Prefix 'thumb_' to file name.
   const thumbFileName = `thumb_${fileName}`;
   const thumbFilePath = path.join(path.dirname(filePath), thumbFileName);
 
-  // Uploading the thumbnail.
+  // Upload the thumbnail.
   const metadata = {contentType: contentType};
-  await bucket.upload(tempPath, {
-    destination: thumbFilePath,
+  await bucket.file(thumbFilePath).save(thumbnailBuffer, {
     metadata: metadata,
   });
-
-  // Once the thumbnail has been uploaded,
-  // delete the local file to free up disk space.
-  return fs.unlinkSync(tempPath);
+  return logger.log("Thumbnail uploaded!");
   // [END v2storageThumbnailGeneration]
 });
 // [END v2storageGenerateThumbnail]

2nd-gen/thumbnails/functions/package.json

@@ -2,12 +2,13 @@
   "name": "generate-thumbnail-functions-quickstart",
   "description": "Generate Thumbnail Firebase Functions sample",
   "dependencies": {
-    "child-process-promise": "^2.2.1",
-    "firebase-admin": "^11.7.0",
+    "sharp": "^0.32.1",
+    "firebase-admin": "^11.8.0",
     "firebase-functions": "^4.3.1"
   },
   "devDependencies": {
     "eslint": "^6.8.0",
+    "eslint-config-google": "^0.14.0",
     "eslint-plugin-promise": "^4.3.1"
   },
   "scripts": {
@@ -20,7 +21,7 @@
     "compile": "cp ../../../tsconfig.template.json ./tsconfig-compile.json && tsc --project tsconfig-compile.json"
   },
   "engines": {
-    "node": "16"
+    "node": "18"
   },
   "private": true
 }

README.md

@@ -124,11 +124,6 @@ Uses an HTTP trigger.
 Demonstrates how to automatically convert images that are uploaded to Firebase Storage to JPEG using ImageMagick.
 Uses a Firebase Storage trigger.
 
-### [Generate image thumbnails using ImageMagick](/generate-thumbnail)
-
-Demonstrates how to automatically generate a thumbnail for images that are uploaded to Firebase Storage using ImageMagick and generate a public download link for the images.
-Uses a Firebase Storage trigger.
-
 ### [Generate image thumbnails using Node.js Stream & Sharp](/image-sharp)
 
 Demonstrates how to use Node.js Stream to read image from Cloud Storage, generate a thumbnail image using Sharp and upload it back to Cloud Storage.