Question

我正在尝试在JS中创建一个“模拟API”模块，因此我想通过类似products.json的网址从源（myapi.com/get/products）请求数据。它不一定是合法的API。

我使用http://www.jsontest.com中的示例JSON对象进行此操作 - 但我不确定如何使用我自己的外部数据执行此操作products.json

我的功能：

var displayProductList = (function() {
    var productList = {
        init: function(uri) {
            this.getData(uri);
        },
        getData: function(uri) {
            $.ajax({
                context: this,
                dataType: 'json',
                url: uri,
                success: this.runOutput
            });
        },
        runOutput: function(data) {
            ...
        }
    }
    productList.init('http://echo.jsontest.com/key/value/one/two');
})();

这样可行（我不能从JSFiddle运行它，因为它不是https，但它应该有用）：https://jsfiddle.net/xou1k8y8/1/

所以我的问题是，如何将代码中的URL替换为我的目录get/products.json的路径，并能够访问其中的数据？

例如：

productList.init('localhost/my-project/get/products.json');

执行上述操作无效。我还尝试添加/products，以便我可以访问下面的products JSON数据。

我的JSON看起来像这样：

{"products":[
    {
        "id":"0001",
        "title":"The Jungle Book",
        "price":"13.60",
        "currency":"GBP",
        "isbn":"978-0062389503",
        "stock":{
            "in-stock":"yes",
            "stock-quantity":"98"
        }
    }
};

Answer 1

您的localhost网址不正确。您需要将//放在URL中的主机名之前，否则将其视为目录名。

productList.init('//localhost/my-project/get/products.json');

请注意，由于AJAX同域限制，您只能在从http://localhost加载HTML文件时执行此操作。

Answer 2

只需切换文件路径的URL：

    getData: function(uri) {
        $.ajax({
            context: this,
            dataType: 'json',
            url: 'get/products.json',
            success: this.runOutput
        });
    },

简单就像c：

使用AJAX

2 个答案: