Question

enter link description here我已经看到了我在这里要问的问题的衍生物，但不认为它解决了我的问题。

我有一个画布对象，我经常根据需要刷新它。有时很多帧一秒钟。

为了获得这些新框架，我在一个定期计时器中调用web api，以获取我服务器上图像的最新时间戳，如果不同，则加载带有此数据的隐藏画布对象。

加载后再刷新＆＃39;可见的画布。

观察时我发现图像可能会加载不同步。我已经测试了将图像发送到我的服务器的顺序，并且我已经测试了图像被抓取的顺序＆＃39;从服务器并显示在客户端浏览器中。

如何在加载或跳过下一张图像之前确保我的初始图像已完成加载？

我是否应该使用画布图像队列并且阅读＆＃39;从前1名？这是否会引起内存峰值，因为我还读到在JavaScript中使用队列会导致内存泄漏？

由于

这是我的JavaScript代码：

我错误地认为它没有包含HTML5和错误处理。

如果这还不够，那么我发布剩下的......

<script type="text/javascript">
    var j1 = new JpegImage();

    j1.onload = function () {
        var d1 = ctx1.getImageData(0, 0, 360, 238);
        j1.copyToImageData(d1);
        //BrightenAndContrastImage(d1, contrastBy, brightenBy);
        cSingle.putImageData(d1, 0, 0)
    };

    var tmrFeeder;
    function StartFeedUp() {
        try {
            var throttled = _.delay(StartNonHTML5Feed, 100);
        }
        catch (err) {
            document.getElementById("divMode2").innerHTML = err;
        }
    }


    function StartNonHTML5Feed() {
        jQuery(function ($) {
            jQuery.support.cors = true;
            $.ajax({
                crossDomain: true,
                type: "POST",
                url: "Feed.aspx/GetNextFrames",
                data: JSON.stringify({
                    alias: alias,
                    guidlogon: guidlogon
                }),
                timeout: 10000,
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: function (msg) {
                    var ts1 = msg.d['Ts1'];           

                    if (ts1 == "") {
                        ts1 = "0";
                    }

                    if (t1 != ts1) {
                        t1 = ts1;
                        j1.load('/Cloud/LiveXP.ashx?alias=' + alias + '&camindex=0&guid=' + ts1);
                    }
                });
        });
        var throttled = _.delay(StartNonHTML5Feed, 100);
    }
</script>

加载图像的异步问题（使用画布和计时器）

0 个答案: