Wrong output type after .resize
See original GitHub issueI am calling sharp(tmpFilePath).resize(150, 150).toFile(resizedFilePath)
but the output file that’s being produced is showing as type application/octet-stream
rather than an image/jpeg
, which is the original file type. I am using Angular and downloading/uploading to Firebase storage via cloud functions. When I download the source file and upload it right back to Firebase without calling the sharp API first, the newly uploaded file is an image/jpeg
file, so I am pretty sure it’s something I am doing incorrectly with the Sharp api. Thanks in advance for any assistance.
Original file:
File returned by Sharp API:
My function from index.ts:
export const resizeImages = functions.storage.object().onFinalize(async object => {
try {
console.log(object);
const bucket = admin.storage().bucket(object.bucket);
const filePath = object.name;
const fileName:string = filePath.split('/').pop();
const bucketDir = dirname(filePath);
console.log("filePath: " + filePath + "; fileName: " + fileName + "; bucketDir: " + bucketDir);
if (bucketDir === 'profile-image' && object.contentType.includes('image')){
console.log("A profile picture was added...")
//The file is a profile picture...
if (fileName.includes('unsized@')) {
console.log("The picture that was added hasn't been sized yet...")
//The file needs to be resized...
const workingDir = join(tmpdir(), 'thumbs');
const tmpFilePath = join(workingDir, fileName);
// 1. Ensure thumbnail dir exists
await fs.ensureDir(workingDir);
// 2. Download Source File
await bucket.file(filePath).download({
destination: tmpFilePath
});
console.log("Downloaded the source file");
console.log(tmpFilePath);
// 3. Resize the image ********THIS PART IS NOT HAPPENING CORRECTLY
console.log("About to start resizing...");
const resizedfileName: string = fileName.split('@').pop();
const resizedFilePath = join(workingDir, resizedfileName);
await sharp(tmpFilePath).resize(150, 150).toFile(resizedFilePath);
console.log("The image resizing is complete: "+ resizedFilePath);
// 4. Upload the resized image
const resizedImageUploadSnapshot = await bucket.upload(resizedFilePath, {destination: join('profile-image', resizedfileName)});
console.log("Uploaded the resized image ");
// 5. Cleanup remove the tmp/thumbs from the filesystem
await fs.remove(workingDir);
console.log("FUNCTION COMPLETED SUCCESSFULLY!")
return true;
} else {
return false;
}
} else {
console.log('exiting function');
return false;
}
} catch (error) {
console.log(error);
return error;
}
Issue Analytics
- State:
- Created 5 years ago
- Comments:7 (2 by maintainers)
Top Results From Across the Web
Settings mismatch: Output file will be resized....... - 5442666
Recently i've been creating videos again, rendering all of them the same exact way having no problems.
Read more >You Might Be Resizing Your Images Incorrectly - Roboflow Blog
Resizing images is a critical preprocessing step in computer vision. Principally, our machine learning models train faster on smaller images ...
Read more >How to wait for the 'end' of 'resize' event and only then perform ...
This is the code that I write according to @Mark Coleman answer: ... Suppose you have this function that you want to trigger...
Read more >Window: resize event - Web APIs | MDN
The resize event fires when the document view (window) has been resized. This event is not cancelable and does not bubble.
Read more >Resizing - NCL Graphics
NCL Graphics: Resizing. There are various ways to resize an image created by NCL. It can depend on the type of output you...
Read more >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
@avilao Re: “image data was from the previous upload” - if you’re recycling the same filename for different images then you’ll need to disable libvips cache.
Something like that solved the issue. But I actually had to stop using sharp because of another issue (image data was from the previous upload, in Firebase functions) and am now using ImageMagick.
Thanks for the help 😃