HTML5에서 JavaScript 공유 웹 작업자를 사용하는 방법

우리는 최근에 JavaScript 웹 워커에 대해 논의했습니다 "전용"품종을 참조하여. 아직 읽지 않았다면 먼저 그렇게하는 것이 좋습니다.이 기사는 동일한 개념을 바탕으로합니다. 호트로의 웹 작업자 웹 워커는 별도의 스레드에서 배경으로로드 및 실행 된 단일 자바 스크립트 파일입니다. 전용 웹 워커는 제작자 (작업자를로드 한 스크립트)와 연결되어 있습니다. 공유 웹 작업자는 모든 스크립트가 단일 작업자와 의사 소통 할 수 있도록합니다. 공유 웹 작업자는 DOM, 문서 또는 페이지 스크립트 액세스 및 대부분의 창 속성에 대한 읽기 전용 권한이없는 전용 상대와 동일한 규칙을 준수합니다. 또한 Page Scripts는 동일한 Origin/Domain (somesite.com)의 공유 웹 작업자 와만 통신 할 수 있습니다. 현재 공유 웹 워커는 Chrome, Safari 및 Opera에서 지원됩니다. Firefox 4 및 IE9 지원이 도착할 수 있지만 내기하지 마십시오. 공유 근로자는 자원을 절약 할 수 있지만 추가 수준의 복잡성을 추가합니다. 예를 들어 몇 가지 문제가 예상됩니다.

dom2 이벤트 (addeventListener) 핸들러는 가장 신뢰할 수있는 구현 인 것 같습니다. 당신은 거의 확실하게 브라우저 별 단점을 만나게 될 것이며 디버깅은 어렵습니다. 다음 코드는 최신 버전의 Chrome에서 작동하지만 Safari 또는 Opera에서 작동한다고 가정하지 않습니다.

공유 웹 작업자 만들기 공유 웹 워커를 만들려면 JavaScript 파일 이름을 SharedWorker 개체의 새 인스턴스로 전달합니다.

공유 웹 작업자와 의사 소통 귀하의 페이지 스크립트는 공유 웹 작업자와 통신 할 수 있습니다. 전용 웹 워커와 달리 '포트'객체를 통해 통신하고 메시지 이벤트 핸들러를 첨부해야합니다. 또한 포트의 start ()를 호출해야합니다. 메소드 첫 번째 postMessage ()를 사용하기 전에 : pagescrip.js : 웹 워커 스크립트가 스크립트에서 첫 번째 메시지를 수신하면 이벤트 핸들러를 활성 포트에 첨부해야합니다. 대부분의 상황에서 핸들러는 자체 사후 메소드 () 메소드를 실행하여 메시지를 호출 코드에 반환합니다. 마지막으로 메시징을 활성화하려면 포트의 start () 메소드도 실행해야합니다. jsworker.js :
• 그들의 헌신적 인 형제 자매와 마찬가지로 공유 웹 워커는 다음과 같습니다.
importScripts () 로 추가 스크립트를로드하십시오 오류 핸들러를 첨부하십시오 <..> 특정 포트에서 추가 통신을 방지하기 위해 포트를 실행하십시오.

공유 웹 워커는 아마도 몇 년 동안 실행 가능한 기술이 아닐지 모르지만 JavaScript 개발의 미래를위한 흥미로운 기회를 제기합니다. 브라우저 공급 업체가 몇 가지 괜찮은 추적 및 디버깅 도구를 제공 할 수 있기를 바랍니다. JavaScript 공유 웹 작업자에 대한 자주 묻는 질문 (FAQ)

JavaScript의 공유 근로자와 웹 직원의 주요 차이점은 무엇입니까?

JavaScript의 공유 근로자와 웹 직원은 모두 멀티 스레딩을 허용하지만 범위와 사용량은 다릅니다. 웹 작업자는 생성 된 탭의 범위로 제한됩니다. 다른 탭이나 창과 통신 할 수 없습니다. 반면에 공유 작업자는 여러 스크립트에서 액세스 할 수 있습니다. 심지어 동일한 도메인에있는 한 다른 탭, 창 또는 iframes에서 실행되는 스크립트조차도 액세스 할 수 있습니다. 이로 인해 다른 브라우저 컨텍스트 간의 데이터 공유 및 커뮤니케이션이 필요한 작업에 이상적인 공유 작업자가 이상적입니다.

