Images in app_offline file - asp.net

Is there a way to use an image with an app_offline file? I'd like to keep the app_offline looking like the rest of the website - same header, etc, which includes an image.
I did try finding a way to do this but I can't seem to do so. The forum posts that I've ran across say it's not possible, since the app_offline forces all requests (even those for images and css) to redirect to the app_offline page, but I'm hoping that someone here will have an answer. Obviously, I can embed the css into the HTML, rather than pointing to the site's .css file, but I'm not sure how to get around the image issue.

You could try base64 encoding the image, ie.
<img src="data:image/gif;base64,BASE64STRINGHERE" width="80" height="15" />
The reason you need to do it like this is that IIS sees the image as a request and app_offline.htm being present in the root is telling IIS to redirect ALL requests therefore this includes any MIME types from images to music etc

Related

URL Rewriting to add / before every path in ASP.Net

I am using Routing in ASP.Net 4.0.
Use of Routing and the side effects
I did routing of two pages, one page has url profile.aspx?id=yJkl, i converted it into /profile/yJkl. But my paths of CSS, Images and JS got disturbed. I took help from a lot of sites and links and found ignore method, but it did not work.
I want to use URL Rewriting
Whenever i add / before any image source or javascript path, it starts working because it takes path from root, i know this. What i want is URL Rewrite, i want that all links of js, aspx, css, images, which were used in my aspx html pages should have a / as prefix in their path. Forexample if i have <img src='images/blabla.png' />, asp.net should auto convert it into <img src='/images/blabla.png'>.
Please tell me what to add in web.config or tell me if you have any solid solution of routing to ignore. I am newbie in routing/rewriting so forgive me if i asked anything stupid.
Use ResolveUrl or ResolveClientUrl
ResolveClientUrl("~/Images/Test.jpg"); //yields "../Images/Test.jpg"
Page.ResolveUrl("~/Images/Test.jpg"); //yields "/Images/Test.jpg"

Umbraco not allowing httphandler resized image to be input

I am attempting to move legacy content into Umbraco v4.9.1. Some of the photos that are being migrated are being resized using an httphandler (ImageResizer.ashx) using variables passed through the query. When I attempt to save the path the url is replaced with either "/" or what the path originally was. Is there a work around? The tag is below.
<img src="/imageresizer.ashx?mw=232&src=/imagePath/image.jpg" />
The url is correct, because if I type it into a browser the image comes up fine. It seems like Umbraco is filtering out this url.
UPDATE:
I am noticing that the editor is chopping off everything before /imagePath/image.jpg and only displaying that. I have tried turning off the TidyEditorContent in the UmbracoSettings.config and it still does this.
A workaround would be to UrlEncode the src part of these Urls, where "/" is replaced by "%2F".
<img src="/imageresizer.ashx?mw=232&src=%2FimagePath%2Fimage.jpg" />
I don't know if you can do this is your particular situation, but it is a workaround.

Why does my localhost image url change

