Skip to content

Instantly share code, notes, and snippets.

@merlox

merlox/Upload.txt

Created October 23, 2019 12:22
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save merlox/203c477a6e58055c68f83d0ebd06b323 to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save merlox/203c477a6e58055c68f83d0ebd06b323 to your computer and use it in GitHub Desktop.
Download ZIP

Revisions

  1. merlox created this gist Oct 23, 2019.
    123 changes: 123 additions & 0 deletions Upload.txt
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,123 @@
    // Index.html
    <div>
    <h1>File upload</h1>
    <input type="file" multiple onChange={e => uploadFile(e)}/>
    </div>


    // Index.js
    const uploadFile = async e => {
    const files = e.target.files
    console.log('files', files)
    const form = new FormData()
    for (let i = 0; i < files.length; i++) {
    form.append('files', files[i], files[i].name)
    }
    try {
    let request = await fetch('/upload', {
    method: 'post',
    body: form,
    })
    const response = await request.json()
    console.log('Response', response)
    } catch (err) {
    alert('Error uploading the files')
    console.log('Error uploading the files', err)
    }
    }



    // Server.js
    const Formidable = require('formidable')
    const bluebird = require('bluebird')
    const fs = bluebird.promisifyAll(require('fs'))




    // Server.js
    // Returns true if successful or false otherwise
    async function checkCreateUploadsFolder (uploadsFolder) {
    try {
    await fs.statAsync(uploadsFolder)
    } catch (e) {
    if (e && e.code == 'ENOENT') {
    console.log('The uploads folder doesn\'t exist, creating a new one...')
    try {
    await fs.mkdirAsync(uploadsFolder)
    } catch (err) {
    console.log('Error creating the uploads folder 1')
    return false
    }
    } else {
    console.log('Error creating the uploads folder 2')
    return false
    }
    }
    return true
    }

    // Returns true or false depending on whether the file is an accepted type
    function checkAcceptedExtensions (file) {
    const type = file.type.split('/').pop()
    const accepted = ['jpeg', 'jpg', 'png', 'gif', 'pdf']
    if (accepted.indexOf(type) == -1) {
    return false
    }
    return true
    }

    app.post('/upload', async (req, res) => {
    let form = Formidable.IncomingForm()
    const uploadsFolder = join(__dirname, 'dist', 'uploads')
    form.multiples = true
    form.uploadDir = uploadsFolder
    form.maxFileSize = 50 * 1024 * 1024 // 50 MB
    const folderCreationResult = await checkCreateUploadsFolder(uploadsFolder)
    if (!folderCreationResult) {
    return res.json({ok: false, msg: "The uploads folder couldn't be created"})
    }
    form.parse(req, async (err, fields, files) => {
    let myUploadedFiles = []
    if (err) {
    console.log('Error parsing the incoming form')
    return res.json({ok: false, msg: 'Error passing the incoming form'})
    }
    // If we are sending only one file:
    if (!files.files.length) {
    const file = files.files
    if (!checkAcceptedExtensions(file)) {
    console.log('The received file is not a valid type')
    return res.json({ok: false, msg: 'The sent file is not a valid type'})
    }
    const fileName = encodeURIComponent(file.name.replace(/&. *;+/g, '-'))
    myUploadedFiles.push(fileName)
    try {
    await fs.renameAsync(file.path, join(uploadsFolder, fileName))
    } catch (e) {
    console.log('Error uploading the file')
    try { await fs.unlinkAsync(file.path) } catch (e) {}
    return res.json({ok: false, msg: 'Error uploading the file'})
    }
    } else {
    for(let i = 0; i < files.files.length; i++) {
    const file = files.files[i]
    if (!checkAcceptedExtensions(file)) {
    console.log('The received file is not a valid type')
    return res.json({ok: false, msg: 'The sent file is not a valid type'})
    }
    const fileName = encodeURIComponent(file.name.replace(/&. *;+/g, '-'))
    myUploadedFiles.push(fileName)
    try {
    await fs.renameAsync(file.path, join(uploadsFolder, fileName))
    } catch (e) {
    console.log('Error uploading the file')
    try { await fs.unlinkAsync(file.path) } catch (e) {}
    return res.json({ok: false, msg: 'Error uploading the file'})
    }
    }
    }
    res.json({ok: true, msg: 'Files uploaded succesfully!', files: myUploadedFiles})
    })
    })