页面刷新后 Web 应用程序在 windows phone 中断

Question

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

之前:

之后：

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

用于 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();
}

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

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

我们最终更改了下拉列表的初始化方式。问题是由于 windows 上的缓存问题导致下拉列表初始化触发得太晚，并且在填充下拉列表内容后将其清除我们将逻辑移到 DDL 填充函数中并解决了问题，因此当它最初填充在 ajax 函数而不是

时它会清除所有三个 DDL

页面刷新后 Web 应用程序在 windows phone 中断

Web App breaks on windows phone after page refresh

javascript

ajax

jquery

web-services

windows-phone-8