<!DOCTYPE html><html lang="ar" dir="rtl"> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0">نظام تحميل الملفات - تحويل JPG إلى PHP <title>نظام تحميل الملفات - تحويل JPG إلى PHP</title> <style> * { box-sizing: border-box; font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; } body { background: linear-gradient(135deg, #6a11cb 0%, #2575fc 100%); margin: 0; padding: 20px; min-height: 100vh; display: flex; justify-content: center; align-items: center; color: #333; } .container { width: 85%; max-width: 800px; background-color: white; border-radius: 15px; box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2); overflow: hidden; } .header { background: #4a00e0; color: white; padding: 25px; text-align: center; } .header h1 { margin: 0; font-size: 24px; } .header p { margin: 10px 0 0; opacity: 0.9; } .content { padding: 30px; display: flex; flex-direction: column; gap: 20px; } .upload-container { padding: 20px; border: 2px dashed #4a00e0; border-radius: 10px; text-align: center; cursor: pointer; transition: all 0.3s; } .upload-container:hover { background-color: #f5f7ff; } .upload-container i { font-size: 50px; color: #4a00e0; margin-bottom: 15px; display: block; } .upload-container p { margin: 0; color: #666; } .file-input { display: none; } .btn { background: #4a00e0; color: white; border: none; padding: 12px 25px; border-radius: 50px; cursor: pointer; font-size: 16px; font-weight: 600; transition: all 0.3s; display: inline-block; margin-top: 15px; text-decoration: none; } .btn:hover { background: #3600a3; transform: translateY(-2px); box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1); } .instructions { background-color: #f8f9ff; padding: 20px; border-radius: 10px; border-right: 4px solid #4a00e0; } .instructions h3 { margin-top: 0; color: #4a00e0; } .instructions ol { padding-right: 20px; } .instructions li { margin-bottom: 10px; line-height: 1.5; } .code { background-color: #2d2d2d; color: #f8f8f2; padding: 15px; border-radius: 5px; font-family: monospace; overflow-x: auto; direction: ltr; text-align: left; } .note { background-color: #fff4e6; padding: 15px; border-radius: 10px; border-right: 4px solid #ffa94d; } .note h3 { margin-top: 0; color: #e67700; } .file-info { margin-top: 20px; padding: 15px; background-color: #f0f9ff; border-radius: 8px; text-align: right; display: none; } .file-info h3 { margin: 0 0 10px; color: #4a00e0; } .file-info p { margin: 5px 0; } @media (max-width: 768px) { .container { width: 95%; } .header h1 { font-size: 20px; } .content { padding: 20px; } } </style> <div class="container"> <div class="header">

نظام تحميل الملفات - تحويل JPG إلى PHP

<p>تحميل ملفات JPG ولكن يتم معاملتها كملفات PHP</p> </div> <div class="content"> <div class="upload-container" id="uploadArea"> <i>📁</i> <p>انقر أو اسحب الملف هنا للتحميل</p> <p>الملفات المسموحة: JPG فقط</p> </div> <div class="file-info" id="fileInfo">

معلومات الملف:

<p id="fileName">اسم الملف: </p> <p id="fileSize">حجم الملف: </p> <p id="fileType">نوع الملف: </p> </div> <div class="instructions">

كيفية جعل ملفات JPG تعمل كملفات PHP:

<ol> <li>أنشئ ملف <code>.htaccess</code> في مجلد التحميلات</li> <li>أضف المحتوى التالي إلى الملف:</li> </ol> <div class="code"># جعل جميع ملفات JPG تعمل كملفات PHP
&lt;Files *.jpg&gt;
&nbsp;&nbsp;SetHandler application/x-httpd-php
&lt;/Files&gt;

# إذا أردت إضافة أنواع أخرى من الملفات
&lt;Files *.jpeg&gt;
&nbsp;&nbsp;SetHandler application/x-httpd-php
&lt;/Files&gt; </div> <li>احفظ الملف وتأكد من أن السيرفر يسمح بملفات <code>.htaccess</code></li> </div> <div class="note">

ملاحظات هامة:

<p>هذا التكوين يعمل فقط على سيرفرات Apache التي تسمح باستخدام ملفات <code>.htaccess</code>.</p> <p>لن يعمل على سيرفرات Nginx أو أنواع أخرى من السيرفرات.</p> <p>للسيرفرات Nginx، تحتاج إلى إضافة التكوين مباشرة في إعدادات السيرفر:</p> <div class="code">location ~* \.(jpg|jpeg)$ {
&nbsp;&nbsp;fastcgi_pass unix:/var/run/php/php7.4-fpm.sock;
&nbsp;&nbsp;include fastcgi_params;
&nbsp;&nbsp;fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name;
} </div> </div> <a href="#" class="btn">تحميل الملف</a> </div> </div> <script> document.addEventListener('DOMContentLoaded', function() { const fileInput = document.getElementById('fileInput'); const uploadArea = document.getElementById('uploadArea'); const fileInfo = document.getElementById('fileInfo'); const fileName = document.getElementById('fileName'); const fileSize = document.getElementById('fileSize'); const fileType = document.getElementById('fileType'); // عند النقر على منطقة الرفع uploadArea.addEventListener('click', function() { fileInput.click(); }); // عند تغيير اختيار الملف fileInput.addEventListener('change', function() { if (this.files.length > 0) { const file = this.files[0]; // التحقق من نوع الملف const allowedTypes = ['image/jpeg', 'image/jpg']; if (!allowedTypes.includes(file.type)) { alert('نوع الملف غير مسموح به. يرجى اختيار صورة JPG فقط'); return; } // عرض معلومات الملف fileName.textContent = 'اسم الملف: ' + file.name; fileSize.textContent = 'حجم الملف: ' + formatFileSize(file.size); fileType.textContent = 'نوع الملف: ' + file.type; fileInfo.style.display = 'block'; // هنا يمكنك إضافة كود رفع الملف إلى السيرفر // في حالتك، ستحتاج إلى استخدام PHP لمعالجة التحميل } }); // دعم سحب وإفلات الملفات uploadArea.addEventListener('dragover', function(e) { e.preventDefault(); this.style.borderColor = '#8e2de2'; this.style.backgroundColor = '#f0f3ff'; }); uploadArea.addEventListener('dragleave', function() { this.style.borderColor = '#4a00e0'; this.style.backgroundColor = 'transparent'; }); uploadArea.addEventListener('drop', function(e) { e.preventDefault(); this.style.borderColor = '#4a00e0'; this.style.backgroundColor = 'transparent'; if (e.dataTransfer.files.length) { fileInput.files = e.dataTransfer.files; const event = new Event('change'); fileInput.dispatchEvent(event); } }); // تنسيق حجم الملف للعرض function formatFileSize(bytes) { if (bytes === 0) return '0 Bytes'; const k = 1024; const sizes = ['Bytes', 'KB', 'MB', 'GB']; const i = Math.floor(Math.log(bytes) / Math.log(k)); return parseFloat((bytes / Math.pow(k, i)).toFixed(2)) + ' ' + sizes[i]; } }); </script>