ثلاث حاجات عجزت في تعلمهن في البرمجة

علي الكاسر · 18 يونيو 2021

الاولى رفع الملفات الى السيرفر بواسطك اجاكس

الثانيه التشفير وفك التشفير

الثالثه نظام بنية vmc

رح اترك البرمجه بسببهن

تم التعديل في 18 يونيو 2021 بواسطة علي الكاسر
اخطاء أملائية

عبدالله عبدالرحمن11 · 18 يونيو 2021

ماهي لغة الخلفية backend الذي تستخدمها؟

علي الكاسر · 18 يونيو 2021

بتاريخ 1 ساعة قال عبدالمجيد الجرادي:

ماهي لغة الخلفية backend الذي تستخدمها؟

لغة php

بتاريخ 1 ساعة قال عبدالمجيد الجرادي:

ماهي لغة الخلفية backend الذي تستخدمها؟

لغة php

Salah Eddin Beriani2 · 19 يونيو 2021

بالنسبة للتشفير و فك التشفير فاللأمر جد بسيط


<?php
  
  // كلمة السر
  $plaintext_password = "Password@123";
  
  //تشفيرها
  $hash = password_hash($plaintext_password, 
          PASSWORD_DEFAULT);
  
  // طبعها
  echo "Generated hash: ".$hash;
?>

<?php
  
  //كلمة السر التي ادخلها المستخدم
  $plaintext_password = "Password@123";
  
  // كلمة السر التي شفرناها ونجلبها من مكان التخزين كقاعدة البيانات
  $hash = 
"$2y$10$8sA2N5Sx/1zMQv2yrTDAaOFlbGWECrrgB68axL.hBb78NhQdyAqWm";
  
  // نقارن بينهما
  $verify = password_verify($plaintext_password, $hash);
  
  // Print the result depending if they match
  if ($verify) {
      echo 'كلمة سر صحيحة';
  } else {
      echo 'كلمة سر خاطئة ';
  }
?>

اذا كنت مبتدئ حاول أن لا تسارع في تعلم أشياء كثيرة أعطي نفسك وقت للاستيعاب وركز على الفهم والتعلم ولا تركز عن السرعة التي تتعلم بها

بالتوفيق.

Sam Ahw · 19 يونيو 2021

المشكلة كونك لا تريد استخدام أي أطر عمل، ستضطر للتعامل مع أساسيات لغة PHP بنفسك، وذلك يتطلب المزيد من الوقت والجهد لفهم توابع اللغة الأساسية وتفاصيلها والحالات المختلفة لها.

مثال بسيط لرفع الملفات عن طريق PHP:

نقوم أولاً بكتابة الصفحة التي ستظهر للمستخدم، حيث سيقوم بالضغط على زر استعراض الملفات من جهازه ثم سيقوم بالضغط على زر (رفع الملف) ليتم رفعها إلى الخادم:

<!DOCTYPE html>
<html>
<body>

<form action="upload.php" method="post" enctype="multipart/form-data">
    اختر ملف للتحميل
  <input type="file" name="fileToUpload" id="fileToUpload">
  
  <input type="submit" value="رفع الملف" name="submit">
</form>

</body>
</html>

وبالتالي بشكل مشابه باستخدام AJAX نحصل على قيمة الحقل السابق (fileToUpload) ونقوم بتمريرها إلى الخادم من خلال إنشاء طلب من نوع POST أيضاً:

$('#upload').on('click', function() {
    var file_data = $('#fileToUpload').prop('files')[0];   
    var form_data = new FormData();                  
    form_data.append('file', file_data);                             
    $.ajax({
        url: 'upload.php',
        cache: false,
        contentType: false,
        processData: false,
        data: form_data,                         
        type: 'post',
        success: function(php_script_response){
            alert(php_script_response); // <-- إظهار رسالة تأكيد يمكن إرسالها كرد من الخادم
        }
     });
});

نقوم الآن بكتابة الملف upload.php والذي سيقوم باستقبال الطلب السابق (طلب رفع الملفات) ويقوم بمعالجته:


<?php
$target_dir = "uploads/";
$target_file = $target_dir . basename($_FILES["fileToUpload"]["name"]);
$uploadOk = 1;

