JavaScript is not enabled!...Please enable javascript in your browser

جافا سكريبت غير ممكن! ... الرجاء تفعيل الجافا سكريبت في متصفحك.

الصفحة الرئيسية

حل مشكلة رفع الصور في Laravel مع حفظ المسار في قاعدة البيانات – خطوة بخطوة من مشروع فعلي



✍️ المقدمة:

في أحد المشاريع التي عملت عليها، كنت أحتاج لرفع صور المستخدمين وتخزينها في مجلد معين، مع حفظ المسار في قاعدة البيانات لاستخدامها لاحقًا في لوحة التحكم.

الغريب أن الكود كان يبدو صحيحًا 100%، لكن الصورة لم تُرفع، أو تُرفع ولكن لا تظهر عند العرض، أو يظهر لي خطأ 404.

في هذا المقال سأشرح بالتفصيل:

  • ما سبب المشكلة

  • كيف قمت بحلها

  • ما الإعدادات التي يجب الانتباه لها في Laravel

🎯 وصف المشكلة:

عند إرسال طلب رفع صورة عبر الفورم، يحدث أحد الأمور التالية:

  • الصورة لا تُرفع إلى المجلد المطلوب

  • يتم رفعها ولكن عند محاولة عرضها في <img> يظهر خطأ

  • الصورة تُرفع ولكن المسار غير صحيح داخل قاعدة البيانات

🛠️ خطوات الحل الفعلي:

1. إنشاء الفورم وطلب الصورة

<form action="{{ route('user.upload') }}" method="POST" enctype="multipart/form-data">
    @csrf
    <input type="file" name="avatar" required>
    <button type="submit">رفع الصورة</button>
</form>

✅ ملاحظة: لا تنسَ enctype="multipart/form-data"

2. استقبال الصورة داخل الـ Controller

public function upload(Request $request)
{
    $request->validate([
        'avatar' => 'required|image|mimes:jpeg,png,jpg|max:2048'
    ]);

    $image = $request->file('avatar');
    $imageName = time() . '.' . $image->getClientOriginalExtension();

    // حفظ الصورة في مجلد public/images
    $image->move(public_path('images'), $imageName);

    // حفظ المسار في قاعدة البيانات (مثال)
    User::find(auth()->id())->update([
        'avatar' => 'images/' . $imageName
    ]);

    return back()->with('success', 'تم رفع الصورة بنجاح!');
}

3. عرض الصورة داخل لوحة التحكم

<img src="{{ asset(Auth::user()->avatar) }}" alt="الصورة الشخصية" width="120">

✅ النتيجة:

الصورة تُرفع بشكل آمن إلى مجلد public/images/
والمسار يتم تخزينه في قاعدة البيانات بالشكل الصحيح، ويمكن استرجاعه بسهولة في أي مكان في الموقع.

❗ مشاكل شائعة واجهتها أثناء التجربة:

(المشكلة)  (السبب)  (الحل)
(الصورة لا تُرفع)  (عدم وجود مجلد images)   (أنشئ المجلد يدويًا داخل public)
(الصورة تُرفع ولكن لا تظهر) (المسار غير صحيح) (استخدم asset() بدلًا من رابط ثابت)
(خطأ "The file could not be uploaded")  (صلاحيات المجلد) (تأكد أن storage و public لديهم صلاحية الكتابة)
(لا يتم حفظ الصورة في قاعدة البيانات) (نسيان حفظ المسار) (تحقق من تنفيذ update بعد move() )

🧠 نصائح إضافية:

  • استخدم مكتبة Intervention Image لمعالجة الصور مثل تغيير الحجم.

  • احفظ الصور داخل storage/app/public واستخدم php artisan storage:link لربطها مع مجلد public.

  • قم بفلترة امتدادات الصور بدقة لتفادي الرفع الضار.

🧾 الخلاصة:

رفع الصور يبدو بسيطًا، لكنه يحتوي على الكثير من التفاصيل التي قد تسبب لك مشاكل إذا لم تكن حذرًا.

من المهم أن تفهم طريقة تعامل Laravel مع الملفات، وتركز على المسارات، الصلاحيات، والتخزين السليم داخل قاعدة البيانات.

💬 هل واجهت مشكلة مشابهة في مشروعك؟

اكتب لي التفاصيل وسأخصص لها مقالًا في هذه السلسلة التعليمية التقنية.


الاسمبريد إلكترونيرسالة