Question

我目前正在开发一个从Web服务中提取元数据的Web应用程序。它目前适用于所有浏览器，但我们在Internet Explorer的Windows Phone上遇到这个奇怪的问题。如果您有一个清除缓存（第一次加载），它可以解决问题，但是一旦您刷新页面或导航并返回页面，下拉列表将无法显示从Web服务返回的数据

之前：

Before 1 Before 2 Before 3

后：

After 1

我们正在使用标准的jQuery $ .ajax调用本地Web服务似乎在后面的情况下，成功回调被解雇但是下拉列表没有被呈现，并且这仅在页面从干净缓存状态成功加载一次并且在所有其他移动浏览器中正常工作之后发生

用于Web服务的jquery代码

function getAllPublications() {
    $('.error').addClass('dn');
    $('#selectYear').prop('disabled', 'disabled');
    $('#selectVehicle').prop('disabled', 'disabled');
    $('#selectManual').prop('disabled', 'disabled');
    $('.manual-section').hide();
    $.ajax({
        url: "/_Global/HttpHandlers/OwnersManuals/GetPublications.ashx",
        dataType: "json",
        type: "GET",
        success: function (data) {
            $('.manuals-loader').hide();
            if (data.getPublicationYearModelDataResult.ErrorCode == 0) {
                allResults = data.getPublicationYearModelDataResult;
                extractUniqueYears(allResults);
                populateYearsDropdown();

            } else {
                $('.error.no-publication-error').removeClass('dn');
            }
            debugLog(JSON.stringify(data));

        },
        error: function (error) {
            $('.manuals-loader').hide();
            $('.error.api-error').removeClass('dn');
            console.log(error);

        }
    });
}

    function populateYearsDropdown() {
        $('#selectYear')
            .empty()
            .append($("<option />").val('-').html(__pleaseSelect))
            .removeAttr('disabled');

        $.each(years, function (val, text) {
            $('#selectYear').append($("<option />").val(text).html(text));
        });

    }
function extractUniqueYears(result) {
    years = [];
    if (result.PublicationYearModels != null) {
        $(result.PublicationYearModels).each(function (i, item) {
            if (item.YearModels != null) {
                $(item.YearModels).each(function (j, subItem) {
                    var year = subItem.year;
                    if (!checkIfYearExists(year))
                        years[years.length] = year;
                });
            }
        });
    }
    years.sort();
    years.reverse();
}

注意：我已尝试向页面添加缓存和缓存过期标头，并尝试在页面上使用缓存过期元标记，但没有效果

Answer 1

您应该能够欺骗浏览器认为您是第一次使用Location.reload(forcedReload)访问该网页。这是一个使用cookie来阻止您陷入无限刷新循环的示例：

var ie_mobile_reload = false, FORCED_RELOAD = true;

if /refresh=true/.test(document.cookie) {
  document.cookie = 'refresh=;'; /* Remove the refresh cookie */
  ie_mobile_reload = true;
  location.reload(FORCED_RELOAD);
}

/* IE Mobile only */
if /IEMobile/.test(navigator.userAgent) {
  window.onbeforeunload = function() {
    if (ie_mobile_reload) {
      document.cookie = 'refresh=true'; /* Set the refresh cookie */
    }
  };
}

我设置FORCED_RELOAD = true以跳过缓存并导致页面直接从服务器重新加载。

Answer 2

我们最终改变了下拉列表的初始化方式。问题是下拉列表init由于Windows上的缓存问题而触发太晚，并在填充后删除了下拉列表内容我们将逻辑移动到DDL填充函数中并修复了问题，以便在最初填充在ajax函数中时清除所有三个DDL

页面刷新后，Web应用程序在Windows Phone上中断

2 个答案: