Implementing ftp using Javascript

Question

I dont understand why cant javascript make ftp calls?. Why do we have to make such a request using server?

Even Browsers have ability to authenticate and browse a ft

Answer 1

There is a JavaScript library at http://ftp.apixml.net/ that allows FTP file uploads via JavaScript.

In this case, technically, the ftpjs server is making the FTP connection to the FTP server, but the instructions are being passed via JavaScript. So this particular library is designed primarily to allow developers add a basic file upload mechanism without writing sever-side code.

Under the hood, it uses the HTML5 FileReader to read the file to a base64 string, and then posts this using CORS AJAX back to the server.

// Script from http://ftp.apixml.net/
// Copyright 2017 http://ftp.apixml.net/, DO NOT REMOVE THIS COPYRIGHT NOTICE
var Ftp = {
    createCORSRequest: function (method, url) {
        var xhr = new XMLHttpRequest();
        if ("withCredentials" in xhr) {
            // Check if the XMLHttpRequest object has a "withCredentials" property.
            // "withCredentials" only exists on XMLHTTPRequest2 objects.
            xhr.open(method, url, true);
        } else if (typeof XDomainRequest != "undefined") {
            // Otherwise, check if XDomainRequest.
            // XDomainRequest only exists in IE, and is IE's way of making CORS requests.
            xhr = new XDomainRequest();
            xhr.open(method, url);
        } else {
            // Otherwise, CORS is not supported by the browser.
            xhr = null;
        }
        return xhr;
    },
    upload: function(token, files) {
        var file = files[0];
        var reader = new FileReader();
        reader.readAsDataURL(file);
        reader.addEventListener("load",
            function() {
                var base64 = this.result;               
                var xhr = Ftp.createCORSRequest('POST', "http://ftp.apixml.net/upload.aspx");
                if (!xhr) {
                    throw new Error('CORS not supported');
                }
                xhr.onreadystatechange = function() {
                    if (xhr.readyState == 4 && xhr.status == 200) {
                        Ftp.callback(file);
                    }
                };
                xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
                xhr.send("token=" + token + "&data=" + encodeURIComponent(base64) + "&file=" + file.name);
            },
            false);
    },
    callback: function(){}
};