서버에 대한 이벤트

코어 포인트

Server Send Events (SSE)는 스트림을 사용하여 데이터 및/또는 DOM 이벤트를 서버에서 클라이언트로 푸시하는 방법이며, 스포츠 점수 또는 주식 견적과 같은 데이터를 정기적으로 업데이트 해야하는 상황에 이상적입니다.

이벤트 소스 개체 생성을 사용하면 이벤트 스트림을 구독하고 열기, 메시지 및 오류 이벤트를 처리 할 수 ​​있습니다.

서버에서 이벤트를 보내려면 헤더 (value ) 및 UTF-8 문자 인코딩을 사용하여 컨텐츠를 제공해야합니다. 서버가 이벤트를 보내기위한 구문에는 데이터, 이벤트 유형, 이벤트 식별자 및 재시도 간격이 포함됩니다. 이벤트 처리는 함수 (메시지 이벤트를 보내는 응용 프로그램에 대해서만)를 사용할 수 있지만 메소드는 사용자 정의 이벤트를 처리 할 수 ​​있습니다.
• 대부분의 최신 브라우저 (Chrome, Firefox 및 Safari 포함)는 서버 전송 이벤트 (SSE)를 지원하지만 Internet Explorer는 그렇지 않습니다. 모든 브라우저를 지원 해야하는 응용 프로그램의 경우 Websocket 또는 긴 폴링이 더 적절할 수 있습니다.
• Content-type text/event-stream 소개 스트림 구독 : EventSource Object
서버에서 이벤트를 보냅니다 메시지 이벤트 보내기 사용자 정의 이벤트 보내기 Retry Interval Management를 사용하여 다시 연결하십시오 id 필드 를 사용하여 고유 식별자를 설정하십시오 onmessage addEventListener 처리 이벤트 처리 오류 브라우저 구현 차이 브라우저 지원 및 폴백 전략 귀하의 국가 농구 팀이 세계 농구 선수권 대회에 참여하고 있다고 가정합니다. 게임 시간이 근무 시간과 충돌하기 때문에 게임을 따르고 싶지만 볼 수는 없습니다.
• 운 좋게도, 당신의 National News Service에는 매우 뛰어난 웹 개발 팀이 있습니다. 그들은 파울이나 점수가 발생할 때마다 업데이트되는 스포츠 정보 스크롤 디스플레이를 구축했습니다. URL을 방문하면 업데이트가 브라우저로 직접 푸시됩니다. 물론, 그들이 어떻게했는지 알고 싶을 것입니다. 대답은 : 서버가 이벤트를 보냅니다.
서버 보내기 이벤트는 스트림을 사용하여 데이터 및/또는 DOM 이벤트를 서버에서 클라이언트로 푸시하는 방법입니다. 재고 따옴표, 스포츠 점수, 비행 추적, 이메일 알림 - 데이터를 정기적으로 업데이트 해야하는 상황에 적합합니다.

