如何使用AngularJS的$ http將文件發送到PHP腳本

我想我的問題已經夠清楚了，但在這裏有一些細節。我對Angular和PHP非常陌生，所以我可能犯了很多錯誤或錯過了重要的東西:)。

我首先有一個包含文本和文件輸入的表單。就像這樣：

<div><label for="textInput">Text input</label></div> 
 
<div><input id="textInput" name="textInput" type="text" ng-model="form.textInput"></div><br/> 
 
<div>Put some file please</div> 
 
<div> 
 
    <input id="file1" type="file" name="file1" ng-model="form.file1"><br/> 
 
    <input id="file2" type="file" name="file2" ng-model="form.file2"> 
 
</div>

要與NG-模型發佈的文件我用這個指令：

(function() { 
    fileInput.$inject = []; 
    function fileInput() { 
     var fileTypeRegex = /^file$/i; 
     return { 
      restrict: 'E', 
      require: '?ngModel', 
      link: link 
     }; 
     function link(scope, element, attrs, ngModel) { 
      if (ngModel && element[0].tagName === 'INPUT' && fileTypeRegex.test(attrs['type'])) { 
        element.on('change', function() { 
        var input = this; 
         if ('multiple' in attrs) { 
         var files = Array.prototype.map.call(input.files, function (file) { return file; }); 
         ngModel.$setViewValue(files); 
        } 
        else { 
         ngModel.$setViewValue(input.files[0]); 
        } 
       }); 
      } 
     } 
    } 
    angular.module('ng-file-input', []).directive('input', fileInput); 
}());

最後，我用$ HTTP發送數據：

$http({ 
    url: window.API_URL + 'postulate.php', 
    method:'POST', 
    data:$scope.form 
}).then(function successCallback(response){ 
    console.log(response.data); 
    console.log($scope.form); 
});

在PHP文件中，我只獲取$ _POST數據並打印出來：

$rest_json = file_get_contents("php://input"); 
$_POST = json_decode($rest_json, true); 
echo json_encode($_POST);

這就是問題所在。我得到與console.log（）：

Object {textInput: "the content", file1: Array[0], file2: Array[0]} 
Object {textInput: "the content", file1: File, file2: File}

做了很多谷歌和測試，但我無法得到它的工作。

詢問我是否需要更多詳細信息。

來源

2016-07-06 Romain Bouvet

要想從PHP，你需要使用PHP $_FILES全局變量實際上是包含像name，type，tmp_name一些字段的數組設置槽AJAX的文件。所以，如果你發送多個文件，合併數組應該是這個樣子：

Array 
(
    [image] => Array 
     (
      [name] => MyFile1.jpg (comes from the browser, so treat as tainted) 
      [type] => text/plain (not sure where it gets this from - assume the browser, so treat as tainted) 
      [tmp_name] => /tmp/php/php1h4j1o // this is were the temporally file is saved on the server 
      [error] => UPLOAD_ERR_OK (= 0) 
      [size] => 123 (the size in bytes) 
     ) 

    [image] => Array 
     (
      [name] => MyFile2.jpg 
      [type] => image/jpeg 
      [tmp_name] => /tmp/php/php6hst32 
      [error] => UPLOAD_ERR_OK 
      [size] => 98174 
     ) 
)

爲了獲得在PHP如果$ _FILES設爲您可以檢查文件或它不是空的：

if (isset($_FILES['image']['name']) && (file_exists($_FILES['image']['tmp_name']))) { 
    // do the job here 
}

這裏的image字段的名稱取決於你如何在你的html中定義表單。例如，如果你有一個輸入字段聲明：

<input type="file" name="image" id="image">

那麼這裏的名字是你如何識別$_FILES第一場。所以實際上你會根據數組鍵獲取文件。

希望這是明確的。

來源

2016-07-06 09:39:08

我不能使用'$ _POST'？好我的壞我想我看到這個http://php.net/manual/en/features.file-upload.post-method.php所以我想我可以用'$ _POST'來做到這一點。然後我有一些問題：你說：「要獲得php中的文件，你可以檢查'$ _FILES'是否被設置或它不是空的。我試圖打印'$ _FILES'，但我得到了console.log（）：'[]' –

你必須在PHP中完成。做一個'echo'或'var_dump'，然後'die'這樣你就會收到響應。 –

我確實在PHP中使用它。不是嗎？ console.log（）的第一行對應於我的PHP響應。或者我誤解了你？ –

如何使用AngularJS的$ http將文件發送到PHP腳本

回答

相關問題