How can I make AJAX work for me?

Question

I make APIs all the time and I'm working on one called Swerer. Swerer is an easy and efficient way to use AJAX. Now the problem is when I use Swerer.getFile("file.txt") it returns undefined instead of the content. Any help would be appreciated.

 /*
        Complex.js 1.0.0
        Dec 14, 2017
    */

    (function(){

    if(!document){
            throw new Error("Complex.js needs a window with a document");
        }
    })();

    var toString = Object.prototype.toString;
    // Make X
    X = function(){

    };
    X.extend = function(){
        var target = arguments[0], obj, arg = arguments;
        for (var i = 0; i < arg.length; i++) {
            if(toString.call(arg[i]) == "[object Boolean]"){
                if(arg[i] !== false){
                    if(!target){
                        obj = [];
                    }else{
                        for(i in target){
                            target[i] = obj[i];
                        }
                    }
                }else{
                    obj = [];
                }
            }
        }
        return obj;
    };
    // Make constructors
    X.extend({
        // We are going to make something called Swerer
        Swerer: function(){
            X.call(this);
        },
        isFunction: function(obj){
            if(toString.call(obj) == "[object Function]"){
                return true;
            }
        },
    });
    var Swerer = X.Swerer;
    Swerer = {};
    // Note:
    // When we are refering to Swerer in a Swerer function we can use the keyword 'this'
    /*

        Swerer.get("file.type", function(){
            func(arg);
        });

    */
    // Xhr (XML Http Request) is built into Swerer
    (XMLHttpRequest) ? Swerer.xhr = new XMLHttpRequest() : Swerer.xhr = new ActiveXObject("Microsoft.XMLHTTP");
    Swerer.getFile = function(file){
        var xhttp = this.xhr, content;
        if(this.readyState == 4 && this.status == 200){
            content = this.responseText;
        }
        xhttp.open("GET", file, true);
        xhttp.send();
        return content;
    };

If you see any problems post a jsfiddle and I'll try to fix it. Thank you!

does the request get made? What's the response? Have you checked your console and network tabs in your browser tools to see what actually happened? — ADyson, Dec 16 '17 at 14:15
`content` is not set when you want to `return` it. You need to work with the `onreadystatechange` event for that. — rolfv1, Dec 16 '17 at 14:16
It says "Failed to load file:///home/judah/Desktop/file.txt: Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https." What does that mean and how do I fix it? — , Dec 16 '17 at 14:21
[cross origin and file://](https://stackoverflow.com/questions/10752055/cross-origin-requests-are-only-supported-for-http-error-when-loading-a-local) — James, Dec 16 '17 at 15:04

score 0 · Accepted Answer · answered Dec 16 '17 at 14:20

0

I must admit that I only focus on the XHR part of the code, but that should look something like this:

// Xhr (XML Http Request) is built into Swerer
(XMLHttpRequest) ? Swerer.xhr = new XMLHttpRequest() : Swerer.xhr = new ActiveXObject("Microsoft.XMLHTTP");
Swerer.getFile = function(file){
    var xhttp = this.xhr;
    xhttp.onreadystatechange = function() {
        if (this.readyState == 4 && this.status == 200) {
           return xhttp.responseText;
        }
    };
    xhttp.open("GET", file, true);
    xhttp.send();
};

answered Dec 16 '17 at 14:20

rolfv1

571
3
14

Thanks, but it's not really working for me. It gives me the same error I had before. "Failed to load file:///home/judah/Desktop/file.txt: Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https." – Dec 16 '17 at 14:26
Maybe, it's because we are not calling `xhttp.onreadystatechange` – Dec 16 '17 at 14:28
returning xhttp.responseText to the mechanism that invokes the onreadystatechange callback doesn’t mean that Swerer.getFile will or even could return that data. – James Dec 16 '17 at 15:07
1

@Judahrogan, but that is never going to work and that has nothing to do with using the `onreadystatechange` in whatever way. You are just not allowed to load/open a file that is not running on the same "server". So you should use relative paths for that, so make sure that file.txt is in the same folder as the file containing this Javascript code. – rolfv1 Dec 16 '17 at 15:37

How can I make AJAX work for me?

1 Answers1