Загрузка картинки через ajax

Друзья, после загрузки картинки на сервер, картинка не открывается. Т.е. файл не корректный. Вот мой код, возможно кто то поможет найти ошибку и понять в чем дело:

Есть инпут, с id = pack_avatar. На событие onchange этого инпута прикреплена функция:

function SetFile()
    {
      var file = document.getElementById("pack_avatar").files[0];
      var reader = new FileReader();
      reader.readAsText(file, "UTF-8");
      reader.onload = shipOff;
    }

после окончания чтения вызывается функция shipOff:

function shipOff(event) {
      var result = event.target.result;
      var fileName = document.getElementById("pack_avatar").files[0].name;
      $.ajax({
        type: "POST",
        url: "/functions/dbfunctions.php",
        data: {
        data1: result,
        name: fileName,
        type: 11,
        }
      }).done(function(msg){
        alert(msg);
      });
    }

Вот собственно обработчик php:

if($_POST['type']=="11")
  {
    $data = $_POST['data1'];
    $fileName = $_POST['name'];
    $serverFile = time().$fileName;
    $fp = fopen('/home/p275351/public_html/****/packs/avatars/'.$serverFile, 'wb');
    fwrite($fp, $data);
    fclose($fp);
    $returnData = array( "serverFile" => $serverFile );
    echo json_encode($returnData);
  }

В результате, в папку packs/avatars/ загружается файл (картинка). Но когда я ее скачиваю она не открывается. Я пробовал в fopen использовать "wb", но это не принесло результата. Кодировка утф8. По обьему файл соответствует тому что загружаю через поле.