ServiceWorker client.postMessage FIFO序列

Question

编辑：我似乎无法在没有调试的情况下重现这一点但是我的测试并没有真正地进行过广泛的测试。如果您可以提供帮助，请参阅以下工作示例的代码： - https://drive.google.com/open?id=0B7Rmd3Rn8_hDNW1zSWRoXzBTclU有一个aaa_readme.txt，它是非常简单的文档代码。当然关于已经讨论过的SW消息。

我非常确定我所看到的只是Chrome调试器干预的一个副作用，结合了各种＆＃34;警报＆＃34;在我的代码中，但在这方面的另一组眼睛或更多的知识可以解决我的问题，并指出我做错了。

我所看到的是，非常偶然地，来自ServiceWorker（postMessage）的消息以与写入它们的顺序不同的顺序到达客户端（onmessage）。如果它不是调试器，则必须是我的代码。

如果您查看以下输出，＆＃34; 开始消息事件如何在 INTRO消息事件之前传递给客户端？

当开始消息事件到达时，看到SWIcnt仍处于其初始值-1。

Console.log输出（按正确顺序）： -

SW Registered
TravelManagerPolyfill.js:177 Msg Sent to SW
travelmanager.html:162 Got SW command GrussGott
travelmanager.html:162 Got SW command start
TravelManagerPolyfill.js:177 Msg Sent to SW
travelmanager.html:162 Got SW command loiter
TravelManagerPolyfill.js:297 recalibrating

输出DIV内容： - （ 不正确 顺序）

<div class="log" id="logWindow">
Messages: -<br>
<span style="color:white">1:27:40 PM Kick off!</span><br>
1:27:52 PM 1:27:40 PM SWI-1 NaN 1 start lng: 115.8107681 lat: -31.982061499999997 +/- 1697<br>
<span style="color:red">1:27:55 PM New ServiceWorker instance 0</span><br>
1:28:37 PM 1:27:40 PM SWI0 1 2 loiter lng: 115.8107681 lat: -31.982061499999997 +/- 1697<br>
</div>

客户代码： -

var SWIcnt = -1;
var SWIhits = [];

navigator.serviceWorker.addEventListener("message", SWMessage);

function SWMessage(e)
{
var resp = e.data;
console.log("Got SW command "+resp.cmd);

if (resp.cmd == INTRO) {
    SWIhits[++SWIcnt] = 0;
    logWindow.innerHTML += "<span style='color:red'>" + 
                        new Date().toLocaleTimeString() + 
                        " New ServiceWorker instance " + 
                        SWIcnt +"</span><br />" ;
    return;
}

SWIhits[SWIcnt]++

if (resp.cmd == ERROR) {
    logWindow.innerHTML += "<span style='color:yellow'>" + 
                        new Date().toLocaleTimeString() + 
                        " error from SW  " + 
                        resp.data.message +"</span><br />" ;
    return;
}

const prolog = "";
const epilog = "<br />";
var position = resp.data;
var outMessage = prolog + new Date().toLocaleTimeString() + " " +
                new Date(position.timestamp).toLocaleTimeString() + " SWI" +
                SWIcnt + " " + SWIhits[SWIcnt] + " " + resp.serialNum + " " +
                resp.cmd + " lng: " + position.coords.longitude + " lat: " +
                position.coords.latitude + " +/- " + position.coords.accuracy +
                epilog; 
logWindow.innerHTML += outMessage;
}

以下是相关的ServiceWorker代码： -

var   doryRegister  = [];            // Meet someone new every day.
const INTRO         = "GrussGott";   // Tell clients we're new.


function sendClient(client, cmd, msg)
{                 
    if (!doryRegister[client.id]) {
        doryRegister[client.id] = 0;
        if (!postIt(client,{'cmd':INTRO})) return false;
    }

    return postIt(client,   
                    {
                    "cmd" : cmd,
                    "serialNum" : ++doryRegister[client.id],
                    "data" : msg
                    });
}

function postIt(client,msg)
{
    try {
        client.postMessage(msg)
    } catch (e) {
        console.log("Could not respond to client: "+e.message)
        return false;
    }
    return true;
}