title: Upload file security check
body: <p>i need some help improving my code. I have used some authentications and preventions, the problem is that the user can upload files by changing the file extension to the allowed one.</p>
  
  <p>Here Is JQuery Code:</p>
  
  <pre><code>&lt;script&gt;
  $(document).ready(function(){
  
   $(document).on('click', '#insert_profile_post_btn', function(){
  
     var profile_post_title = $("#insert_profile_post_title_id").val();
     var profile_post_descp = $("#insert_profile_post_descp_id").val();
     var profile_post_file = $("#insert_profile_post_file_id").val();
  
     if (profile_post_title == "" &amp;&amp; profile_post_descp == "" &amp;&amp; profile_post_file == "") {
       swal({
         title: 'Error',
         text: 'Field is empty!',
         icon: 'error',
         button: 'Try again!',
       });
       $("#insert_profile_post_title_id").val('');
       $("#insert_profile_post_descp_id").val('');
       $("#insert_profile_post_file_id").val('');
  
     }
  
    var name = document.getElementById("insert_profile_post_file_id").files[0].name;
    var form_data = new FormData();
    var ext = name.split('.').pop().toLowerCase();
  
    if(jQuery.inArray(ext, ['mp4','wmv','avi','mkv','gif','png','jpg','jpeg']) == -1)
    {
      swal({
        title: 'Error',
        text: 'This file extension is not allowed!',
        icon: 'error',
        button: 'Try again!',
      });
      $("#insert_profile_post_file_id").val('');
  
    }
    var oFReader = new FileReader();
    oFReader.readAsDataURL(document.getElementById("insert_profile_post_file_id").files[0]);
    var f = document.getElementById("insert_profile_post_file_id").files[0];
    var fsize = f.size||f.fileSize;
    if(fsize &gt; 5000000)
    {
      swal({
        title: 'Error',
        text: 'The file size is too big!',
        icon: 'error',
        button: 'Try again!',
      });
      $("#insert_profile_post_file_id").val('');
  
    }
    else
    {
      swal({
          title: 'Good job!',
          text: 'Posted successfully!',
          icon: 'success',
          button: 'OK',
        });
      var userid = &lt;?php echo $userid; ?&gt;;
      var usersessionemail = "&lt;?php echo $user; ?&gt;";
      var ifisset = 1;
  
  
     form_data.append("insert_profile_post_file_id", document.getElementById('insert_profile_post_file_id').files[0]);
     form_data.append("user_id", userid);
     form_data.append("user", usersessionemail);
     form_data.append("post_title", profile_post_title);
     form_data.append("post_descp", profile_post_descp);
     form_data.append("post_done", ifisset);
  
     $.ajax({
      url:"includes/actions/post_insert/user/my_profile_post/my_profile_post_insert.php",
      method:"POST",
      data: form_data,
      contentType: false,
      cache: false,
      processData: false,
  
      success:function(data)
      {
        $("#insert_profile_post_title_id").val();
        $("#insert_profile_post_descp_id").val();
        $("#insert_profile_post_file_id").val();
        loadref(2000)
      }
     });
    }
   });
  });
  
  //---------| REFRESH PAGE AFTER SUCCESS |---------//
  function loadref(time){
    setTimeout("location.reload(true);",time)
  }
  
  &lt;/script&gt;
  </code></pre>
  
  <p>Here Is PHP Code:</p>
  
  <pre><code>if (isset($_POST["post_done"]))
     {
    $userid=mysqli_real_escape_string($mysqli, strip_tags($_POST["user_id"]));
    $user=mysqli_real_escape_string($mysqli, strip_tags($_POST["user"]));
    $ptitle=mysqli_real_escape_string($mysqli, strip_tags(addslashes($_POST['post_title'])));
    $pdescp=mysqli_real_escape_string($mysqli, strip_tags(addslashes($_POST['post_descp'])));
  
    if($ptitle=="")
    {
      $ptitle="";
    }
  
    if($pdescp=="")
    {
      $pdescp="";
    }
  
    $img_name=mysqli_real_escape_string($mysqli, strip_tags($_FILES['insert_profile_post_file_id']['name']));
    $img_tmp_name=$_FILES['insert_profile_post_file_id']['tmp_name'];
  
    //////////////////| RESTRICTION |//////////////////
    $size=$_FILES['insert_profile_post_file_id']['size'];
    $file_extension= explode('.' , $img_name);
    $file_extension=  strtolower(end($file_extension));
    $final_file= uniqid().'.'.$file_extension;
  
    $prod_img_path=$final_file;
  
      move_uploaded_file($img_tmp_name,"../../../../../twigp_users/".$user."/Post/".$prod_img_path);
  
      $insofpost = "INSERT INTO `user_post` (`post_id`, `user_id`, `post_title`, `post_descp`, `post_pic`) VALUES (NULL, ?, ?, ?, ?);";
  
      //CREATE A PREPARED STATEMENT BY ADDING DATABASE:
      $stmt = mysqli_stmt_init($mysqli);
      // PREPARE THE PREPARED STATEMENT BY ADDING STATEMENT AND QUERY:
      if (!mysqli_stmt_prepare($stmt, $insofpost)) {
        echo "SQL Statement Failed";
      } else {
        // BIND PARAMETERS TO THE PLACEHOLDER "?"
        mysqli_stmt_bind_param($stmt, "ssss", $userid, $ptitle, $pdescp, $prod_img_path);
        // RUN PARAMETERS INSIDE DATABASE
        mysqli_stmt_execute($stmt);
      }
      //header("Location:index.php");
    }
  </code></pre>
  
  <p><strong>OVERVIEW OF THIS CODE:</strong></p>
  
  <p>(IN AJAX/jQuery PART).
  CHECKING THE FILE SIZE &amp; EXTENSION. </p>
  
  <p>(IN PHP PART).
  AGAIN CHECKING THE FILE SIZE &amp; EXTENSION.
  AND CHANGING THE FILE NAME TO THE UNIQUE ID.  </p>
  
  <p>After all the above code people can upload files by changing the file extension. How to secure the file upload. And if you have any recommendations for me please feel free to tell me. Thanks!!!</p>