問題描述

短版:正在尋找等待異步 XHR 請求的方法或讓同步 XHR 在 Safari 中工作的方法.

Short version: Looking for a method to wait for an Asynch XHR request or a way to get Synch XHR working in Safari.

更長的版本:我正在開發一個使用混合在一起的各種外部數據源的 Web 服務.我正在使用 Javacript 前端，它可以對我的 PHP 服務器代碼進行 AJAX/XHR 調用.不存在跨站點問題，因為客戶端只向我的服務器請求數據(服務器發出外部數據請求).

Much longer version: I'm working on a web service that uses various external data sources mashed together. I am using a Javacript front-end which makes AJAX/XHR calls to my PHP server code. There's no cross-site issues as the client only requests data from my server (the server makes the external data requests).

我正在使用同步 XHR 請求，因為在數據顯示在屏幕上之前，我需要對數據進行一些加載后處理(排序、過濾等).

I'm using a synchronous XHR request as I have some post-load processing (sorting, filtering, etc) to do on the data before it is presented on screen.

這在 IE、FF 和 Opera 上都可以正常工作，但對 Safari 來說似乎是個問題(我還沒有嘗試過 Chrome).

This all works fine on IE, FF and Opera, but seems to be a problem to Safari (I haven't tried Chrome yet).

在我的 Windows 機器上使用 Firebug for Safari，我可以看到服務器調用 beng，然后在 10 秒以上的時間后失敗.在我的 iPad 上，消息稍微好一些，因為它說:NETWORK_ERR: XMLHttpRequest Exception 101: A network error occurred in synchronous mode.

Using Firebug for Safari on my Windows machine I can see the server calling beng made and then it fails after a time above 10 seconds. On my iPad the message is slightly beter as it says: NETWORK_ERR: XMLHttpRequest Exception 101: A network error occurred in synchronous mode.

一些研究表明 Safari 會在同步模式下 10 秒后超時.似乎有一個超時功能，您可以使用該超時功能來擴展它(Safari 的最大限制為 60 秒).不幸的是，我無法讓它工作.

A bit of research indicates that Safari will timeout after 10 seconds in synch mode. There appears to be a timeout function which timeout function you can use to extend this (with a max limit for Safari of 60 seconds). Unfortunately I can't get this to work.

我現在想知道人們會建議通過更改客戶端 Javacript 代碼來解決此問題的最佳方法.

I'm now wondering what people would suggest as the best way of working around this through changes to the client Javacript code.

我正在考慮的兩個選項是 (i) 找到 Safari 瀏覽器將遵守的同步 XHR 超時的工作示例；或 (ii) 對異步 XHR 調用進行某種包裝，以便加載后處理首先等待加載.

The two options I'm thinking are (i) find a working example of a synch XHR timeout that Safari browsers will honour; or (ii) having some sort of wrapper around an asynch XHR call so that the post-load processing waits for the load first.

我不是一個特別有經驗的 Javascript 黑客，但我已經在這個項目上設置了相當數量.我沒有使用過 JQuery 或任何其他框架，我更愿意使用原始 JS，以避免學習額外的語法.[您可能從我之前的帖子中看到，我過去曾嘗試使用 JQM 和 Spry，但事實證明兩者都是錯誤的選擇，至少在現階段已經被放棄了].

I'm not a particulalry experienced Javascript hacker, but I have setup a fair amount on this project. I haven't used JQuery or any other frameworks and would prefer to keep with raw JS just to avoid having to learn the additional syntax. [You may see from my previous posts I tried using JQM and Spry in the past, but both proved to be the wrong choices, at least at this stage and have since been ditched for now].

我覺得回調可能是正確的等待異步選項，但我不確定它是如何工作的，或者你將如何編碼.

I get the feeling a callback may be the right wait-for-asych option, but I'm not sure how this works or how you would code it.

這只是現階段的原型，因此可以接受骯臟的黑客攻擊.一旦我證明了功能，就已經準備好完全重寫.

This is just a prototype at this stage, so dirty hacks are acceptable. A full re-write is already on the cards for later on once I have proven functionality.

感謝人們對此的想法和建議.

Appreciate peoples thoughts and advice on this.

問候，皮特.

推薦答案

通常，您會希望堅持使用異步請求，因為它們是非阻塞的.有了它們，您將需要使用回調 - 或者簡單地說，是一個設置為稍后調用的函數.

Generally, you'll want to stick to asynchronous requests, as they're non-blocking. And with them, you'll want to use a callback -- or, simply, a function that is setup to be called later.

您可以使用 onreadystatechange 屬性設置回調XMLHttpRequest:

You can set the callback with the onreadystatechange property of an XMLHttpRequest:

xhr.onreadystatechange = function () {
    if (xhr.readyState === 4) {   // DONE
        if (xhr.status === 200) { // OK
            handleSuccess(xhr);
        } else {
            handleError(xhr);
        }
    }
};

正如屬性名所暗示的，它會在readyState的值改變時被調用，其中4的值表示請求已經完成(成功與否).

As the property name suggests, it will be called as the value of readyState changes, where a value of 4 means the request has completed (successful or not).

然后您將在另一個函數中處理排序、過濾等 - 在本例中為 handleSuccess.

You'd then handle your sorting, filtering, etc. within another function -- in this example, handleSuccess.

您還可以從使用許多現有庫中的任何一個中受益——例如，jQuery(為此需要 1.6 或更高版本片段):

You can also benefit from using any of a number of existing libraries -- e.g., jQuery (1.6 or later for this snippet):

$.get('/web/service/request')
    .done(function (result) {
        // sorting, filtering, etc
    })
    .fail(function (xhr) {
        // error notification, etc.
    });

這篇關于Javascript 同步 XMLHttpRequest 的替代方案(在 Safari 中超時)的文章就介紹到這了，希望我們推薦的答案對大家有所幫助，也希望大家多多支持html5模板網！