IHttpHandler للصور إنتاج ستاكوفيرفلوو في IE

Question

ولدي دليل من الصور التي يقيمون خارج سياق تطبيق الويب الخاص بي بأنني في حاجة لخدمة للمستخدم. حاليا أنا باستخدام IHttpHandler لخدمة الصور واستخدام بعض جافا سكريبت للتنقل من خلال مجموعة من الصور (الملاحة هو بدائي في الوقت الحالي). تابعت أمثلة لاستخدام IHttpHandler لخدمة الصور عن كثب ولكن عندما عرض الصور في فايرفوكس متصفح معلقة وعندما عرض في IE أحصل على "المكدس تجاوز في السطر: 0".

ورمز للIHttpHandler

Public Class ShowImage : Implements IHttpHandler

    Public Sub ProcessRequest(ByVal context As HttpContext) _
                               Implements IHttpHandler.ProcessRequest
        Dim picid As String
        If context.Request.QueryString("id") IsNot Nothing Then
            picid = context.Request.QueryString("id")
        Else
            Throw New ArgumentException("No parameter specified")
        End If

        '' Convert Byte[] to Bitmap
        context.Response.Cache.SetCacheability(HttpCacheability.NoCache)
        context.Response.Cache.SetNoStore()
        context.Response.Cache.SetExpires(DateTime.MinValue)

        Dim newBmp As Bitmap = GetPhoto(picid)
        If newBmp IsNot Nothing Then
            Dim imgGraphics As Graphics = Graphics.FromImage(newBmp)
            imgGraphics.DrawImageUnscaled(newBmp, 0, 0, 640, 480)

            context.Response.StatusCode = 200
            context.Response.ContentType = "image/jpeg"
            newBmp.Save(context.Response.OutputStream, ImageFormat.Jpeg)
            newBmp.Dispose()
        Else
            '' Return 404
            context.Response.StatusCode = 404
            context.Response.End()
        End If

    End Sub

    ...

    Public ReadOnly Property IsReusable() As Boolean _
                        Implements IHttpHandler.IsReusable
        Get
            Return True
        End Get
    End Property
End Class

وهنا هو رمز جافا سكريبت وهذا ما يدعو IHttpHandler المحددة أعلاه:

function updateImage(){
    var ddlPhotos = document.getElementById("ddlPhotos");
    var selected = ddlPhotos.options[ddlPhotos.selectedIndex].value;
    if( selected != -1 ){
        // Update the image
        retrievePicture(document.getElementById("propertyImage"), selected)
    }
}

function retrievePicture(imgCtrl, picid)
{
    imgCtrl.src = 'ShowImage.ashx?id=' + picid;
}

وأخيرا ها هي علامة img هذا هو "صاحب المكان":

<img src="#" 
     alt="Property Photo" 
     width="640px" 
     height="480px" 
     id="propertyImage" 
     onload="retrievePicture(this, '<%= pictureId.value  %>');"
/>

وأنا في حيرة لماذا يبدو جافا سكريبت لتخرج عن نطاق السيطرة ...

Answer 1

وبي <م> تخمين - عدم خبير جافا سكريبت - أن هذا الحدث onload يتم تشغيل أي وقت صورة انتهاء تحميل. وبعبارة أخرى، حالما يتم تحميل الصورة، فإنه يتسبب تحميل واحدة جديدة ... التي مشغلات تحميل واحدة جديدة ... التي مشغلات تحميل واحد جديد وما إلى ذلك.

وأنت من المحتمل أن يكون قادرا على رؤية أن في المكالمات متعددة إلى خادم للصورة نفسها - إلا إذا كان المتصفح التخزين المؤقت ذلك، بطبيعة الحال. على أي حال، سوف تحتاج إما لتحريك ذلك بطريقة أخرى، أو جعل الزناد كشف أن الصورة التي تم تحميلها بالفعل على حق واحد، وليس هناك حاجة ليحل محله.

Answer 2

وأظن الفعل من تغيير src وتحميل صورة جديدة يمكن التسبب في "ONLOAD" حالة الصورة مرة أخرى.

وحاول إزالة الحدث قبل وضع المصدر، وربما تبدو مشابهة لهذه:

function retrievePicture(imgCtrl, picid)
{
    imgCtrl.onload = null;
    imgCtrl.src = 'ShowImage.ashx?id=' + picid;
}