Question

我正在尝试使用angular和nodejs将图像上传到mongodb。代码如下。我有后端工作，但问题是我得到'C：fakepath / file.xyz'的html输入。我在网上寻找，发现没有办法获取文件的相对路径。有人可以告诉我如何更改前端代码以获取并将文件路径发送到后端然后保存。我读到浏览器不允许文件的相对路径，但是我该如何上传。谢谢！

nodejs图像保存方法为：

 async function SaveImage(userParam) {
    const entry = new imageEntries(userParam);
    entry.image.data = fs.readFileSync(userParam.imagePath);
    entry.image.contentType = 'image/png';
    await entry.save();
    }

html代码为：

<div class="upload-btn-wrapper">
  <button class="btn">Upload a file</button>
  <input type="file" name="myfile" id="myFile" />
</div>

我在后端通过的路径是：

ImageJournal.imagePath = (<HTMLInputElement>document.getElementById('myFile')).value;

但是使用上面的代码，我得到以下错误：

ENOENT: no such file or directory, open 'C:\fakepath\chapter9problemsandanswers.doc'

Answer 1

好的，这是

HTML：

<div class="form-group">
      <label for="pdf">PDF</label>
      <input type="file" id="pdf" (change)="onFileChange($event)" #fileInput>
      <button type="button" class="btn btn-sm btn-default" (click)="clearFile()">clear file</button>
</div>

TS：

import { Component, OnInit, ElementRef, ViewChild } from '@angular/core';
@ViewChild('fileInput') fileInput: ElementRef;
public image;

 onFileChange(event) {
    let reader = new FileReader();
    if(event.target.files && event.target.files.length > 0) {
      let file = event.target.files[0];
      reader.readAsDataURL(file);
      let value = <String>reader.result;
      reader.onload = () => {
        this.image = {
          filename: file.name,
          filetype: file.type,
          value: value.split(',')[1]
        };
      };
    }
  }

然后将带有http帖子的图像发送给服务。在服务器上：

//发送文件

app.post('/api/sendFile', function (req, res) {
    File.create({
        filename: req.body.filename,
        filetype: req.body.filetype,
        value: req.body.value
    }, function (err, file) {
        if (err)
            res.send(err);
        else {
            const response = {
                name: file.filename
            }
            res.send(response);
        }
    });
});

这是用mongoDb和mongoose编写的，我有一个名为File的模型。这就是保存它的全部。

使用angular和Node.js将文件保存到mongodb

1 个答案: