Question

以下特定用例是工作流程。

用户使用Angular 5前端网页上传.csv文件（100 + MB）。（作品）
使用nodejs / express（multer）中间件将此文件上传到/ uploads / user / input文件夹。（有效）
一旦观察者识别出文件添加，Chokidar会观察/ uploads / user / input /文件夹中的任何.csv上传，它会生成child_process以执行mongoimport然后执行python脚本。（工作）
python脚本进行必要的处理并为用户创建输出文件并将其放在/ user / output文件夹中。（有效）

直到这里的一切都完美无缺。

输出文件准备就绪后我想做什么我想在上传输入文件的角度组件中显示要下载的文件链接。我该怎么做呢？所以我遇到了socket.io，这就是我到目前为止所做的。

我有一个chokidar观察器，用于输出目录中的文件模式。

const pattern11 = './api/uploads/updateusername/output/*.dat';
const watcher11 = chokidar.watch(pattern11);

一旦观察者捕获了添加的文件路径，我就会尝试发出一个事件FileReady。以下服务器代码的片段。

const express = require('express');
const bodyParser = require('body-parser');
const path = require('path');
const http = require('http');
const app = express();
var multer = require('multer');
var chokidar = require('chokidar');
const server = http.createServer(app);
var io = require('socket.io').listen(server);
const port = process.env.PORT || '3000';
app.set('port', port);

io.on('connection', function(socket){
  console.log('User connected');
});

watcher11
  .on('add', path => {
                        console.log(`File ${path} has been added`);
                        io.emit('FileReady', path);
                    });

server.listen(port, () => console.log(`Running on localhost:${port}`));

在Angular客户端，我有一个socketio服务，我希望能够从服务器上捕获套接字发送。

import { Injectable } from '@angular/core';
import * as io from 'socket.io-client';
import { Observable } from 'rxjs/Observable';
import * as Rx from 'rxjs/Rx';

@Injectable()
export class SocketioService {

  private socket;
  filepath = '';

  constructor() { }

  connect(){
    this.socket = io('http://localhost:3000');

    let observable = new Observable(observer => {
        this.socket.on('FileReady', (data) => {
          console.log("Received message from Websocket Server");
          this.filepath = data;
          observer.next(data);
        }).subscribe();
    });
  }
}

我希望当io发出'FileReady'在服务器上执行时，我的服务就可以获取数据。

在Angular组件中，我将此服务注入构造函数并调用connect（）。代码如下。

constructor(private http: HttpClient, private fileService: FileService, private socketioService: SocketioService) {
    this.files = [];
    this.uploadInput = new EventEmitter<UploadInput>();
    this.humanizeBytes = humanizeBytes;
    this.socketioService.connect();
  }

要记住一件事。

上传文件的初始帖子和可用的输出文件之间的时间跨度最长可达15分钟。在那之前，我计划在Angular中显示用户 - “文件正在处理消息”。文件可用后，我将使用文件下载链接更新组件。

有没有办法做到这一点，或者我不应该以上述方式设计解决方案。

非常感谢任何帮助。

在Node / Express后端处理文件并为用户准备好后，如何在Angular中显示要下载的文件？

0 个答案: