Angular 6 HttpClient – Upload Files/Download Files to MySQL with Node.js/Express RestAPIs

Angular 6 HttpClient – Upload Files/Download Files to MySQL with Node.js/Express RestAPIs – using Multer + Sequelize ORM

https://grokonez.com/frontend/angular/angular-6/angular-6-httpclient-upload-files-download-files-to-mysql-with-node-js-express-restapis-using-multer-sequelize-orm

In the tutorial, we show how to upload files, download files from Angular 6 Client to MySQL with Node.js RestAPIs server using Multer middleware and Sequelize ORM.

Related posts:

• Node.js/Express RestAPIs server – Angular 6 Upload/Download Files – Multer + Bootstrap
• Angular 6 HttpClient Crud + Node.js Express Sequelize + MySQL – Get/Post/Put/Delete RestAPIs

Technologies

• Angular 6
• RxJS 6
• Bootstrap 4
• Visual Studio Code – version 1.24.0
• Nodejs – v8.11.3
• Multer
• Sequelize
• MySQL

Overview

We create 2 projects: {Node.js, Angular}

Node.js RestAPIs

Project structure ->

– Node.js project exposes RestAPIs to upload/download files:

• router.post('/api/file/upload', upload.single("file"), fileWorker.uploadFile);
• router.get('/api/file/all', fileWorker.listAllFiles);
• router.get('/api/file/:id', fileWorker.downloadFile);

Configure cross-origin for Angular-Client which running at port: 4200.

const cors = require('cors')
const corsOptions = {
  origin: 'http://localhost:4200',
  optionsSuccessStatus: 200
}
app.use(cors(corsOptions))

Upload File ->

https://grokonez.com/frontend/angular/angular-6/angular-6-httpclient-upload-files-download-files-to-mysql-with-node-js-express-restapis-using-multer-sequelize-orm