Javascript 使用angularjs将图像传递到后端
我很难理解如何使用angularjs将图像上传到我的服务器(现在是我的本地主机) 在我的前端,我使用了一个带有角度指令的表单作为模型:Javascript 使用angularjs将图像传递到后端,javascript,php,angularjs,file,file-upload,Javascript,Php,Angularjs,File,File Upload,我很难理解如何使用angularjs将图像上传到我的服务器(现在是我的本地主机) 在我的前端,我使用了一个带有角度指令的表单作为模型: main.php <form> <div class="form-group"> <label for="myFileField">Select a file: </label> <input type="f
main.php
<form>
<div class="form-group">
<label for="myFileField">Select a file: </label>
<input type="file" file-model="MenuItem.myFile" class="form-control" id ="myFileField"/>
</div>
<button ng-click="uploadFile()" class = "btn btn-primary">Upload File</button>
</form>
在我的JS中,我从我的作用域中获取文件
$scope.uploadFile = function() {
var file = $scope.MenuItem.myFile;
console.log(file);
console.log($scope.MenuItem);s
qData = {
file_name: file['name'],
file_type: file['type'],
file_size: file['size'],
}
console.log(qData);
qF(qData, 'uploadImage');
};
为了解释上面的代码,我只是尝试打印出上面的信息并将其发送到我的后端文件。“qF”函数接受qData中的所有变量,并通过post将它们传递给我指定的任何php文件
问题是,我为后端找到的所有解决方案都涉及一个“tmp_name”变量,但我传递到php的“file”对象没有“tmp_name”。当I console.log退出“file”变量时,这是输出:
FILE:
lastModified: 1601663109351
lastModifiedDate: Fri Oct 02 2020 13:25:09 GMT-0500 (Central Daylight Time) {}
name: "SmallDoc.txt"
size: 0
type: "text/plain"
webkitRelativePath: ""
__proto__: File
我也不知道webkitRelativePath是什么。如果我能得到tmp_名称,我知道在后端该做什么。有没有一种方法可以在不使用此变量的情况下使用php文件将文件上载到硬编码位置,如果没有,如何获取它
我的xampp中的My php.ini:
> ;;;;;;;;;;;;;;;; ; File Uploads ; ;;;;;;;;;;;;;;;;
>
> ; Whether to allow HTTP file uploads. ; http://php.net/file-uploads
> file_uploads=On
>
> ; Temporary directory for HTTP uploaded files (will use system default
> if not ; specified). ; http://php.net/upload-tmp-dir
> upload_tmp_dir="C:\xampp\tmp"
>
> ; Maximum allowed size for uploaded files. ;
> http://php.net/upload-max-filesize upload_max_filesize=2000M
>
> ; Maximum number of files that can be uploaded via a single request
> max_file_uploads=20
为了清楚起见,我遇到的问题是,我基本上不知道如何完成从上传表单获取图像到存储在服务器/本地主机上的操作。我基本上被卡住了,无法将它移过我的JS。当您将文件上载到启用php的web服务器时,它会将文件临时存储在php.ini中指定的路径
upload\u tmp\u dir
中。在脚本执行期间,可以将此文件移动或复制到所需位置(如项目文件夹)。执行结束后,文件将自动从临时目录中删除
您可以通过
$\u FILES[“file”][“tmp\u name”]
获取此路径,然后可以使用诸如移动此文件或将此文件复制到项目目录之类的功能。不清楚。有什么问题吗?什么不起作用?我一直在JS上获取关于该文件的信息,但我不知道如何让该文件/使用php将该文件实际存储在我的服务器上。谢谢你提供的信息。当我执行“print\r($\u FILES)”时,它返回一个空数组。我错过上传步骤了吗?@BrennanVanDyke您可能没有正确发送此文件。
> ;;;;;;;;;;;;;;;; ; File Uploads ; ;;;;;;;;;;;;;;;;
>
> ; Whether to allow HTTP file uploads. ; http://php.net/file-uploads
> file_uploads=On
>
> ; Temporary directory for HTTP uploaded files (will use system default
> if not ; specified). ; http://php.net/upload-tmp-dir
> upload_tmp_dir="C:\xampp\tmp"
>
> ; Maximum allowed size for uploaded files. ;
> http://php.net/upload-max-filesize upload_max_filesize=2000M
>
> ; Maximum number of files that can be uploaded via a single request
> max_file_uploads=20