> 웹 프론트엔드 > JS 튜토리얼 > JavaScript---비콘 이미지 비콘은 데이터를 보냅니다.

JavaScript---비콘 이미지 비콘은 데이터를 보냅니다.

一个新手
풀어 주다: 2017-09-09 10:33:24
원래의
1674명이 탐색했습니다.


소개

이 기술은 JavaScript를 사용하여 새 이미지 객체를 생성하고 src 속성을 서버의 스크립트 URL로 설정하는 것과 매우 유사합니다. 이 URL에는 우리가 반환하려는 키 값이 포함되어 있습니다. 데이터를 가져오세요. 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를 보내야 합니다. 메시지 본문이 없으면 클라이언트가 메시지 텍스트를 계속 기다리지 않게 됩니다.

Example

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---비콘 이미지 비콘은 데이터를 보냅니다.의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