I have a bunch of images in my localhost folder (C:\inetpub\wwwroot\Images) which I am trying to access within my ASP.net application. The image src generated in my markup is:
<img id="MainContent_MainImage" src="localhost/Images/FGOStuart_7166.jpg" />`
This fails to load the image and if I look at the source for the page it actually directs to
http://localhost:64395/Pages/localhost/Images/FGOStuart_7166.jpg
so it looks like it is trying to access a path relative to the page (on the Pages folder). The src works if I type it into the browser manually and the image is displayed.
Can anyone explain what's going on here and how to fix it? I'm attempting to move the images out of the database and onto the file system but without much luck so far.
That's because the browser assumes "localhost" is a folder and adds it to the current relative path. Add http to it and it should work fine, or remove localhost altogether and just leave the /Images... part.
Try it like this:
<img id="MainContent_MainImage" src="~/Images/FGOStuart_7166.jpg"
alt="An Image" runat="server" />
This resolves it server-side from the root down. And always use an alt :)
What you really want to be doing is using the magic tilde:
<img id="MainContent_MainImage" runat="server" src="~/Images/FGOStuart_7166.jpg" />
~ signifies the root of the application. Notice I added runat="server", too.

ASP.NET: question regarding reference paths

These are the three ways in which the same image has been referenced to in my project in 2-3 different files:
url(<% =QDAAB.Constants.SiteURL %>images/Docs/Plan/myImage.jpg)
url(~/images/Docs/Plan/myImage.jpg);
url(../images/Docs/Plan/myImage.jpg);
I am a bit confused about this relative, absolute path thingy. How do I refer to this image in such a way that no matter in what folder the image is located it is always displayed and never lost. Which of the above three references ways is right to achieve what I want? Or is there another way too to refer to an image?
Hope the question is clear.
I am beginner to .NET and have just begun trying out stuff.
Also what exactly do the above code lines mean? Like, what's this Constants.URL? What are "~" and ".." doing?
Here's where the image is being used in one of the pages. When I changed it to "../.." the image got displayed, earlier it wasn't.
<td align="center" style="background-image: url(../../images/Docs/Plans/myImage.jpg);
None of these will 'magically' find your image no matter in what folder the image is located. You will always have to give it some part of the path to the image in your links to have that image rendered.
However, out of these three, I would recommend the second line url(~/images/Docs/Plan/myImage.jpg); as the best way to accomplish what you need to do.
The '~' in .NET is a special character for the framework that starts your path at the root of your site. It essentially says, no matter what directory the request came from within the site, go to the root and start your path from there.
The '../' is standard HTML syntax meaning go up one directory and then start looking for your path.
So for instance, let's say your site is located at www.domain.com. And here is your folder structure
Images
Docs
Plan
CSS
Admin
SomeFolder
SomeFolderSubFolder
Default.aspx (your default document when you get to your site)
Examples
If you are in default.aspx, then the hand-coded URL to your images would be (/Images/Docs/Plan/myImage.jpg) as you are at the root of your site at this point.
If you are in SomeFolder, then the hand-coded URL to your images would be (../Images/Docs/Plan/myImage.jpg) since you have to go up 1 directory to get to the root of your site where the Images directory is located.
If you are in SomeFolderSubFolder, then the hand-coded URL to your images would be (../../Images/Docs/Plan/myImage.jpg) - as you would need to go up 2 directories to get to root of your site where your images folder is.
Now, by using the url(~/images/Docs/Plan/myImage.jpg); method, you do not have to worry about knowing how many directories deep you are in your site, it will always start looking from the site root. Each one of those examples above replaced with this line of code will always render out the image correctly.
EDIT
Ok, so you are trying this with in-line styles. You might/should be able to do this:
<td align="center" style="background-image: url(<%= Server.MapPath("~/images/Docs/Plans/myImage.jpg") %>);></td>
Or, there is nothing wrong with using the ../ method, you just need to keep in mind where you are at in your folder structure. Lastly, if you were to declare this style in your stylesheet instead of inline, it doesn't matter where the images are at in relation to the page, just where they are at in relation to the stylesheet FYI.
<td align="center" class="tdWithImages"></td>
styles.css
#tdWithImages{background-image: url(../Images/Docs/Plan/myImage.jpg);}

WebRequest retrieved site loads different then original

I am using WebRequest to retrieve a html page from the web and then displaying it using Response.Write.
The resulting page looks different from the original mostly in font and layout.
What could be the possible reasons and how to fix it?
Most probably, the HTML you retrieve contains relative URLs for loading images, stylesheets, scripts. These URLs are not correct for the page as you serve it from your site. You can fix this by converting all of the relative URLs into absolute URLs or by including a BASE tag in the head of the HTML, pointing to the URL of the original page.
Be advised though that deeplinking to images and other resources is considered bad practice. The source site may not like what you are doing.
The reason might be that the original html page contains relative (to the original site) paths to the stylesheet files so when you render the html in your site it cannot find the css.
Does the remote web site include CSS, JavaScript, or images?
If so, are any of the above resources referenced with relative links (i.e.: /javascript/script.js)?
If so, when the browser receives the HTML from your server, the relative links (which were originally relative to the source server) are now relative to your server.
You can fix this by either changing the HTML to use absolute links (i.e.: http://www.server.com/javascript/script.js). This is more complicated than it sounds: you'll need to catch <link href="..."/>, <a href="..."/>, <form action="..."/>, <script src="..."/>, <img src="..."/>, etc.
A more limited solution would be to place the actual resources onto your server in the same structure as they exist on the original server.
The remote site might look at the User-Agent and serve different content based on that.
Also, you should compare the HTML you can retrieve from the remote site, with the HTML you get by visiting the site in a browser. If they are not different, you are probably missing images and/or css and javascript, because of relative paths, as already suggested in another answer.

Resources