$imageFileType = strtolower(pathinfo($target_file,PATHINFO_EXTENSION));

// يمكننا إجراء اختبار بسيط للتأكد من أن الملف الذي تم رفعه هو صورة

if(isset($_POST["submit"])) {
  $check = getimagesize($_FILES["fileToUpload"]["tmp_name"]);
  if($check !== false) {
    echo "File is an image - " . $check["mime"] . ".";
    $uploadOk = 1;
  } else {
    echo "File is not an image.";
    $uploadOk = 0;
  }
}
?>

Adnane Kadri · 19 يونيو 2021

بداية يجب عليك معاملة أية مشاكل و صعوبات تظهر معك كأشياء طبيعية في المجال و من جانب اخر هي إمتحانات لك و لا يجب عليك التفكير في التوقف عن ما أقدمت عليه بسبب أشياء تواجهها لأنه , و بهاته الطريقة , سيكون لديك الكثير لتتوقف من أجله .

كما أنه يجب عليك الإستفادة من الإجابات التي طرحها عليك الزملاء في أسئلتك السابقة :

و بشكل عام فإنه يجب عليك فهم منطق هاته العمليات لا التوغل في مثال عن كود واحد و إعتباره كمعيار أو دستور للعملية . فمثلا :

التشفير و فك التشفير :

للتشفير : سيكون عليك تشفير سلسلة نصية معينة قبل إستعمالها , ولقراءته سنحتاج فك هذا التشفير .

مثال عن الإستعمال : تشفير كلمة المرور قبل إدخالها في قاعدة البيانات في عملية تسجيل المستخدم - أ - , ثم فك تشفيرها للتحقق من مطابقتها لكلمة مرور قام المستخدم - أ - بإدخالها في عملية تسجيل دخوله لاحقا.

أي : أننا نحتاج دالة تشفير و دالة فك تشفير . أو دالة و دالة معاكسة لها لعمل الفكرة , و قد تكتب خوارزميتك الخاصة للتشفير وفك التشفير أنت ذاتك فالعملية ليست حكرا على أحد لكن يقترح إستعمال المكتبات و الدوال المسبق تعريفها لأمان و سرعة أكثر .

و دوال التشفير كثيرة من PHP نذكر من بينها :

openssl_encrypt و الدالة المعاكسة لها : openssl_decrypt : توثيق . أمثلة :

<?php

$example = '@123456'; # السلسلة النصية المراد تشفيرها 
$cipher_algo = 'AES-128-CTR'; # خوارزمية التشفير 
$encryption_key = 'HsoubAcademy'; # مفتاح التشفير 
$options = 0; # خيارات التشفير 
$encryption_iv = 1234567891011121; # يعبر عن بادئة التشفير 


$encrypted_example = openssl_encrypt($example ,
                                     $cipher_algo ,
                                     $encryption_key ,
                                     $options ,
                                     $encryption_iv);
echo $encrypted_example;

// النتيجة : nLTaaXcr1A==

$decrypted_example = openssl_decrypt($encrypted_example ,
                                     $cipher_algo ,
                                     $encryption_key ,
                                     $options ,
                                     $encryption_iv);
echo $decrypted_example;

// النتيجة : @123456

base64_encode و الدالة المعاكسة لها : base64_decode . توثيق . أمثلة :

<?php 

$example = '@123456'; # السلسلة النصية المراد تشفيرها 

$encrypted_example = base64_encode($example);
echo $encrypted_example;

// النتيجة : QDEyMzQ1Ng==


$decrypted_example = base64_decode($encrypted_example);
echo $decrypted_example;


// النتيجة : @123456

bin2hex و الدالة المعاكسة لها : hex2bin . توثيق و أمثلة .

و غيرها الكثير ..

كما يمكنك القراءة عن الموضوع أكثر هنا :

رفع الصور و الملفات عن طريق الأجاكس :

جافاسكربت تجعل ذلك بسيطا عن طريق إستعمال كائن يختص بنماذج البيانات و هو الكائن FormData , و لإرسال صورة أو ملف ما علينا إلا : إرسال نموذج من الكائن FormData يحمل الملف.

لاحظ جيدا منطق الخطوات بالمثال التالي :

$(document).ready(function(){
     
    // 1 - إضافة حدث عن تقديم الاستمارة و رفع الملف
    $("#submit_file_form").click(function(){
        
        // 2 - FormData تحضير نموذج عن الكائن 
        var fd = new FormData();
        
        // 3 - تحديد الملف
        var files = $('#my_file')[0].files;
        
        // 4 - التحقق من تحميل ملف 
        if(files.length > 0 ){
          
           // 5 - إضافة الملف إلى نموذج الكائن
           fd.append('file',files[0]);
           
           // 6 - تحضير طلب الاجاكس و إرسال نموذج الكائن
           $.ajax({
              url: 'path/to/endpoint',
              type: 'POST',
              data: fd,
              contentType: false,
              processData: false,
              success: function(response){
                 if(response){
                    alert('تم رفع الملف');
                 }else{
                    alert('لم يتم رفع الملف');
                 }
              },
           });
        }else{
           alert("قم بتحديد ملف لرفعه.");
        }
    });
});

معيارية MVC :

و هي إختصار لـ Model , View , Controller و ببساطة شديدة هو نموذج معيارية Design Pattern يقضي بعزل منطق العمل عن واجهة المستخدم بهدف تحقيق إستقلالية كل منهما و تسهيل التعامل معهما في التطوير , الفحص و الصيانة . و يحقق بذلك أحد مبادئ التصميم المشهورة في علوم الحاسب : مبدأ فصل الإهتمامات separation of concerns (SoC).

تقوم معيارية MVC بتقسيم التطبيق إلى ثلاث أجزاء :

النموذج Model : يعبر عن المكون المركزي و الرئيسي للنمط Pattern . و يمثل بنية البيانات الخاصة بالتطبيق ، فعن طريقه تتم مباشرة إدارة بيانات وقواعد التطبيق .
العرض View : و هي أي تمثيل للمعلومات مثل صفحة ويب , جداول أو نصوص . و تمثل ها هنا واجهة المستخدم .
المتحكم Controller : و يقوم بإستقبال المدخلات و التحكم فيها و التحقق من إمكانية تمريرها للنموذج Model حتى يتصرف بناء عليها .

هذا الفصل بين المكونات الثلاث هاته يجعلها تتفاعل فيما بينها بهاته الطريقة :

النموذج Model مسؤول عن إدارة بيانات التطبيق . بحيث يتلقى مدخلات المستخدم من وحدة التحكم Controller .
تستجيب وحدة التحكم Controller لإدخال المستخدم , وتتحقق من سلامتها ثم تقوم بتمرير مدخل المستخدم إلى النموذج Model , أو تقوم إستجابة لمدخل المستخدم بعرض View بتنسيق معين .

و بشكل عام فإن أي فصل لهاته الثلاث مكونات , اهتمامات و وظائف هي معيارية تصميم MVC مثلها مثل أي معيارية أخرى , يتطلب التعمق فيها فهما أوسع و أعمق لأنماط ومعياريات التصميم Design Patterns . إن لم يكن لك إطلاع مسبق عنها فيمكنك أخذ فكرة عن الموضوع هنا و أيضا هنا .

كما يمكنك الإطلاع عن الكود المصدري لهاته النماذج المصغرة لمعيارية MVC هنا و هنا . و بالطبع فإنه يمكنك التدرب على فصل هاته المكونات الثلاث لتطبيق الفكرة عمليا .

علي الكاسر · 19 يونيو 2021

بتاريخ منذ ساعة مضت قال Adnane Kadri:

