如何使用Angular File Upload(ng-file-upload)将图片上传到后端Laravel / PHP

问题描述 投票:0回答:0

我一直试图绕过ng-file-upload,但没有成功。

我正在尝试使用ng-file-upload上传图片以后端PHP / Laravel

我的角度控制器中有这个:

$scope.upload = function (file) {

    Upload.upload({
        method: 'POST',
        url: '/profile/photo/add',
        file: file,
        sendFieldsAs: 'form'
        //fileFormDataName: 'photo'
    })

    .success(function (data, status, headers, config) {
          dd(data);
          console.log('file ' + config.file.name + 'uploaded. Response: ' + data);
     })

    .error(function (data, status, headers, config) {
          dd(data);
          console.log('error status: ' + status);
     })

用于ng文件上传的HTML模板:

<div ngf-select="upload($file, $event)"
  ngf-change="upload($file, $event)"
  ngf-pattern="'image/*'"
  ngf-capture="capture"
  ngf-drag-over-class="{accept:'dragover', reject:'dragover-err',      delay:100}"
  ngf-validate="{size: {min: 10, max: '1MB'}, width: {min: 200, max:10000},  height: {min: 200, max: 300}, duration: {min: '10s', max: '5m'}, pattern: 'image/*'}"
  ngf-keep="false"
  ngf-allow-dir="true" class="drop-box"
  ngf-drop-available="dropAvailable">Select Photo,
  <span ng-show="dropAvailable">Drop/Paste Photo</span>

我还在Laravel中创建了一个路由/控制器

public function postAdd(PhotoRequest $request)
{
    //Here am just checking if file is valid but it always return false and uploads an unreadable file to /uploads/profile folder 
    if ($request->file('file')->isValid() && $request->hasFile('file')) {
        $request->file('file')->move(public_path('/uploads/profile/'));
        return json_encode($request->file('file')->isValid()); //returns false
    }else{
        return response()->json(['file not found']);
    }

 }

在chrome控制台中检查时,输出如下所示: 在此处输入图片说明

这些不可读的文件已上传

在此处输入图片说明

我究竟做错了什么?

javascript php angularjs ng-file-upload
© www.soinside.com 2019 - 2024. All rights reserved.