JavaScript에서 공유 작업자를 만드는 방법

JavaScript에서 공유 작업자를 만드는 방법은 공유 작업자 대상을 인스턴스화하는 것과 관련이 있습니다. 간단한 예는 다음과 같습니다.

var mysharedworker = new sharedworker ( 'worker.js');

이 예에서 'worker.js'는 공유 작업자가 실행하는 스크립트입니다. 스크립트는 동일한 원인 정책 제한으로 인해 공유 작업자를 생성하는 스크립트와 동일한 도메인에 있어야한다는 점에 유의해야합니다.

공유 작업자와 어떻게 의사 소통 할 수 있습니까?

공유 작업자와의 커뮤니케이션은 사후 관리 방법과 onmessage 이벤트 핸들러를 사용하여 수행됩니다. PostMessage 메소드는 공유 작업자에게 메시지를 보내는 데 사용되며 OnMessage 이벤트 처리기는 메시지를받는 데 사용됩니다. 예는 다음과 같습니다.

// 공유 작업자에게 메시지를 보내는 // 공유 작업자로부터 메시지를받는
mysharedworker.onmessage = function (};
공유 작업자가 다른 브라우저 탭간에 데이터를 공유 할 수 있습니까?
예, 공유 작업자의 주요 기능 중 하나는 다른 브라우저 탭, 창 또는 iframes간에 데이터를 공유하는 능력입니다. 동일한 도메인의 모든 스크립트가 동일한 공유 작업자 인스턴스에 액세스 할 수 있기 때문에 가능합니다. 이로 인해 공동 작업자는 협업 편집 앱 또는 멀티 탭 게임과 같은 여러 탭 또는 창에서 실시간 업데이트가 필요한 작업에 이상적입니다.
모든 브라우저에서 지원되는 공유 작업자는 공유 작업자가? 그러나 인터넷 익스플로러에서는 지원되지 않습니다. 내가 사용할 수 있거나 MDN 웹 문서와 같은 웹 사이트에서 최신 브라우저 호환성 정보를 확인하는 것이 항상 좋습니다. 공유 근로자의 오류를 처리하려면 어떻게해야합니까?

공유 근로자는 실행 중에 발생하는 오류를 잡고 처리하는 데 사용할 수있는 'Onerror'이벤트 핸들러가 있습니다. 예는 다음과 같습니다.

mysharedworker.onerror = function (e) {

console.log ( '오류가 발생했습니다. xmlhttprequest 객체에 액세스 할 수 있으며 서버에 비동기 요청을 할 수 있습니다. 이를 통해 공유 작업자는 기본 스레드를 차단하지 않고 서버에서 데이터를 가져올 수 있으며 웹 애플리케이션의 성능을 향상시킬 수 있습니다.
공유 작업자는 websockets를 사용할 수 있습니까?

예, 공유 근로자는 웹 소집을 사용할 수 있습니다. 이를 통해 서버와 함께 양방향 통신 채널을 설정할 수 있으므로 투표 할 필요없이 실시간으로 데이터를 보내고 수신 할 수 있습니다.

공유 근로자가 DOM에 액세스 할 수 있습니까? 이는 별도의 스레드로 실행되고 기본 스레드와 동일한 범위에 액세스 할 수 없기 때문입니다. 그러나이 메시지를 기반으로 DOM을 업데이트 할 수있는 메인 스레드로 메시지를 보낼 수 있습니다.

공유 작업자를 종료하려면 어떻게 공유 작업자 개체에서 '종료'메소드를 호출하여 공유 작업자를 종료 할 수 있습니다. 그러나 현재 작업을 완료했는지 여부에 관계없이 이것은 공유 작업자가 즉시 종료 될 것임을 주목하는 것이 중요합니다. 예는 다음과 같습니다.

mysharedworker.terterminate ();

이것은 즉시 공유 작업자를 종료하게됩니다. 일반적으로 더 이상 필요하지 않거나 성능 문제를 일으키는 경우 공유 근로자 만 종료하는 것이 좋습니다.

위 내용은 HTML5에서 JavaScript 공유 웹 작업자를 사용하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!