ساخت تصاویر بند انگشتی به وسیله لاراول

سلام

اگر طراح وب بوده باشید قطعا با این مشکل دست به گریبان بوده‌اید که حجم تصاویری که می‌خواهید در صفحه وبتان استفاده کنید بسیار زیاد است و این به خودی خود باعث کندی بارگذاری صفحه وب همچنین کاهش بازدید وب سایتتان خواهد بود. خب برای این کار چندین راه حل وجود دارد، ساده‌ترین راه حل و البته مشکل‌ترینشون اینه که تمام عکس‌ها را به سایزهای مختلف Resize کنیم. البته این مورد تو سایت‌ها با محتوای استاتیک به صرفه تره ولی فرض کنید یه وبسایت با حداقل ۵ پست در روز و با حداقل ۲ تصویر برای هر پست. خب این از حوصله طراح‌وب خارجه که این همه حجم تصاویرو روزانه بخواد resize کنه.

یه راه حل دیگه اینه که بیاییم به صورت اتوماتیک تصاویرمونو به وسیله اسکریپت resize کنیم. که این خودش نیازمند برنامه‌نویسی و محاسباته(هر چند اندک). با زبان PHP به راحتی میتونیم این مهم رو پیاده سازی کنیم.

کاری که تو این مطلب می‌خوام به شرحش بپردازم نوشتن تابعی برای resize کردن تصاویر در لحظه به وسیله فریمورک محبوب لاراول و پکیج دوست‌داشتنی intervention/image ـه. خب شروع کنیم به کار:

نصب پکیج intervention/image:

خب نیازمندی‌های این پکیج به این ترتیبه:

  • php >= 5.3
  • Fileinfo extension
  • GD lib >= 2.0 یا Imagic PHP extension >= 6.5.7

ابتدا نام پکیج و نسخه مورد نیازمونو در فایل composer.json در قسمت require اضافه می‌کنیم:

سپس به وسیله ترمینال دستور زیر را در دایرکتوری فایل composer.json اجرا می‌کنیم تا پکیج نصب شود:

بعد از اون فایل config/app.php را باز کرده و خطوط زیر را به ترتیب در آرایه‌های providers  و aliases  اضافه می‌کنیم:

و

ایجاد کنترلر کار با تصاویر و متد‌ تغییر سایز تصاویر:

 کد زیر دربردارنده کنترلر و متد ایجاد تصاویر بندانگشتی با سایز‌های دلخواهه که توضیحات به صورت کامنت در کد قرار داره:

 

تعریف  Route برای دسترسی به متد:

برای دسترسی به متدمون و فراخونی اون از هر جای اپلیکیشن نیازمند تعریف یک مسیر یا Route هستیم. برای اینکار فایل routes.php را باز کرده و مسیر جدیدی تعریف می‌کنیم:

 ایجاد تصاویر بندانگشتی:

در مرحله آخر می‌رسیم به استفاده از اسکریپتمون. برای این کار فرض کنیم ما تصویری داریم با این آدرس: http://site.com/images/image1.png که دارای سایز ۱۳۶۰x768ـه و ما میخواهیم تصویری با پهنای ۲۰۰ بسازیم و میخواهیم که ارتفاع تصویر هم به نسبت پهنا تغییر کنه. پس فقط کافیه آدرس زیر رو تو هر جای اپلیکیشن( چه کنترلرها و چه داخل کدهای html) صدا بزنیم:

که در صورت عدم وجود تصویر اصلی، تصویری با رنگ خاکستری روشن و به سایز ۲۰۰x200 ایجاد میشه و در صورت وجود تصویر اصلی، تصویری بندانگشتی به سایز ۲۰۰x113 پیکسل ایجاد میشه. در صورتی که بخواهیم با  ارتفاع دلخواه خودمون تصویر ساخته بشه کافیه پارامتر h را به تابع route بدیم.

راهنمایی:

برای نصب اکستنشن در php کافیه در اوبونتو دستور زیر رو بزنیم:

 

و در صورت وجود اکستنشن برای فعالسازی اون کافیه این دستورو بزنیم:

فقط یادتون باشه که بعد از اینکار باید apache را restart یا  reload کنید، اونم با این دستور:

موفق باشید.