这个问题有2个要素需要理解

发行声明

GetProdImage.cs

   //Retrieves image from db based on id
    int id = Page.RouteData.Values["prod_id"];
    Controller controller = new Controller();

    DBContext context = GetDBContext();

    ProductImage productImage = controller.GetImage(id);

    context.Response.Clear();
    context.Response.ContentType = "image/"+productImage.ImageExt;
    context.Response.BinaryWrite(productImage.bindata);
    context.Response.Flush();


jQuery HTML构建

<script>
                function ihatemylife()
                {
                    debugger;
                    var html = "<img src=\"http://localhost:3756/GetProdImage/10\" style=\"max-width: 200px;\"/>" +
                     "<img src=\"http://localhost:3756/GetProdImage/11\" style=\"max-width: 200px;\"/>" +
                    " <img src=\"http://localhost:3756/GetProdImage/12\" style=\"max-width: 200px;\"/>";

                    $("#sm-test").html(html);
                }

                });
    </script>
        <div id="sm-test"></div>


请注意,每个图像只是一个红色数字。
使用标准将其插入DOM元素

$(element).html(html);


此生成产生以下内容:
每列都是页面刷新。
请注意顺序永远不会相同。
javascript - 在element.html()调用上出现痉挛的img结果-LMLPHP

检查页面(证明html正确)

javascript - 在element.html()调用上出现痉挛的img结果-LMLPHP

调试信息

如果将断点放置在GetProdImage.cs中,则可以看到在插入html时调用了该断点。奇怪的是,id的值反映了痉挛的图像排序,而不是html中反映的内容。
即第一次迭代GetProdImage用12,10,12调用
第二次迭代被称为11,12、12等

这种观察使我认为这与我的jQuery实现有关。

如果访问了GetProdImage的每个URL,它将产生正确的图像。

javascript - 在element.html()调用上出现痉挛的img结果-LMLPHP

所以要测试一下:

如果我一起切掉GetProdImage()并对公共图像使用硬编码的img src值,如下所示:

    html += "<td><img title=\"" + i + "\" src=\"https://upload.wikimedia.org/wikipedia/commons/d/d0/DJCTQ_-_10.JPG\" />" +
"<img title=\"" + i + "\" src=\"https://upload.wikimedia.org/wikipedia/commons/9/9d/French_Military_Button_Rgmt_Number_11.jpg\"/>" +  " <img title=\"" + i + "\" src=\"http://thumb1.shutterstock.com/display_pic_with_logo/569284/257460898/stock-photo-number-257460898.jpg\""/></td>";


结果令人惊讶:
每次都以正确的顺序排列图像。
javascript - 在element.html()调用上出现痉挛的img结果-LMLPHP

我相信我的矛盾现在很清楚。

从注释中调试
1)标记直接放置在页面上,而不是通过使用GetProdImage as src通过jquery调用加载的,每次都能正常工作。

2)对于调用jquery的页面,Turing EnableSessionState =“ false”无效。



是什么会导致GetProdImage的行为以随机顺序接收(和返回)图像?
接收到的随机数表明JQuery有错误。
硬编码的img src指向GetProdImage。

我很笨

这些是我的问题。

最佳答案

问题在这里
GetProdImage.cs

int id = Page.RouteData.Values["prod_id"];


设置ID发生了竞争情况。
我将其更改为HttpContext驱动,而不是REST。

07-24 09:31