开发者

Display an ashx image using jQuery?

开发者 https://www.devze.com 2023-02-01 23:16 出处:网络
I\'ve been trying to use开发者_开发问答 the jQuery plugin Colorbox to display images I have in my DB through an ashx file.Unfortunately it just spits a bunch of gibberish at the top of the page and no

I've been trying to use开发者_开发问答 the jQuery plugin Colorbox to display images I have in my DB through an ashx file. Unfortunately it just spits a bunch of gibberish at the top of the page and no image. Can this be done? Here is what I have so far:

   $(document).ready
   (
       function () 
       {
           $("a[rel='cbImg']").colorbox(); 
       }
   );
...
<a rel="cbImg" href="HuntImage.ashx?id=15">Click to see image</a>

UPDATE:

My ashx file is writing the binary out:

            context.Response.ContentType = "image/bmp";
            context.Response.BinaryWrite(ba);


Colorbox has an option 'photo'. If you set this to true in your constructor then it will force it to render the photo.

$(target).colorbox({photo: true});


You should be setting the src attribute in the client side.

<img src="HuntImage.ashx?id=15" ..../>

The handler

public class ImageRequestHandler: IHttpHandler, IRequiresSessionState
    {
        public void ProcessRequest(HttpContext context)
        {
            context.Response.Clear();

            if(context.Request.QueryString.Count != 0)
            {
        //Get the stored image and write in the response.
                var storedImage = context.Session[_Default.STORED_IMAGE] as byte[];
                if (storedImage != null)
                {
                    Image image = GetImage(storedImage);
                    if (image != null)
                    {
                        context.Response.ContentType = "image/jpeg";
                        image.Save(context.Response.OutputStream, ImageFormat.Jpeg);
                    }
                }
            }
        }

        private Image GetImage(byte[] storedImage)
        {
            var stream = new MemoryStream(storedImage);
            return Image.FromStream(stream);
        }

        public bool IsReusable
        {
            get { return false; }
        }
    }


It appears that I can't do what I am trying using colorbox with an ashx image. If anyone finds a way please post it here.

I considered deleting the question but I will leave it up incase someone else runs into the same issue.


Find this function around line 124 (colorbox 1.3.15)

// Checks an href to see if it is a photo.
// There is a force photo option (photo: true) for hrefs that cannot be matched by this regex.
function isImage(url) {
    return settings.photo || /\.(gif|png|jpg|jpeg|bmp)(?:\?([^#]*))?(?:#(\.*))?$/i.test(url);
}

On line 127, add |ashx after bmp in (gif|png|jpg|jpeg|bmp) so it reads like this:

// Checks an href to see if it is a photo.
// There is a force photo option (photo: true) for hrefs that cannot be matched by this regex.
function isImage(url) {
    return settings.photo || /\.(gif|png|jpg|jpeg|bmp|ashx)(?:\?([^#]*))?(?:#(\.*))?$/i.test(url);
}

This is working just fine for me in Sitecore 6.2 :)

0

精彩评论

暂无评论...
验证码 换一张
取 消