[英]Angularjs - File upload with php
我花了幾天時間尋找一個相當簡單的angularjs文件上傳方法的集成,其中包括一個基本的php服務器端腳本..
我需要一個簡單的表單字段和文件上傳上傳。
我發現的所有例子都是嚴重依賴jQuery,或者如果它們看起來像我可以使用他們的“例子”那么完全不清楚和混亂。
這兩個例子(如果我能弄清楚如何與PHP合並)將解決我的難題..
本頁的示例5 http://ng-upload.eu01.aws.af.cm/
此頁面上的示例是我非常喜歡的一個.. http://angular-file-upload.appspot.com/
有人可以為我帶來更多的光。我真的希望看到一個輸入文件和一個文件上傳盡可能簡單的角度和PHP代碼,如果這樣的事情存在於某處。
我很樂意實施這個http://twilson63.github.io/ngUpload/或http://angular-file-upload.appspot.com/
如果這是我的PHP
$fname = $_POST["fname"];
if(isset($_FILES['image'])){
$errors= array();
$file_name = $_FILES['image']['name'];
$file_size =$_FILES['image']['size'];
$file_tmp =$_FILES['image']['tmp_name'];
$file_type=$_FILES['image']['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,"images/".$file_name);
echo $fname . " uploaded file: " . "images/" . $file_name;
}else{
print_r($errors);
}
}
?>
這是我的基本HTML
<form action="" method="POST" enctype="multipart/form-data">
<input type="text" name="fname" />
<input type="file" name="image" />
<input type="submit"/>
</form>
我怎么能這樣(干凈利落)? 我的控制器和調整后的html應該是什么樣的?
如果使用ng-file-upload您可以在客戶端進行大多數預驗證,例如使用ngf-max-size或ngf-pattern指令檢查文件大小或類型。
Upload.upload()
會向服務器發送POST multipart / form-data請求,因此$_FILES['file']
應該包含上傳的文件。
HTML
<div ng-controller="MyCtrl">
<input type="text" name="username" ng-model="username"/>
<input type="file" ngf-select="onFileSelect($file)" ngf-pattern="'image/*'" ngf-max-size="2M">
</div>
JS:
//inject angular file upload directives and service.
angular.module('myApp', ['ngFileUpload']);
var MyCtrl = [ '$scope', 'Upload', function($scope, Upload) {
$scope.onFileSelect = function(file) {
if (!file) return;
Upload.upload({
url: '/upload.php',
data: {file: file, username: $scope.username}
}).then(function(resp) {
// file is uploaded successfully
console.log(resp.data);
});
};
}];
upload.php的
$fname = $_POST["fname"];
if(isset($_FILES['image'])){
//The error validation could be done on the javascript client side.
$errors= array();
$file_name = $_FILES['image']['name'];
$file_size =$_FILES['image']['size'];
$file_tmp =$_FILES['image']['tmp_name'];
$file_type=$_FILES['image']['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,"images/".$file_name);
echo $fname . " uploaded file: " . "images/" . $file_name;
}else{
print_r($errors);
}
}
?>
我還在與未定義的$文件作斗爭 - 我會猜測你是從php編寫html代碼並且沒有轉義$ in $ files。 無論如何,那是我的問題 - 應該是\\ $ files。
擔
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.