Question

我正在尝试从Web服务获取响应，特别是从地理服务器向传单Web地图添加两个WFS图层。第一层每次都没有问题，但大部分时间，第二层都失败了，抱怨没有定义回调函数：

ReferenceError: getJson is not defined

但对我来说非常奇怪的是，第二层将被添加，有时只是。刷新页面并再次尝试几乎总是会失败。

这是进行ajax调用的代码：

$(document).ready(function() {

...

    $("#add-network-button").on("click", function() {setLocation("Moscow")}) 

    function setLocation(locationName) {

        var networkParameters = {
            service: 'WFS',
            version: '1.0.0',
            request: 'GetFeature',
            typeName: 'netex:' + locationData[locationName].networkWFSName,
            maxFeatures: 99999,
            outputFormat: 'text/javascript',
            format_options: 'callback: getJson'
        };

        addWebService(map, WFSURL, networkParameters)

        var buildingParameters = {
            service: 'WFS',
            version: '1.0.0',
            request: 'GetFeature',
            typeName: 'netex:' + locationData[locationName].buildingWFSName,
            maxFeatures: 99999,
            outputFormat: 'text/javascript',
            format_options: 'callback: getJson'
        };

        addWebService(map, WFSURL, buildingParameters)

    }

这是addWebService函数：

var addWebService = function(map, WFSURL, WFSParameters) {

    var leafletWFSParameters = L.Util.extend(WFSParameters);

    console.log(WFSURL + L.Util.getParamString(leafletWFSParameters));

    $.ajax({
        url: WFSURL + L.Util.getParamString(leafletWFSParameters),
        dataType: 'jsonp',
        jsonpCallback: 'getJson',
        success: handleJson,
        cache: false
    });

    // TODO: add style
    function handleJson(data) {
        L.geoJson(data, {}).addTo(map);
    }
}

Answer 1

您正在使用jsonp，这意味着您回来的数据不是JSON，而是调用全局定义函数的javascript代码（该名称由{定义） {1}}）。

jQuery自动创建一个具有该名称的函数，执行网络请求，当该函数运行时，它会从全局范围中销毁自己的引用。

您已快速连续两次拨打jsonpCallback，这会触发两次jQuery addWebService()来电。第二个调用是覆盖全局定义的$.ajax({jsonpCallback: 'getJson'})回调函数。当浏览器收到第一个jsonp有效负载时，全局定义的getJson回调将被销毁。当收到第二个jsonp有效负载时，它会尝试调用全局定义的getJson函数，然后失败。一个典型的竞争条件。

让我引用jQuery's documentation for the jsonpCallback parameter on $.ajax()，empasis mine：

jsonpCallback

类型：字符串或函数（）

指定JSONP请求的回调函数名称。   将使用此值而不是随机名称   由jQuery自动生成。 最好让    jQuery生成一个唯一的名称，因为它可以更轻松地管理   请求并提供回调和错误处理。你可能想要   如果要启用更好的浏览器缓存，请指定回调   GET请求。

我建议你使用其他传输格式而不是JSONP，或者为每个请求使用不同的回调名称。

对同一URL的第二次AJAX调用失败 - 但是随机且很少工作

1 个答案: