无法上传文件，php和angularjs

Posted 2023-02-25

【中文标题】无法上传文件，php和angularjs

【英文标题】：Can't upload files, php and angularjs

【发布时间】：2014-11-21 13:33:40

【问题描述】：

我正在尝试使用 angularJs 和 php 上传文件。

我正在使用 angular-file-upload，https://github.com/danialfarid/angular-file-upload。

问题似乎出在我的 PHP 代码中，因为它想将文件移动到目标目录。

这是我的角度：

$scope.onFileSelect = function($files) //Vi har valt en eller flea filer //$files är en 数组 innehållande de valda filerna att ladda upp。 Dess namn, storlek och typ

for(var i = 0; i < $files.length; i++)

    var file = $files[i];
    $scope.upload = $upload.upload(
        url: 'lib/actions.php',
        data: myObj: $scope.myModelObj,
        file: file

    ).progress(function(evt) 
        console.log('percent: ' + parseInt(100.0 * evt.loaded / evt.total));
    ).success(function(data, status, headers, config) 
        console.log(data);
    );

;

这很好用。对我的 PHP 文件进行了 POST：

if(isset($_FILES['file']))

    $target_dir = "books/";
    $target_file = $target_dir . basename($_FILES["file"]["name"]);

    if(move_uploaded_file($_FILES['file']['tmp_name'], $target_file))
    
        echo "YES";
    
    else
    
        echo "wrong";
    
   

这总是打印“错误”。我不明白为什么。谁能帮帮我？

【问题讨论】：

我认为，这是关于路径的问题。让我们var_dump(getcwd()) 看看，你的当前目录是什么，是否有一个books 子目录

@lolka_bolka 的输出是：string(21) "/var/www/cryptlib/lib"

书籍目录在哪里？ /var/www/cryptlib/lib/books 或 /var/www/cryptlib/books?

@lolka_bolka：是的，它在 lib 目录中。

所有权限都对吗？使用777 进行测试，但不要忘记设置回775 或755。

【参考方案1】：

尝试使用多部分 POST 类型而不是 $_FILES，这是发布文件的一种优雅方式：http://uncorkedstudios.com/blog/multipartformdata-file-upload-with-angularjs。这对我有用。

编辑

如果链接的网站出现问题，我最好用优雅的方式在这里写下来。

您需要创建一个附加到控制器的指令，以便您可以处理当前范围，该指令可以如下所示：

.directive('fileModel', ['$parse', function ($parse) 
return 
    restrict: 'A',
    link: function(scope, element, attrs) 
        var model = $parse(attrs.fileModel);
        var modelSetter = model.assign;

        element.bind('change', function()
            scope.$apply(function()
                modelSetter(scope, element[0].files[0]);
            );
        );
    
;

]);

创建指令后，您可以在 html 部分中使用，如下所示：

<input type="file" file-model="myFile"/>

好的，现在我们有我自己的指令可以处理您的文件，我们需要发送到服务器（在您的情况下为 localhost）。所以我们为此提供服务：

.service('fileUpload', ['$http', function ($http) 
this.uploadFileToUrl = function(file, uploadUrl)
    var fd = new FormData();
    fd.append('file', file);
    $http.post(uploadUrl, fd, 
        transformRequest: angular.identity,
        headers: 'Content-Type': undefined
    )
    .success(function()
    )
    .error(function()
    );

]);

就像这样，你可以给这个服务任何 url，而不仅仅是你的本地主机，还有你想要上传的文件。

但是我们如何做到这一点？只需将其复制到您的控制器：

var file = $scope.myFile;
var uploadUrl = 'http://www.example.com/images';
fileUpload.uploadFileToUrl(file, uploadUrl);

这应该可行。 :)

【讨论】：

虽然此链接可能会回答问题，但最好在此处包含答案的基本部分并提供链接以供参考。如果链接页面发生更改，仅链接的答案可能会失效。