這項技術非常類似動態腳本注入. 使用JavaScript建立一個新的Image物件, 並把src屬性設定為伺服器上的腳本URL. 該URL包含了我們要透過GET傳回的鍵值對資料. 請注意並沒有創建img元素或把它插入DOM.
var url = '/status_tracker.php';var params = [ 'step=2', 'time=1248027314' ] (new Image()).src = url + '?' + params.join('&');
伺服器會接收到資料並保存下來, 它無需向客戶端發送任何回饋訊息, 因此沒有圖片會實際顯示出來. 這是給伺服器回饋訊息最有效的方式. 它的效能消耗很小, 並且服務端的錯誤完全不會影響到客戶端.
圖片信標很簡單, 但也意味著它能做的事情是有限的. 你無法發送POST數據, 而URL的長度有最大值, 所以你可以發送的數據的長度被限制得相當小. 你可以接收服務器傳回的資料, 但只限於非常少的幾種方式. 一種方式是監聽Image
物件的load
事件, 它會告訴你伺服器是否成功接收資料. 你還可以檢查伺服器返回的圖片的寬度和高度(如果是圖片的話)並使用這些數字通知你伺服器的狀態. 舉個例子, 寬度為1表示”成功”, 為2表示”重試”.
如果你不需要在回應中回傳資料, 就應該發送一個不帶訊息正文的204 No Content狀態碼, 它將阻止客戶端繼續等待永遠不會到來的訊息正文.
var url = '/status_tracker.php';var params = [ 'step=2', 'time=1248027314' ] var beacon = new Image(); beacon.src = url + '?' + params.join('&'); beacon.onload = function( ) { if (this.width == 1) { //成功 } else if (this.width == 2) { //失败 } } beacon.onerror = function() { //出错 }
以上是JavaScript---Beacons圖片信標發送數據的詳細內容。更多資訊請關注PHP中文網其他相關文章!