آپلود عکس با Ajax در PHP

آپلود عکس با Ajax در PHP

آپلود عکس با AJAX در جی کوئری بسیار آسان است و به راحتی می توانید پیاده سازی کنید.

در آموزش های قبلی نحوه آپلود فایل در php بدون استفاده از AJAX را دیدیم. در این مثال , چند نمونه کد jQuery برای انجام عملیات آپلود عکس با AJAX در PHP بدون لود شدن صفحه , اضافه کردیم.

ما از jQuery AJAX برای پیاده سازی قابلیت آپلود تصویر استفاده می کنم. یک فرم با input از نوع file و یک دکمه برای ارسال داریم.

با زدن دکمه submit , اسکریپت AJAX اجرا خواهد شد . در این کد , یک درخواست آپلود به فایل PHP برای آپلود عکس ارسال می شود .

کد php تصویر آپلود شده را با فولدر از پیش تعریف شده انتقال (move) و یک تگ img در HTML برای پیش نمایش تصویر در پاسخ AJAX برگشت می دهد.

آپلود عکس با Ajax در PHP

فرم HTML آپلود عکس

کد زیر به شما HTML مورد نظر برای فرم آپلود تصویر را نشان می دهد .برای سابمیت کردن فرم , تابع AJAX برای ارسال درخواست آپلود عکس با AJAX در PHP , اجرا خواهد شد.

متد آپلود عکس با AJAX در PHP

کد زیر به شما تابع ajax() استفاده شده برای ارسال درخواست در قالب یک نمونه FormData را نشان می دهد.

در php , فایل در دایرکتری مشخصی آپلود می شود . بعد از آپلود موفق فایل , پیش نمایش تصویر در پاسخ AJAX برگشت داده می شود.

سپس , این تصویر به تگ DIV برای نمایش به کاربر اضافه خواهد شد.

خروجی آپلود عکس با AJAX در PHP

بعد از آپلود تصویر با AJAX , پیش نمایش را بصورت زیر به کاربر نشان می دهیم.

آپلود عکس با Ajax در PHP

امیدوارم از آموزش آپلود عکس با Ajax در PHP استفاده مفید را برده باشید.

برای دانلود سورس کد کامل این آموزش از باکس دانلود استفاده کنید.

هر سوالی داشتید ، از قسمت نظرات ارسال کنید . سریعا ، پاسخگوی سوالات شما هستیم .

موفق و پیروز باشید.

حسن شفیعی علاقه خاصی به برنامه نویسی وب و موبایل دارم و هر روز تلاش می کنم به این حوزه مسلط تر شوم و اطلاعاتم را به شکل کاربردی برای علاقه مندان در وب به اشتراک بگذارم

آموزش های رایگان بیشتر در اینستاگرام ما ...

NETPARADIS /
مطالب زیر را حتما بخوانید
دیدگاه کاربران (۱۱)

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

  1. محمد ۲۲ شهریور ۱۳۹۸

    سلام
    یک سوال داشتیم اگر بخوایم در کد بالا ارسال داده با روش GET باشه باید method و type در کد بالا به get تغییر بدیم و در صفحه upload.php با get داده دریافت کنیم؟(البته میخوام به جای عکس متن ارسال کنم برای همین سوال برسیدم)
    اگر به این شکل باشه من اینکار کردم ولی کار نکرد…
    محبت می کنید یک راهنمایی در این زمینه بکنید.

    پاسخ
    1. حسن شفیعی ۲۲ شهریور ۱۳۹۸

      سلام. اگر قصد ارسال متن دارید پس باید آموزش دیگری مشاهده کنید چرا که این آموزش برای آپلود عکس است.
      ایجکس در جی کویری
      موفق باشید.

      پاسخ
  2. reza ۸ شهریور ۱۳۹۸

    یک سوال
    وقتی دکمه submit میزنم در صفحه index.php و اطلاعات به صفحه upload.php ارسال میکنه و نتیجه نمایش میده میخوام وقتی نتیجه نمایش داد متنی که در صفحه index.php و با عنوان(یک متن تستی می باشد.) هست نمایش نده و فقط نتیجه نمایش بده.
    لینک کد:
    http://rozup.ir/download/2925767/index.txt
    منظورم همون نوشته ای که در کد لینک بالا در زیر فرم قرار دادم(

    یک متن تستی می باشد.

    )

    پاسخ
    1. حسن شفیعی ۸ شهریور ۱۳۹۸

      خب کافیه اون متن رو در کد حذف کنید

      پاسخ
      1. reza ۸ شهریور ۱۳۹۸

        مشکل حل کردم میخواستم وقتی که داده نمایش میده خودکار حذف بشه
        اگر هم دقت کنید خودتون داخل کد همیین امکان قرار دادید.
        در هر صورت بابت مطلب عالتون تشکر میکنم

        پاسخ
  3. reza ۸ شهریور ۱۳۹۸

    سلام خسته نباشید
    من داخل سایتم یک بخش آپلودسنتر درست کردن حجم بالا با کد php ارور ۵۰۳ میده به پشتیبانی هاستم گفتم, گفت با php تا ۵۰m میتونی آپلود کنی و برای حجم آپلود بالا باید از ajax استفاده کنی برای آپلود فایل با حجم بالا باید چیکار کنم؟
    اگر بشه انتقال آپلود فایل با حجم بالا از طریق لینک هم باشه مشکل برطرف میکنه

    پاسخ
    1. حسن شفیعی ۸ شهریور ۱۳۹۸

      سلام ممنون. همین آموزش رو میتونید استفاده کنید

      پاسخ
  4. Micro ۱۹ خرداد ۱۳۹۸

    درود

    لطفا کد های فایل upload.php هم قرار دهید

    سپاس 🙂

    پاسخ
    1. حسن شفیعی ۱۹ خرداد ۱۳۹۸

      سلام. در سورس کامل که از باکس دانلود قابل دریافت است, تمام فایل های مورد نیاز از جمله upload.php موجود است.

      موفق باشید.

      پاسخ
  5. علیرضا ۲۴ دی ۱۳۹۷

    خیلی عالی بود

    پاسخ
    1. حسن شفیعی ۲۴ دی ۱۳۹۷

      سلام. خوشحالم که مفید واقع شده.
      موفق باشید.

      پاسخ
دوره های آموزشی

دانلود رایگان کتاب آموزش PHP

صفر تا صد PHP و MySQL را یکجا یاد بگیرید
همین الان دانلود کن
نگران نباشید. ایمیل‌های مزاحم نمی‌فرستیم
close-link