lundi 19 octobre 2020

File Readline from uploaded file on website in javascript

I am newbie to learn javascript!

I am trying to do a uploading file and read the file in app.js

What I mean is that I created html and main.js to upload file and bring the file to read.

It is a bit hard to explain for me, so let me put the code first.

Here is my html file.

My main concern in below codes, when I uploaded file, the error said "Error: ENOENT: no such file or directory, open 'C:\fakepath\numbers.txt'"

What I want to do,

  1. Upload txt file on website
  2. Bring the file that is uploaded in app.js
  3. Readline the text file.

I finished to upload file, but I have no idea how to read the file to do some works.

Thank you for reading a quite long paragraph.

<html lang= 'KOR'>
<head>
    <meta charset = 'UTF-8'>
    <meta name = 'viewport' content = "width=device-width, initial-scale=1.0">
    <meta http-equiv='X-UA-Compatible' content = "ie=edge">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/skeleton/2.0.4/skeleton.css" integrity="sha512-5fsy+3xG8N/1PV5MIJz9ZsWpkltijBI48gBzQ/Z2eVATePGHOkMIn+xTDHIfTZFVb9GMpflF2wOWItqxAP2oLQ==" crossorigin="anonymous" />
    <title>Node SMS Texting</title>
</head>
<body>
    <div class="container">
        <h2>Send SMS Message</h2>
        <p>Upload phone number file and text below</p>
        <div>
            <input type="file" id="file" accept=".txt,.csv" name="filename">
            <input type="text" name="msg" id="msg" placeholder='Enter Text Message...'>
            <input type="button" id='button' value='Send Message' class ="button button-primary">
            <p class ='response'></p>
        </div>

        <script src="/socket.io/socket.io.js"></script>
        <script src="js/main.js"></script>

            
        
    </div>
    
</body>


</html>

my main.js

//const fileInput = document.getElementById('file');
const fileInput = document.getElementById('file');
const textInput = document.getElementById('msg');
const button = document.getElementById('button');
const response = document.querySelector('.response');



button.addEventListener('click', send, false);

function send(){
    const file = fileInput.value;
    const text = textInput.value;
    
    fetch('/', {
        method: 'post',
        headers: {
            'Content-type': 'application/json'
        },

        body: JSON.stringify({file: file, text: text})
    })
    .then(function(res){
        console.log(res);
    })
    .catch(function(err){
        console.log(err);

    })
}

my app.js

const express = require('express');
const multer = require('multer');
const bodyParser = require('body-parser');
const ejs = require('ejs');
const Nexmo = require('nexmo');
const socketio = require('socket.io');
const smpp = require('smpp');
const { contains } = require('cheerio');
const session = smpp.connect('api.rmlconnect.net', 2350);
const fs = require('fs');
const readline = require('readline');
const stream = require('stream');



const app = express();

//Template engine setup
app.set('view engine', 'html');
app.engine('html', ejs.renderFile);

// public folder setup
app.use(express.static(__dirname + '/public'));

//body parser middleware
app.use(bodyParser.json());
app.unsubscribe(bodyParser.urlencoded({extended: true}));

//Index route

app.get('/', (req, res) => {
    res.render('index');
})

// Catch form submit
app.post('/', (req, res) => {
    res.send(req.body);
    const file = req.body.file;
    let instream = fs.createReadStream(file);
    const outstream = new stream;
    const rl = readline.createInterface(instream, outstream);
    console.log(req.body.file);
    const arr = [];

    rl.on('line', function(line) {
    // process line here
        arr.push(line);
        console.log(line);
        console.log(typeof line);
});
    
});

//Define port
const port = 3000;

//Start server
const server = app.listen(port, () => console.log(`Server started on port ${port}`));

Aucun commentaire:

Enregistrer un commentaire