把请求发送到服务器上的文件,node.js - 无法使用post方法通过angular js 5将上传的文件发送到Node js服务器 - 堆栈内存溢出...

1)我正在从angular js 5应用程序上传图像并将其发送到node js服务器，该文件将存储在node js服务器的uploads文件夹中。

2)我在后端使用了multer(节点js)将上传的文件存储在服务器上。

3)我分别使用了角度js 5的http和httpclient，但是我仍然没有在服务器端上传文件。

4)当我通过邮递员软件发送请求上传文件的请求时，它可以正常工作，但是当我通过angular js 5发送请求时，它无法工作。

import { Component, OnInit } from '@angular/core'; import {HttpClient} from '@angular/common/http'; import { HttpHeaders,HttpRequest } from '@angular/common/http'; import {RequestOptions} from '@angular/http'; @Component({ selector: 'app-file-upload', templateUrl: './file-upload.component.html', styleUrls: ['./file-upload.component.css'] }) export class FileUploadComponent implements OnInit { public url: string = "http://localhost:3000/Tasks"; // end point (node js) fileToUpload : File = null; constructor(private http: HttpClient) { } ngOnInit() { } fileChange(files : FileList) { if(files.length > 0) { this.fileToUpload = files.item(0); console.log(this.fileToUpload.name); let formData : FormData = new FormData(); formData.append('upload file',this.fileToUpload,this.fileToUpload.name); // let headers = new Headers(); // headers.append('Content-Type',undefined); // let options = new RequestOptions({ headers: headers }); let headers = new HttpHeaders(); headers.set('Content-Type','multipart/form-data'); //let options = {headers : headers}; this.http.post(`${this.url}/upload`,{formData},{headers}) .subscribe( res => { console.log(res); }, err => { console.log("Error occured"); } ); } } }

import { BrowserModule } from '@angular/platform-browser'; import { NgModule } from '@angular/core'; import { AppComponent } from './app.component'; import { FileUploadComponent } from './file-upload/file-upload.component'; import { HttpClientModule } from '@angular/common/http'; @NgModule({ declarations: [ AppComponent, FileUploadComponent ], imports: [ BrowserModule, HttpClientModule ], providers: [], bootstrap: [AppComponent] }) export class AppModule { }

var express = require('express'); var router = express.Router(); var multer = require("multer"); var Task = require('../models/Task'); //var upload = multer({ dest: '../uploads/' }) var storage = multer.diskStorage({ //multers disk storage settings destination: function (req, file, callback) { callback(null, './uploads'); }, filename: function (req, file, callback) { var datetimestamp = Date.now(); callback(null, file.fieldname + '-' + datetimestamp + '.jpg'); } }); var upload = multer({storage: storage}).single('file'); /** API path that will upload the files */ router.post('/upload',function(req, res) { res.json({success: 'file uploaded successfuly ...'}); upload(req,res,function(err){ console.log('post() ..../'); console.log(req.file) if(err){ res.json({error_code:1,nperr_desc:err}); return; } res.json({ error_code:0,err_desc:null, success: 'file uploaded successfuly ...' }); }); }); module.exports = router;