Uploading from MAC Photos app to PHP form

Question

I have a user that's having trouble uploading from their MacBook Air Photos App. The MacBook is only 2 years old and updated and they are able to upload a picture regularly without the app. I can't replicate the problem myself and am having a hard time with this.

Php code does validation before uploading to server

    if(getimagesize($_FILES['image']['tmp_name']) == TRUE){ //files have tmp_names on server when being uploaded

  $name; $image; //Vars created here for use in retrieving image id from DB afterwords
  function saveImage($uid,$name,$image){
      //Update to get rid of default pic from registration
      $qry = "UPDATE profile_pics SET name='$name', image='$image' WHERE user_id='$uid';";
      $result=mysql_query($qry) or die(mysql_error());

      if($result){
          echo "<br/>Image uploaded.";
      }
      else{
          echo "<br/>Image not uploaded.";
      }
  }

  if($_FILES['image']['size'] < 1020000){ //1.02 since file size grows when uploaded to server.
    $finfo = finfo_open(FILEINFO_MIME_TYPE);
    $mime = finfo_file($finfo, $_FILES['image']['tmp_name']);
    $ok = false;
    switch ($mime) {
      case 'image/jpeg':
      case 'image/pjpeg':
      case 'image/png':
      case 'image/gif':
      case 'image/jpg':
        $ok = true;
        break;
      default:
      $errors[] = lang("ACCOUNT_PIC_WRONG_FILETYPE");
        // die("Unknown/not permitted file type");
    }
    if($ok == true){
      $image= addslashes($_FILES['image']['tmp_name']); //addslashes() function returns a string with backslashes in front of predefined
      $name= addslashes($_FILES['image']['name']);      //characters: ', ", \, NULL. To prepare string for storage in a database and database queries
      $image= file_get_contents($image);
      $image= base64_encode($image);
      saveImage($uid,$name,$image);
    }
  }else{
    $errors[] = lang("ACCOUNT_PICSIZE_TOO_LARGE");
  }
}

HTML/Javascript part of form. Javascript does some validation before going to backend. This is to alert the user of errors before the form is submitted.

 <script type="text/javascript">
  //Check to make sure pic size not to large
  jQuery(document).on("change", ".input-pic[type=file]", function () {
      var file = this.files[0];
      var size = file.size / 1024;
      var ext = file.name.split('.').pop();
      if (size > 1020) {
          alert("Too large Image. Only image smaller than 1MB (1000kB) can be uploaded.");
          //If too large, make field empty again
          jQuery(this).replaceWith('<input type="file" class="form-control input-pic" name="image" id="image">');
      }else if(ext == "jpeg" || ext == "pjpeg" || ext == "png" || ext == "gif" || ext == "jpg"){
        //Do nothing, valid image type
      }else{
        alert("Only jpeg, png, and gif pictures may be uploaded. You uploaded: ."+ext);
        jQuery(this).replaceWith('<input type="file" class="form-control input-pic" name="image" id="image">');
      }
  });
  </script>

  <div class='row form-row' style="padding-bottom:10px;">
    <div class='col-md-12'>
      <strong for="image">Upload a profile picture (JPG/PNG/GIF size limited to 1MB)</strong>
    <input type="file" class="input-pic form-control" name="image" id="image">
    </div>
  </div>

They keep receiving the alert in the javascript: MAC Photos error alert Again, they don't get this when they upload it outside of the app normally (like a PC user would do).

Answer 1

I believe OS X is setting the extension to upper case. Try var ext = strtolower(file.name.split('.').pop();) and see if its just a validation issue.

Note: You're only validating the file extension - this is a HUGE security risk.