Vaxo Basilidze
Vaxo Basilidze

Reputation: 1057

Can I write to file using XMLHttpRequest

I'm using XMLHttpRequest to read the file.

Can I write to file using XMLHttpRequest or any other javascript method and how do I do that?

Currently in my application I'm using PHP for this purpose, but I need not to use it.

function readTextFile(path, callback) {
  return new Promise(function(resolve, reject) {
    var xhr = new XMLHttpRequest();
    xhr.onreadystatechange = function() {
      if (xhr.readyState == 4) {
        if (xhr.status == 200) {
          resolve(xhr.responseXML);
        } else {
          reject(xhr);
        }
      }
    };
    xhr.open("GET", path);
    xhr.send();
  });
}
$(document).ready(function() {
  readTextFile("device.xml")
    .then(function(fileData) {
      // Use the file data
    })
    .catch(function(xhr) {
      // The call failed, look at `xhr` for details
    });
});

Upvotes: 2

Views: 7895

Answers (5)

Millow
Millow

Reputation: 11

Hi, if you want to use just js and to write a file using it, it is possible, but you need a server code (made in Node.Js). So here is the code:

Server [main.js]

var http = require('http');
var util = require('util');
var querystring = require('querystring');
var fs = require('fs');
var filename = 'your_file.txt';
var port = '80';



var server = http.createServer(function(req, res) {
    res.writeHead(200, {
        'Content-Type': 'text/html'
    });
    if (req.method == 'GET') {
        res.write(fs.readFileSync('index.html', 'utf8'));
        res.end();
    } else {

        var chunk = '';
        req.on('data', function(data) {
            chunk += data;
        });
        req.on('end', function() {
            console.log(chunk);
            fs.readFile(filename, 'utf-8', function(err, data) {

                if (!err) {
                    fs.writeFile(filename, data + '\n' + chunk, (err) => {
                        if (err) {
                            throw err;
                        }
                    });
                } else {
                    throw err;
                }
            });
            //any function to perform on clint side webpage.
            res.end();
        });

    }
}).listen(port);
console.log('Successfully started serving at : ' + port);

Client WebPage [index.html]

<!DOCTYPE html>
<html>
<body>

<button onclick="check()">Send!</button>
<input type="text" placeholder="enter some message here">

<script>
function check() {
  var xhttp;
  if (window.XMLHttpRequest) {
    // code for modern browsers
    xhttp = new XMLHttpRequest();
  } else {
    // code for IE6, IE5
    xhttp = new ActiveXObject("Microsoft.XMLHTTP");
  }
  xhttp.open("post", "#", true);
  xhttp.send(document.querySelector('input').value);
}
</script>

</body>
</html>

  • All the files are uploaded.
  • Note: Please make it sure that your folder already has the file to be written.
  • Usage: node main.js.

Upvotes: 1

lejahmie
lejahmie

Reputation: 18253

JavaScript in a Browser can't write to files. At least not in any useful way, or cross platform. Chrome has a filesystem api in the browser but it is not officially supported, nor will it ever be.

https://www.html5rocks.com/en/tutorials/file/filesystem/

XMLHttpRequest is read-only so to say. It is as it's name suggests, it makes a request.

You could however make a XMLHttpRequest to a backend server running PHP or NodeJs that could write to a file.

If you do not like PHP and prefer JavaScript, then NodeJs is nice.

NodeJS example:

fs.writeFile('message.txt', 'Hello Node.js', (err) => {
  if (err) throw err;
  console.log('The file has been saved!');
});

https://nodejs.org/docs/latest/api/fs.html

Upvotes: 2

Charlie
Charlie

Reputation: 23768

When you use a simple HTTP method like plain GET against a web server, the server would give you the file - no problem there.

Now when you want to write data to the server, you have to tell the server that you would like to write some data to the file system. You will have to create an application in the web server using PHP, NodeJs etc to handle such a request and write data as a file into the file system.

There are no alternatives to this method as long as your server use standard HTTP for communication.

Upvotes: 1

NoOorZ24
NoOorZ24

Reputation: 3222

Can I write to file using XMLHttpRequest or any other javascript method and how do I do that?

No you can not! JavaScript is client-side programming language, that means it can't edit files on other computer or server.

You need server and server-side programming language like PHP or any other because it's really server writing in files not you - you just ask it to do so with requests.

Upvotes: 1

Quentin
Quentin

Reputation: 943108

You can make HTTP requests with XMLHttpRequest.

If you want to write to a file, then the server needs to be set up to recognise that some kinds of request should result in data being written to a file.

This normally requires the use of a server-side programming language, such as PHP (which you've rejected).

You could also look at WebDav, for which there is at least one JavaScript library which wraps XMLHttpRequest.

Upvotes: 1

Related Questions