diff options
Diffstat (limited to 'files/pt-pt/web/api/messageevent/index.html')
-rw-r--r-- | files/pt-pt/web/api/messageevent/index.html | 139 |
1 files changed, 0 insertions, 139 deletions
diff --git a/files/pt-pt/web/api/messageevent/index.html b/files/pt-pt/web/api/messageevent/index.html deleted file mode 100644 index f69342523b..0000000000 --- a/files/pt-pt/web/api/messageevent/index.html +++ /dev/null @@ -1,139 +0,0 @@ ---- -title: MessageEvent -slug: Web/API/MessageEvent -tags: - - API - - Canais - - Interface - - Mensagens - - Referencia - - WebSockets - - Window - - Workers -translation_of: Web/API/MessageEvent ---- -<div>{{APIRef("HTML DOM")}}</div> - -<p>A interface <code><strong>MessageEvent</strong></code> representa a mensagem recebida pelo objeto alvo.</p> - -<p>É usado para representar mensagens em:</p> - -<ul> - <li><a href="/en-US/docs/Web/API/Server-sent_events">Eventos enviados pelo servidor</a> (ver {{domxref("EventSource.onmessage")}}).</li> - <li><a href="/pt-PT/docs/Web/API/WebSockets_API">Web sockets</a> (ver a propriedade <code>onmessage</code> da interface <a href="/en-US/docs/Web/API/WebSocket">WebSocket</a>).</li> - <li>Envio de mensagens entre-documentos (ver {{domxref("Window.postMessage()")}} e {{domxref("Window.onmessage")}}).</li> - <li><a href="/en-US/docs/Web/API/Channel_Messaging_API">Mensagens em canal</a> (ver {{domxref("MessagePort.postMessage()")}} e {{domxref("MessagePort.onmessage")}}).</li> - <li>Envio de mensagens entre-documentos e entre-<em>workers</em> (ver as duas entradas acima, e tembém {{domxref("Worker.postMessage()")}}, {{domxref("Worker.onmessage")}}, {{domxref("ServiceWorkerGlobalScope.onmessage")}}, etc.)</li> - <li><a href="/en-US/docs/Web/API/Broadcast_Channel_API">Canais de transmissão</a> (ver {{domxref("Broadcastchannel.postMessage()")}}) e {{domxref("BroadcastChannel.onmessage")}}).</li> - <li>Canais de transmissão de WebRTC (ver {{domxref("RTCDataChannel.onmessage")}}).</li> -</ul> - -<p>A ação acionada por este evento é definida na função escolhida para ser o <em>event handler</em> do evento {{event("message")}} relevante (e.x. usar um <em>handler</em> <code>onmessage</code> como é menciondo antriormente).</p> - -<p>{{AvailableInWorkers}}<br> - {{InheritanceDiagram(600, 80)}}</p> - -<h2 id="Construtor">Construtor</h2> - -<dl> - <dt>{{domxref("MessageEvent.MessageEvent", "MessageEvent()")}}</dt> - <dd>Cria um <code>MessageEvent</code>.</dd> -</dl> - -<h2 id="Propriedades">Propriedades</h2> - -<p><em>Esta interface também herda propriedades da interface {{domxref("Event")}}, </em> <em>de qual se deriva</em><em>.</em></p> - -<dl> - <dt>{{domxref("MessageEvent.data")}} {{readonlyInline}}</dt> - <dd>Os dados enviados pelo emissor da mensagem.</dd> - <dt>{{domxref("MessageEvent.origin")}} {{readonlyInline}}</dt> - <dd>Uma {{domxref("USVString")}} que representa a origem do emissor da mensagem.</dd> - <dt>{{domxref("MessageEvent.lastEventId")}} {{readonlyInline}}</dt> - <dd>Uma {{domxref("DOMString")}} que representa um ID único para o evento.</dd> - <dt>{{domxref("MessageEvent.source")}} {{readonlyInline}}</dt> - <dd>Uma <code>MessageEventSource</code> (que pode ser um objeto {{domxref("WindowProxy")}}, {{domxref("MessagePort")}}, ou {{domxref("ServiceWorker")}}) que representa o emissor da mensagem.</dd> - <dt>{{domxref("MessageEvent.ports")}} {{readonlyInline}}</dt> - <dd>Uma matriz de objetos {{domxref("MessagePort")}} que representam as portas ao canal por qual as mensagens são enviadas (onde for apropriado, por exemplo em mensagens via canais ou ao enviar uma mensagem a um <em>worker</em> partilhado).</dd> -</dl> - -<h2 id="Métodos">Métodos</h2> - -<p><em>Esta interface também herda métodos de {{domxref("Event")}}, de qual se deriva.</em></p> - -<dl> - <dt>{{domxref("MessageEvent.initMessageEvent","initMessageEvent()")}} {{deprecated_inline}}</dt> - <dd>Inicializa um evento de mensagem. <strong>Não use</strong> — <strong>use antes o construtor {{domxref("MessageEvent.MessageEvent", "MessageEvent()")}}.</strong></dd> -</dl> - -<h2 id="Exemplos">Exemplos</h2> - -<p>No nosso<a class="external external-icon" href="https://github.com/mdn/simple-shared-worker">exemplo básico dum <em>worker</em> partilhado</a>, temos duas páginas de HTML, cada qual usa JavaScript para fazer um simples cálculo. Os <em>scripts</em> diferentes estão a utilizar o mesmo ficheiro de <em>worker</em> para fazer os cálculos — ambos podem-no aceder, mesmo se as páginas estiverem a correr em janelas diferentes.</p> - -<p>O seguinte <em>snippet</em> de código demonstra a criação dum objeto {{domxref("SharedWorker")}} usando o construtor {{domxref("SharedWorker.SharedWorker", "SharedWorker()")}}. Ambas <em>scripts</em> contêm isto:</p> - -<pre class="brush: js notranslate">var myWorker = new SharedWorker('worker.js'); -</pre> - -<p>Ambas <em>scripts</em> acedem ao <em>worker</em> através dum objeto {{domxref("MessagePort")}} criado usando a propriedade {{domxref("SharedWorker.port")}}. Se o evento <code>onmessage</code> foi adicionado usando <code>addEventListener</code>, a porta é manualmente criada usando o seu método <code>start()</code>:</p> - -<pre class="brush: js notranslate">myWorker.port.start();</pre> - -<p>Quando a porta é iniciada, ambos <em>scripts</em> enviam mensagens ao <em>worker</em> e processão mensagens vindas do <em>worker</em> usando <code>port.postMessage()</code> e <code>port.onmessage</code>, respetivamente:</p> - -<pre class="brush: js notranslate">first.onchange = function() { - myWorker.port.postMessage([first.value,second.value]); - console.log('Mensagem enviada ao worker'); -} - -second.onchange = function() { - myWorker.port.postMessage([first.value,second.value]); - console.log('Mensagem enviada ao worker'); -} - -myWorker.port.onmessage = function(e) { - result1.textContent = e.data; - console.log('Mensagem recebida do worker'); -}</pre> - -<p>Dentro do <em>worker</em> usamos o <em>handler</em> {{domxref("SharedWorkerGlobalScope.onconnect")}} para nos ligarmos à mesma porta a que referimos antes. As portas associadas a esse <em>worker</em> são acessíveis através da propriedade <code>ports</code> do evento {{event("connect")}} — nós depois usamos o método <code>start()</code> de {{domxref("MessagePort")}} para iniciar a porta, e o <em>handler</em> <code>onmessage</code> para lidar com as mensagens enviadas dos <em>threads</em> principais.</p> - -<pre class="brush: js notranslate">onconnect = function(e) { - var port = e.ports[0]; - - port.addEventListener('message', function(e) { - var workerResult = 'Result: ' + (e.data[0] * e.data[1]); - port.postMessage(workerResult); - }); - - port.start(); // Necessário quando se usa addEventListener. Senão é chamado implicitamente pelo setter onmessage. -}</pre> - -<h2 id="Especificações">Especificações</h2> - -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">Especificação</th> - <th scope="col">Estado</th> - <th scope="col">Comentário</th> - </tr> - <tr> - <td>{{SpecName('HTML WHATWG', "#messageevent", "MessageEvent")}}</td> - <td>{{Spec2('HTML WHATWG')}}</td> - <td></td> - </tr> - </tbody> -</table> - -<h2 id="Compatibilidade">Compatibilidade</h2> - - - -<p>{{Compat("api.MessageEvent")}}</p> - -<h2 id="Ver_também">Ver também</h2> - -<ul> - <li>{{domxref("ExtendableMessageEvent")}} — parecida a esta interface, mas usada como base de outras interfaces que necessitam dar mais flexibilidade aos seus utilizadores ou autores.</li> -</ul> |