How to organize the reception and transmission of a file using Express/XMLHttpRequest?

Z

ZoxWatt2016-09-30 12:18:23

JavaScript

ZoxWatt, 2016-09-30 12:18:23

It is necessary to implement the following thing: the user on the client (browser) sends some data to the server (Node.js) via a textarea via a POST request, the server processes them, creates a file with a certain log (text file), which the user can then download. The data is transferred, the file is created, but I cannot organize the process of downloading the file.
server.js:

var fs = require("fs");
var express = require("express");
var bodyParser = require("body-parser");
var app = express();

app.use(bodyParser.urlencoded({ extended: false }));
app.use(bodyParser.json());

app.get('/',function(req,res){
  res.sendfile("index.html");
});
app.post('/url',function(req,res){
  var inputdata=req.body.input;
  console.log("inputdata = "+inputdata+", outputdata = "+test(inputdata));
  res.send(test(inputdata));
    createFile(inputdata);
});

app.listen(3000,function(){
  console.log("Started on PORT 3000");
})

function test(s){
  return s.charAt(0);
}

function createFile(s){
    fs.writeFile("test.txt",test(s),function(err){
        if (err)
            throw err;
        console.log("The file was created.");
    });
}

index.html:

<!DOCTYPE HTML>
<html>

<head>
  <meta charset="utf-8">
  <script src="js/jquery-3.1.0.min.js" type="text/javascript"></script>
  <script src="js/bootstrap.min.js" type="text/javascript"></script>
</head>

<body>
  <form id="testForm">
    <textarea class="input" cols="20" id="input" name="input" rows="2"></textarea>
    <textarea class="output" cols="20" id="output" name="output" rows="2"></textarea>
    <button onclick="send()" id="button">Send</button>
  </form>
  <script>
        function send(){
            var form = document.getElementById('testForm');
            form.onsubmit = function (e) {
                e.preventDefault();
                var data = {};
                for (var i = 0, ii = form.length; i < ii; ++i) {
                    var input = form[i];
                    if (input.name=="input") {
                        data[input.name] = input.value;
                    }
                }
                var xhr = new XMLHttpRequest();
                xhr.open('POST', 'url', true);
                xhr.setRequestHeader('Content-Type', 'application/json; charset=UTF-8');
                xhr.onreadystatechange = function() {
                    if (xhr.readyState != 4) return;
                    if (xhr.status != 200) {
                        alert(xhr.status + ': ' + xhr.statusText);
                    } else {
                        console.log(xhr.response);
                        document.getElementById('output').value=xhr.responseText;
                    }
                }
                xhr.send(JSON.stringify(data));
            }
        }
  </script>

</body>

</html>

Reply

Answer the question

In order to leave comments, you need to log in

1 answer(s)

S

Sergey, 2016-10-03
@void01

answered a similar question here
Why ajax is not processed?
to download the file just add the correct Content-type