2015-12-21 116 views
1

我想知道如何讓php腳本檢索我的base64編碼圖像然後寫入服務器?我試圖從我的PHP腳本做一個後轉儲,我不斷得到一個迴應,它是空的。我試過以下幾個其他的stackoverflow指南,但沒有一個使用工廠afaik。如何將base64編碼的圖像傳遞給php?

JS

var app = angular.module("app", ["ui.bootstrap"]); 

//http://stackoverflow.com/questions/18571001/file-upload-using-angularjs 
app.factory('API', function ($http) { 
    return { 
    uploadImage: function (image) { 
      return $http.post('/js/upload.php', image); 
    } 
    } 
}); 

app.controller('MainController',['$scope', '$http', 'API', function($scope, $http, API) { 
    $scope.imageUrl = ""; 
    $scope.template = ""; 
    $scope.templates = [ 
    'select an option...', 
    'MakeGray', 
    'Canny' 
    ]; 

    $scope.template = $scope.templates[0]; 

    $scope.add = function() { 

    var f = document.getElementById('fileToUpload').files[0]; // name of image 
    var files = document.getElementById('fileToUpload').files; 
    var r = new FileReader(); 

    r.onload = function(event){ 
      console.log(event.target.result); 
    } 

    r.onloadend = function(e) { 

      var data = e.target.result; 
      var formData = new FormData();  

     $("#img1").prop("src", data); 
     $("#img2").prop("src", data); 

      formData.append("fileToUpload", f,f.name); 

      API.uploadImage(formData) 
     .success(function (imgUrl) { 
      $scope.imageUrl = imgUrl; 
     }) 
     .error (function (error) { 
     }); 
    } 

    r.readAsDataURL(f); 
    } 
}]); 

PHP

<?php 

if(isset($_FILES['fileToUpload'])){  
    $errors= array();   
    $file_name = $_FILES['fileToUpload']['name']; 
    $file_size =$_FILES['fileToUpload']['size']; 
    $file_tmp =$_FILES['fileToUpload']['tmp_name']; 
    $file_type=$_FILES['fileToUpload']['type']; 
    $file_ext = strtolower(pathinfo($file_name, PATHINFO_EXTENSION)); 
    $extensions = array("jpeg","jpg","png");   
    if(in_array($file_ext,$extensions)=== false){ 
    $errors[]="image extension not allowed, please choose a JPEG or PNG file."; 
    } 
    if($file_size > 2097152){ 
    $errors[]='File size cannot exceed 2 MB'; 
    }    
    if(empty($errors)==true){ 
    move_uploaded_file($file_tmp,"../uploads/".$file_name); 
    echo " uploaded file: " . "images/" . $file_name; 
    }else{ 
    print_r($errors); 
    } 
} 
else{ 
    $errors= array(); 
    $errors[]="No image found"; 
    print_r($errors); 
} 
?> 
+0

你沒有做文件上傳。你只是從文件輸入中複製一些數據並將它們填充到一個新的表單中,而沒有告訴新的表單它是一個文件輸入。做一個'var_dump($ _ POST)',你可能會在那裏看到'fileToUpload'。 –

+0

我試過在我的php中,我什麼都沒有。 – Zypps987

+0

然後檢查'var_dump($ _ SERVER ['REQUEST_METHOD'])',確保是說post。如果沒有,那麼會導致重定向。嘗試向請求添加一對垃圾字段並查看它們是否經過任何地方。 –

回答

0

角有值得關注的特殊性上傳。

首先,你必須硝酸鉀,棱角分明的默認transformRequest功能將嘗試我們的序列化對象FORMDATA,所以我們與身份功能原樣保留數據覆蓋它。

接下來,POST請求的默認內容類型標題是「application/json」,因此您必須更改此名稱是因爲您要上載文件。 通過設置'Content-Type':undefined,瀏覽器將Content-Type自己設置爲multipart/form-data,並填充正確的邊界。 手動設置'Content-Type':multipart/form-data將無法​​填寫請求的邊界參數。

看別人可能出現的問題:https://docs.angularjs.org/api/ng/service/$http

現在你可以讓你從$ _ POST全球PHP的陣列圖像。

固定碼

uploadImage: function (formData) 
    { 
     return $http.post('js/upload.php', formData, 
     { 
      transformRequest: angular.identity, 
      headers: {'Content-Type': undefined} 
     }); 
    } 

注:

那下面的服務使用不是由IE9和更早版本支持FORMDATA對象。

+0

我可以用什麼來獲取其他php方面的數據?我正在使用cakphp – hardik