1

It seems we cannot show images on Google Chrome using file:// protocol.

I think would be nice to have a way to load the file on a remote network such as file://my-network-computer/my-folder/my-file.jpg and render it as image on a asp.net page.

Is it possible to load bytes from a file on a network drive, then render its content as image on asp.net page?

1
  • 1
    Just to clarify: It's not just chrome that won't do that; all of the browsers worth their salt should stop it. Commented Jan 5, 2012 at 20:40

2 Answers 2

3

You could write a handler that opens the file on the network using its UNC path and writes its contents to the response using Response.WriteFile:

<%@ WebHandler Language="C#" Class="Handler" %>

using System.IO;

public class NetworkImageHandler : System.Web.IHttpHandler
{
  // Folder where all images are stored, process must have read access
  private const string NETWORK_SHARE = @"\\computer\share\";

  public void ProcessRequest(HttpContext context)
  {
      string fileName = context.Request.QueryString["file"];
      // Check for null or empty fileName
      // Check that this is only a file name, and not 
      // something like "../../accounting/budget.xlsx"
      // Check that the file extension is valid

      string path = Path.Combine(NETWORK_SHARE, fileName);
      // Check if the file exists

      context.Response.ContentType = "image/jpg";
      context.Response.WriteFile(path, true);
  }

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

Then you set the image src to the handler url:

<asp:Image runat="server" ImageUrl="~/NetworkImageHandler.ashx?file=file.jpg" />

Be very strict about checking the input, don't create a handler that would allow someone to open just any file on your network. Restrict access to a single folder, only give the worker process access to that folder and check for valid file extensions (e.g. jpg, jpeg, png, gif).

This is a rather simple example, don't use it in production without testing.

For alternative ways to write content to the response, and more example code, see:

Sign up to request clarification or add additional context in comments.

Comments

2

Yes, it's possible.

You can transform the bytes to a base64 string and set the image src to be the base64 string.

Example:

<img src="data:image/gif;base64,R0lGODlhDwAPAKECAAAAzMzM/////
wAAACwAAAAADwAPAAACIISPeQHsrZ5ModrLlN48CXF8m2iQ3YmmKqVlRtW4ML
wWACH+H09wdGltaXplZCBieSBVbGVhZCBTbWFydFNhdmVyIQAAOw=="
alt="Base64 encoded image" width="150" height="150"/>

And the way you convert the bytes to a base64 string is:

 base64String = System.Convert.ToBase64String(binaryData, 
                            0,
                            binaryData.Length);

2 Comments

Does that work for larger images. Don't you hit a url length limit after a few kB?
@CodeInChaos It does have some limitations, this Wikipedia Article (en.wikipedia.org/wiki/Data_URI_scheme) has a very thorough explanation

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.