{ // 1 - إضافة حدث عن تقديم الاستمارة و رفع الملف $("#submit_file_form").click(function(){ // 2 - FormData تحضير نموذج عن الكائن var fd = new FormData();

اخي ممكن ترسل كود html و php الخاص بهذا الكود

Adnane Kadri · 19 يونيو 2021

بتاريخ 59 دقائق مضت قال علي الكاسر:

اخي ممكن ترسل كود html و php الخاص بهذا الكود

تذكر جيدا ما أشرت إليه سابقا :

اقتباس

و بشكل عام فإنه يجب عليك فهم منطق هاته العمليات لا التوغل في مثال عن كود واحد و إعتباره كمعيار أو دستور للعملية .

لكن هذا لا يمنع من تقديم شيفرة كمثال متكامل .

لاحظ المثال التالي :

1. نقوم بإنشاء بنية الملفات التالية :

60cdd83b6a106_Screenshotfrom2021-06-1912-41-31.png.4f9ee4b623c269b741b3700791ea8c25.png

2. بملف index.html سيكون علينا تعريف بنية مشابهة للتالي , كما أنه يجب علينا تحضير طلب الأجاكس و إرساله :

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>مثال عن رفع ملف</title>
</head>
<body>
    <section>
        <div>
            <label>قم بتحديد ملف</label>
            <input type="file" id="my_file">
        </div>

        <div>
            <button type="button" id="submit_file_form">رفع الملف</button>
        </div>
    </section>

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
    <script>
        $(document).ready(function(){
     
            // 1 - إضافة حدث عن تقديم الاستمارة و رفع الملف
            $("#submit_file_form").click(function(){
                
                // 2 - FormData تحضير نموذج عن الكائن 
                var fd = new FormData();
                
                // 3 - تحديد الملف
                var files = $('#my_file')[0].files;
                
                // 4 - التحقق من تحميل ملف 
                if(files.length > 0 ){
                  
                   // 5 - إضافة الملف إلى نموذج الكائن
                   fd.append('file',files[0]);
                   
                           // 6 - تحضير طلب الاجاكس و إرسال نموذج الكائن
                        $.ajax({
                           url: 'file_uploader.php',
                           type: 'POST',
                           data: fd,
                           contentType: false,
                           processData: false,
                           success: function(response){
                              if(response){
                                 alert('تم رفع الملف');
                              }else{
                                 alert('لم يتم رفع الملف');
                              }
                           },
                        });
                }else{
                   alert("قم بتحديد ملف لرفعه.");
                }
            });
        });
    </script>
</body>
</html>

3. بملف file_uploader.php سيكون علينا إستقبال الطلب الحامل للملف و معالجته بشكل طبيعي تماما على نحو مشابه :

<?php

if(isset($_FILES['file']['name'])){

   /* جلب اسم الملف */
   $filename = $_FILES['file']['name'];

   /* تحضير وجهة تخزين للملف */
   $location = "uploaded/".$filename;
   
   /* تحضير متغير يحمل حالة الرد */
   $response = false;
   
   /* تخزين الملف */
   $file_uploaded = move_uploaded_file($_FILES['file']['tmp_name'],$location);
   
   /* تغيير الحالة ان تم تخزين الملف بنجاح */
   if($file_uploaded){ $response = true; }
   
   /* إعادة قيمة بوليانية في الرد */
   return $response;
}

return false;

علي الكاسر · 19 يونيو 2021

بتاريخ 4 ساعات قال Adnane Kadri:

لكن هذا لا يمنع من تقديم شيفرة كمثال متكامل .

لاحظ المثال التالي :

1. نقوم بإنشاء بنية الملفات التالية :

لم يتم تحميل الملف هذا ااذي يظهر فقط

علي الكاسر · 19 يونيو 2021

بتاريخ 9 ساعات قال Adnane Kadri:

بداية يجب عليك معاملة أية مشاكل و صعوبات تظهر معك كأشياء طبيعية في المجال و من جانب اخر هي إمتحانات لك و لا يجب عليك التفكير في التوقف عن ما أقدمت عليه

شكرا لك اخي لقد عمل الكود وفهمته

الان كيف اقوم بمتابعة عملية التحميل وعمل شريط تقدم التحميل

ثلاث حاجات عجزت في تعلمهن في البرمجة

السؤال

علي الكاسر

9 أجوبة على هذا السؤال

Recommended Posts

عبدالله عبدالرحمن11

علي الكاسر

Salah Eddin Beriani2

Sam Ahw

Adnane Kadri

التشفير و فك التشفير :

رفع الصور و الملفات عن طريق الأجاكس :

معيارية MVC :

علي الكاسر

Adnane Kadri

علي الكاسر

علي الكاسر

انضم إلى النقاش

إعلانات

تابعنا على

الرئيسية

تابعنا

دروس ومقالات

أسئلة وأجوبة

كتب

دورات

بطاقات هدية