从Angular 9到Laravel的文件上传不起作用 [英] File upload from Angular 9 to Laravel not working

问题描述

我正在尝试将图像从 9号角上传到 Laravel .我在本地计算机上配置了角度项目.Laravel项目在另一台服务器中.我正在使用api调用来从larvel到angular获取数据.一切正常，但文件上传不起作用.服务器中的请求获取为空.(在usercontroller中)下面是我的代码:

I am trying to upload image from angular 9 to Laravel. I configured angular project in my local machine. And Laravel project is in another server. I am using api calls to get data from larvel to angular. All are working fine but File upload is not working. The request get in server is null.(in usercontroller) Below is my code:

<form [formGroup]="mediaFormGroup" (ngSubmit)="uploadMedia()">
<label>Image:</label>
<input  type="file" name="media_file" (change)="onFileChange($event)" />
<button type="submit" [disabled]="mediaStatus">Upload</button> 
</form>

product.component.ts [文件更改功能和上传功能]

onFileChange(event) {
if (event.target.files.length > 0) {
this.file = event.target.files[0];
this.thumbFileName = <File>event.target.files[0].name;
var reader = new FileReader();  
reader.onload = (event: any) => {  
      this.thumbUrl = event.target.result;  
}  
reader.readAsDataURL(this.file);  
}
}

uploadMedia(){
const formData = new FormData();
const headers = new HttpHeaders();
headers.append('Content-Type', 'multipart/form-data');
headers.append('Accept', 'application/json');
formData.append('thumbimage', this.file);
this.http.post(`${this.API_URL}/user/uploadImage`, formData, {
      headers: headers
      }).subscribe(data => {
          return data;
      });
}

Laravel

routes/api.php

Route::post('user/uploadImage', "User\UserController@uploadImage");

UserController.php

public static function uploadImage(Request $request){
       //return $request;  // null
 if ($request->hasFile('thumbimage'))
 {
       $file      = $request->file('thumbimage');
       $filename  = $file->getClientOriginalName();
       $extension = $file->getClientOriginalExtension();
       $picture   = date('His').'-'.$filename;
       $file->move(public_path('tImg'), $picture);
       return response()->json(["message" => "Image Uploaded Succesfully"]);
  }else{
       return response()->json(["message" => "Select image first."]); // returns this
  }
}

uploadImage 函数返回首先选择图像

请求在服务器中获取为 null .

The request is getting as null in server.

我的代码有什么问题?我认为有人可以帮助我.

What is wrong in my code? I think someone can help me..

推荐答案

我也遇到了这个问题.我最终使用了PHP文件数组.

I also had this problem. I ended up using the PHP files array.

$_FILES['filename']['tmp_name']

导入此类:

use Illuminate\Http\UploadedFile;

然后创建一个新的UploadedFile;

then create a new UploadedFile;

$name = $_FILES['filename']['name'];
$tempPath = $_FILES['filename']['tmp_name']
$file = new UploadedFile(
    $tempPath,
    $name,
);

// do other stuff
$original_name = $file->getClientOriginalName();
$ext = strtolower($file->getClientOriginalExtension());
$size = $file->getSize();
$type = $file->getMimeType();

$hashName = $file->hashName();
 

如果您有多个文件:

// $_FILES['filename']['name'] 'An associative array of items uploaded to the 
// current script via the HTTP POST method'
$files = $_FILES['filesarray']
for ($i = 0; $i < count($files['name']); $i++) {
    $name = $files['name'][$i];
    $file = new UploadedFile(
        $files['tmp_name'][$i],
        $name  
    );
    // Do stuff with file
};

有关PHP $ _FILES数组的更多信息，请检查文档:

For more on the PHP $_FILES array check the docs:

https://www.php.net/manual/en/features.file-upload.post-method.php

这篇关于从Angular 9到Laravel的文件上传不起作用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！