기다려! 나는 당신이 말하는 것을 들었습니다.
1. 우리는 이미 xmlhttprequest 또는 websockets를 사용하여 이것을 할 수 없습니까? <.> 예, 예. 그러나이를 수행하려면 EventSource 자체의 기능을 구현하기 위해 이러한 객체를 확장해야합니다.
서버 측의 예방 조치 서버가 이벤트를 보내기 때문에 데이터 스트림이므로 장기 연결이 필요합니다. 많은 동시 연결을 처리 할 수있는 서버를 사용해야합니다. 물론 이벤트 중심의 서버는 특히 스트리밍 이벤트에 적합합니다. 여기에는 node.js, juggernaut 및 twisted가 포함됩니다. Nginx의 경우 Nginx-Push-Stream-Module 모듈을 사용할 수 있습니다. 그러나 서버 구성은이 기사의 범위를 벗어나고 사용중인 서버에 따라 다릅니다.
2. EventsOURCE 객체를 사용하여 스트림을 구독하는 방법을 살펴 보겠습니다. 그런 다음 이벤트가 전송되고 처리되는 방법을 볼 것입니다.

   이벤트 스트림 구독 : EventSource Object 이벤트 소스 객체를 만드는 것은 간단합니다.

   eventSource 생성자는 최대 두 개의 매개 변수를 수락합니다 :

   URL 문자열 (필수) 및 옵션 사전 매개 변수 속성의 값을 정의하는 데 사용됩니다.

   var evtsrc = new EventSource('./url_of/event_stream/',{withCredentials:false});

   사전은 객체와 구문 적으로 유사하지만 실제로는 이름 값 쌍이 정의 된 데이터 배열입니다. 이 경우 <<>는 가능한 유일한 사전 멤버입니다. 그 값은 참 또는 거짓일 수 있습니다. (사전에 대한 자세한 내용은 웹 IDL 사양을 참조하십시오.)

   사전 매개 변수는 사용자 자격 증명 (쿠키)에 대한 크로스 도메인 요청 인 경우에만 필요합니다. 지금까지 브라우저는 크로스 도메인 이벤트 소스 요청을 지원하지 않습니다. 따라서 예제에 두 번째 매개 변수는 포함되지 않습니다.

   이벤트 소스 연결이 열리면 <🎜
   이벤트가 트리거됩니다. 우리는
   • 속성을 ​​설정하여 이벤트를 처리하는 함수를 정의 할 수 있습니다.
   • 연결에 문제가 있으면 오류가 트리거됩니다. 우리는 <<> 속성을 ​​사용하여 이러한 이벤트의 핸들러 기능을 정의 할 수 있습니다. "훈련 오류"섹션에서 일부 오류 이벤트의 원인에 대해 논의 할 것입니다. 스토리 이벤트 기본 메시지 이벤트. 메시지 이벤트를 처리하기 위해 withCredentials 속성을 ​​사용하여 핸들러 기능을 정의 할 수 있습니다.
   우리는 또한

   를 사용하여 이벤트를들을 수 있습니다. 이것은 처리 이벤트 섹션에서 볼 수 있듯이 사용자 정의 이벤트를 처리하는 유일한 방법입니다. withCredentials

   연결을 닫으려면 <🎜 🎜> 메소드를 사용하십시오.
   따라서, 우리는 EventSource 객체를 만들고 개방, 메시지 및 오류 이벤트에 대한 핸들러를 정의했습니다. 그러나이 방법이 작동하려면 스트리밍 이벤트를위한 URL이 필요합니다.

   서버에서 이벤트를 보냅니다 서버가 이벤트를 보내는 이벤트는 URL에서 스트림의 일부로 전달 된 텍스트 스 니펫입니다. 브라우저가 데이터 데이터를 스트림으로 취급하려면 다음을해야합니다. open onopen

   헤더 (값은

   var evtsrc = new EventSource('./url_of/event_stream/');
   evtsrc.onopen = function(openevent){
       // 连接打开时执行的操作
   }

   )를 사용하여 내용을 제공합니다 <-> UTF-8 문자 인코딩을 사용하십시오.

   onerror 서버가 이벤트를 보내는 구문은 간단합니다. 하나 이상의 결장 분리 된 필드 이름 이름 값 쌍과 Newline 문자로 구성됩니다. 필드 이름에는 네 가지 가능한 값 중 하나가 포함될 수 있습니다.

   evtsrc.onerror = function(openevent){
       // 发生错误时执行的操作
   }

   <🎜 🎜> <<> : 전송 될 메시지.

   <🎜 🎜> <<> : 발송중인 이벤트 유형. onmessage <🎜 🎜> <<> : 클라이언트가 다시 연결될 때 사용될 이벤트 식별자가 사용됩니다.

   evtsrc.onmessage = function(openevent){
       // 接收到消息事件时执行的操作
   }

   <<> : 브라우저가 URL에 다시 연결하려고하기 전에 몇 밀리 초가 통과해야합니다.

   addEventListener() 그들 중에서도

   필드 만 필요합니다.

   var onerrorhandler = function(openevent){
       // 执行的操作
   }
   evtsrc.addEventListener('error',onerrorhandler,false);

   <<<> 메시지 이벤트 보내기 <🎜 🎜> <,>이 예에서는 토너먼트 경기에서 어떤 팀이 플레이하는지 알리기 위해 이벤트를 보내드립니다. 브라우저 가이 텍스트를 받으면 메시지 이벤트가 발송됩니다.
   필드의 값은 메시지 이벤트의

   속성의 값이됩니다. 위에서 언급했듯이 서버는 기본적으로 이벤트를 메시지 이벤트입니다. 그러나 나중에 논의 할 예정인

   필드를 포함하여 사용자 정의 이벤트를 파견 할 수도 있습니다.

   var evtsrc = new EventSource('./url_of/event_stream/',{withCredentials:false});

   우리는 또한 여러 데이터를 단일 이벤트로 보낼 수도 있습니다. 각 데이터는 Newline 캐릭터 (라인 Newline, Carriage Return 또는 둘 다)가이어야합니다. 여기서 우리는이 게임 위치와 출석을 포함하는 이벤트를 추가하고 있습니다.

   data 이 행사의 경우 data 속성의 값은 다음과 같습니다. Air Canada Centrentoronto, Ontario, Canadaintendance : 19,800. event 이벤트 사이의 빈 줄에 주목하십시오. 클라이언트가 이벤트를 받으려면 이벤트에 빈 라인이이어야합니다. 의견은 결장으로 시작합니다.

   <<<> 사용자 정의 이벤트 보내기 <🎜 🎜> 우리가 달리 지정하지 않는 한, 이벤트 유형은 메시지입니다. 이를 위해서는

   필드를 포함해야합니다. 다음 예에서는 스트림에 두 가지 이벤트를 추가하고 데이터를 JSON 형식의 문자열로 보냅니다.

   var evtsrc = new EventSource('./url_of/event_stream/');
   evtsrc.onopen = function(openevent){
       // 连接打开时执行的操作
   }

   여기, 우리는 메시지 이벤트 대신

   이벤트를 들어야합니다. 그러나 우리의 data 필드는 여전히 이벤트의

   속성의 가치가 될 것입니다.

   우리는 "처리 이벤트"섹션에서

   속성과 MessageEvent 인터페이스에 대해 논의 할 것입니다.

   연결을 관리하고 다시 연결 <🎜 🎜> 이제 서버가 이벤트를 브라우저로 푸시하지만 현실은 더 미묘합니다. 서버가 연결을 계속 열어두면 EventSource 요청이 확장 요청이됩니다. 닫히면 브라우저는 다시 연결하기 전에 몇 초 동안 대기합니다. 예를 들어 URL이 파일 끝 태그를 보내면 연결이 닫힐 수 있습니다.

   각 브라우저에는 자체 기본 재 연결 간격이 있습니다. 대부분 3 ~ 6 초 후에 다시 연결됩니다. 그러나

   필드를 포함 하여이 간격을 제어 할 수 있습니다. event 필드는 URL에 다시 연결하기 전에 클라이언트가 기다려야하는 밀리 초의 수를 나타냅니다. 5 초 (5000 밀리 초) 레트리 간격을 포함하도록 위의 예에서 이벤트를 구축하고 변경합시다. startingfive

   클라이언트가 연결되는 한 이벤트 스트림은 활성으로 유지 될 수 있습니다. 아키텍처 및 애플리케이션에 따라 서버가 연결을 주기적으로 닫으려고 할 수 있습니다.

   evtsrc.onerror = function(openevent){
       // 发生错误时执行的操作
   }

   id 필드 <🎜 🎜

   를 사용하여 고유 식별자를 설정하십시오 브라우저가 URL에 다시 연결되면 연결 지점에서 사용 가능한 모든 데이터를 수신합니다. 그러나 게임 정보 스크롤링 디스플레이의 경우 방문자에게 자신이 놓친 내용을 알려주고 싶을 수도 있습니다. 이것이 각 이벤트에 ID를 설정하기위한 모범 사례입니다. 다음 예에서는 득점 이벤트의 일부로 ID를 보내고 있습니다. startingfive

   var evtsrc = new EventSource('./url_of/event_stream/',{withCredentials:false});

   값은 스트림에 고유해야합니다. 이 경우 샷 점수 시간을 사용하고 있습니다.

   필드는이 이벤트 객체의

   속성이됩니다. 그러나 그것은 또 다른 목적을 가지고 있습니다. 연결이 닫히면 브라우저에는 다음 요청에

   헤더가 포함됩니다. 스트림의 북마크로 생각하십시오.

   헤더가 존재하는 경우 응용 프로그램의 응답을 조정하여 다음 이벤트가 전송되도록 할 수 있습니다. id 처리 이벤트 위에서 언급 한 바와 같이, 모든 이벤트는 메시지 이벤트에 기본적으로 기본적입니다. 각 메시지 이벤트에는 MessageEvent 인터페이스에 의해 정의 된 세 가지 속성이 있습니다. lastEventId Last-Event-ID event.data Last-Event-ID 메시지 이벤트의 일부로 보내진 데이터 또는 메시지를 반환합니다. event.origin

   메시지 소스를 반환합니다. 메시지 소스는 일반적으로 메시지 (예 : http, https), 호스트 이름 및 포트를 보낼 수있는 체계가 포함 된 문자열입니다.

   event.lasteventID
   마지막 이벤트의 고유 식별자를 반환합니다.

   메시지 이벤트가 트리거 될 때마다 우리의

   기능이 호출됩니다. 이것은 메시지 이벤트를 보내는 응용 프로그램에 적합합니다. 그러나 점수 또는 이벤트를 보내려면 (이 예제에 표시된대로) 그 제한이 명백 해집니다. 를 사용하여 더 유연합니다. 다음 코드에서는

   이벤트를 처리하기 위해

   를 사용하고 있습니다.

   (두 번째 부분, 공간 제한으로 인해 단락으로 질문을하십시오.)

위 내용은 서버에 대한 이벤트의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!