Skip to content

CLOUDINARY_SETUP.md

Latest commit

 

History

History
73 lines (60 loc) · 2.62 KB

CLOUDINARY_SETUP.md

File metadata and controls

73 lines (60 loc) · 2.62 KB
Raw

📁 Cloudinary File Upload Setup Guide

Current Status

✅ Assignment system is working with mock uploads
❗ For production file uploads, please configure Cloudinary

Quick Start (Development)

The assignment system currently uses mock file uploads for development. You can:

  • ✅ Upload files (they'll show as "uploaded" in the UI)
  • ✅ Create assignments with file attachments
  • ✅ Test all assignment functionality
  • ❗ Files aren't actually stored (mock URLs are used)

Production Setup with Cloudinary

Step 1: Create Cloudinary Account

  1. Go to cloudinary.com
  2. Sign up for a free account
  3. Note your Cloud Name from the dashboard

Step 2: Create Upload Preset

  1. In your Cloudinary dashboard, go to Settings → Upload
  2. Scroll down to Upload presets
  3. Click Add upload preset
  4. Configure the preset:
    • Preset name: assignment_uploads
    • Signing Mode: Unsigned
    • Resource Type: Auto
    • Allowed formats: pdf,doc,docx,txt,jpg,jpeg,png
    • Max file size: 10485760 (10MB)
    • Folder: assignments (optional)
  5. Save the preset

Step 3: Configure Environment Variables

Add to your .env.local file:

NEXT_PUBLIC_CLOUDINARY_CLOUD_NAME=your_cloud_name_here

Step 4: Test Upload

  1. Restart your development server
  2. Try uploading a file in the assignment form
  3. Files should now upload to Cloudinary and return real URLs

Alternative: Local File Storage

If you prefer not to use Cloudinary, you can implement local file storage:

  1. Create an upload API route in src/app/api/upload/route.ts
  2. Use multer or similar for file handling
  3. Store files in public/uploads/ directory
  4. Update the handleFileUpload function to use your API

Security Notes

  • Upload presets should be unsigned for client-side uploads
  • Consider implementing file type validation server-side
  • For production, consider signed uploads for better security
  • Implement file scanning for malware if handling user uploads

Troubleshooting

  • 400 Bad Request: Upload preset doesn't exist or is misconfigured
  • 401 Unauthorized: Cloud name is incorrect
  • 413 Payload Too Large: File exceeds size limits
  • 415 Unsupported Media Type: File type not allowed in preset

Current Fallback Behavior

Without Cloudinary configuration, the system will:

  • Accept file uploads
  • Show success messages
  • Store mock file URLs
  • Allow full assignment functionality
  • Display file names and download links (that lead to example URLs)

This allows you to develop and test the assignment system without needing to set up file storage immediately.