JavaScript---Beacons图片信标发送数据

一个新手
Lepaskan: 2017-09-09 10:33:24
asal
1649 orang telah melayarinya


简介

这项技术非常类似动态脚本注入. 使用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('&');
Salin selepas log masuk

服务器会接收到数据并保存下来, 它无需向客户端发送任何回馈消息, 因此没有图片会实际显示出来. 这是给服务器回传信息最有效的方式. 它的性能消耗很小, 并且服务端的错误完全不会影响到客户端.

图片信标很简单, 但也意味着它能做的事情是有限的. 你无法发送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() {
    //出错
}
Salin selepas log masuk

Atas ialah kandungan terperinci JavaScript---Beacons图片信标发送数据 . Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Label berkaitan:
sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan