Rendering .html file with image reference as View. Asp Net Mvc

Question

I have .html file and gif file which are stored on Server's machine in one folder. Html file has a reference on gif file like <img src="file.gif" />.

In my ASP.NET MVC Application I would like to show "Download" link. If user clicks on it browser has to show stored html file with injected picture.

I tried to use next code:

@Html.ActionLink("Download", "DownloadHtmlFile", "ControllerName") 

public ActionResult DownloadHtmlFile()
{
    return new FilePathResult("path_to_html_file.html", "text/html");
}

In that case browser shows html file. But there is hole into image place instead of image (like it was removed).

How can I implement that correctly?

P.S. I can't store files in my application's folder (like 'C:\inetpub\MyApplicationName...') in order to put direct reference on them into .cshtml View cause it gives unauthorized access to them.

avidenic · Accepted Answer · 2014-06-30 14:54:24Z

The thing is, that html is missing the actual picture.

You have 2 ways, either reference images by full path making them available even if user opens .html file locally like so:

<img src="http://someDomainName.com/file.gif" />

But the downside is that if user is offline, the image will not show.

Second option is, to package (i.e. zip) the files and send them together.

Like this:

var outputStream = new MemoryStream();

using (var zip = new ZipFile())
{
    zip.AddEntry("path_to_html_file.html", "content1");
    zip.AddEntry("path_to_image_file.gif", "content2");
    zip.Save(outputStream);
}

outputStream.Position = 0;
return File(outputStream, "application/zip", "filename.zip");

One thing to note, if you want to make it robust, you will need metadata (which .htmls contain which images) stored in DB or xml file or something. But this can create maintenance problems.

Another option is to use HtmlAgility pack to scan .htmls for images.

 HtmlDocument doc = new HtmlDocument();
 doc.Load("path_to_html_file.html");
 foreach(HtmlNode link in doc.DocumentNode.SelectNodes("//img[@src]")
 {
    HtmlAttribute att = link["src"];
    //build a collection of image locations and add them to zip
 }

amala gopal das · Accepted Answer · 2014-06-30 14:54:19Z

0

You can use the following action in order to display images without creating html view:

public ActionResult Image(string imageName)
{
    var imagesPath = Server.MapPath("/Content/Images");
    var fullPath = Path.Combine(imagesPath, imageName);
    return base.File(fullPath, "image/jpeg");
}

Then you can get the image with this url:

http://localhost/MyController/Image?imageName=someImage.jpeg

EDIT: If you need to show it from a view, just add action link to this method i.e.

@Url.Action("Image", "MyController", new { imageName = "someImage.jpeg" })

P.S. make sure the routing is setup properly. Hope it helps!

edited Jun 30, 2014 at 14:54

answered Jun 30, 2014 at 14:34

amala gopal das

937 bronze badges

1 Comment

user3505782 Over a year ago

But I need to show exactly HTML with IMAGE. Both of them are uploaded by user and stored on server for further actions.

Collectives™ on Stack Overflow

Rendering .html file with image reference as View. Asp Net Mvc

2 Answers 2

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related