Импортировать CSV-файл и отправить в бэкэнд - PullRequest
2 голосов
/ 24 апреля 2020

Я пытаюсь создать приложение с избыточным реагированием, где пользователи могут импортировать CSV-файл, который позже сохраняется в базе данных. Сейчас я работаю над внешним интерфейсом, где хочу создать код, в котором пользователь может выбрать csv-файл со своего компьютера, который он хочет загрузить, и затем файл отправляется на сервер. Поэтому я использовал csvReader для чтения csv-файла, но Я не знаю, как отправить данные на сервер . Я использую гнездо JS в бэкэнде. Я хочу отправить весь CSV-файл в одном go, но я не знаю, как решить проблему. Я новичок :))) Вы знаете, как решить мою проблему?

1 Ответ

1 голос
/ 29 апреля 2020

Я не могу помочь вам с реакцией, но, возможно, эта часть гнезда JS может вам помочь. Вы можете использовать multer для настройки вашего API и установки пути к хранилищу.

  1. Создание параметров мультиплеера

    // multer.ts
    
    const excelMimeTypes = [
       'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet',
       'application/wps-office.xlsx',
       'application/vnd.ms-excel',
    ];
    
    export const multerOptions = {
       fileFilter: (req: any, file: any, cb: any) => {
          const mimeType = excelMimeTypes.find(im => im === file.mimetype);
    
           if (mimeType) {
              cb(null, true);
           } else {
              cb(new HttpException(`Unsupported file type ${extname(file.originalname)}`, HttpStatus.BAD_REQUEST), false);
        }
    },
    storage: diskStorage({
        destination: (req: any, file: any, cb: any) => {
            const uploadPath = '/upload'; // use env var
            if (!existsSync(uploadPath)) {
                mkdirSync(uploadPath);   // create if not exists
            }
            cb(null, uploadPath);
        },
        filename: (req: any, file: any, cb: any) => {
            cb(null, file.originalname);
        },
     }),
    };
    
  2. Импортируйте недавно созданные multerOption и используйте FileInterceptor и декоратор UploadedFile для получения файла.

    @Post()
    @UseInterceptors(FileInterceptor('file', multerOptions))
    uploadFile(@UploadedFile() file) {
        console.log(file) // call service or whathever to manage uploaded file.. handleFile in the example below..
    }
    
  3. Управление файлом (пример) с использованием библиотеки xlsx .

    handleFile(file: any): Promise<any> {
        return new Promise(async (resolve: (result: any) => void, reject: (reason: any) => void): Promise<void> => {
            try {
                const workbook = XLSX.readFile(`${uploadLocation}/${file.filename}`);
                resolve(workbook.Sheets[sheetName]);
            } catch (error) {
                reject(error);
            }
        });
    }
    

Надеюсь, это поможет!

...