How do I handle file paths in my code before moving to server host? - asp.net

In my webpages I have references to js and images as such:
"../../Content/Images/"Filename"
In my code if I reference a file as above, it doesnt work so i have to write:
"c:/miscfiles/"filename"
1-Why does the first reference work on webpages and not within the code?
2-How should i reference file paths in code so that I will not have to recode when moving to server?

See following for more details:
http://msdn.microsoft.com/en-us/library/ms178116.aspx

Don't use absolute paths in development - always use relative paths that are preceded with the application root token (the tilde or ~) like this:
"~/Content/Images/Filename"
ASP.NET will convert the ~ to the proper value based on the virtual directory or website the code is hosted in.

For ASP.NET 2.0 onwards, in order to get the tilda (~) syntax to resolve correctly on the server, you have to include a title and a runat attribute as follows:
<img src="~/images/image.jpg" title="Image" runat="server" />
The presence of the runat attribute ensures that the path is resolved on the server.

Related

CSS and image paths not working

Paths defined within master files are not working on a new server. They worked fine on production server and development machine. Here is an example of the file:
/HeadOffice/Styles/HeadOfficeCalendar.css
Unless I put full URL with the virtual name, the paths don't work.
working:
https://connect.server.co.uk/FesQA/HeadOffice/Styles/HeadOfficeCalendar.css
I can also include resolved URL within ASP>NET code tags but I don't want to change all those paths they are probably hundreds of them. so if the head office folder is in the same folder as master file it should just be able to reference like:
/HeadOffice/Styles/HeadOfficeCalendar.css
It seems the references within the master files and aspx files seems to work fine by adding ~ and runat = server. but images references within the CSS files are not working unless I include the full path.
DOESN'T WORK
url(/HeadOffice/Images/tlcorner.png)
DOES WORK
url(connect.server.co.uk/FesQA/HeadOffice/Images/tlcorner.png)
I know I've answered this before, but this has been known issue forever in VS.
Simple way to do this correctly is to drag the CSS file from Solution Explorer window to head section of master page in code view.
For other links on your site, make sure to include the runat="server" attribute and resolve your links like this (with "~" operator):
<img src="~/images/sample.jpg" runat="server" />

Understanding a url that references a CSS file in a SharePoint master page

For SharePoint, this is the entry you could put into your master page to link to a CSS file.
<SharePoint:CssRegistration
name="<% $SPUrl:~sitecollection/_catalogs/masterpage/dir/file.css %>"
runat="server"
after="SharepointCssFile"/>
Could someone please break down the pieces of this url? I don't understand the following parts of it and how they work together:
<% - I do know this means less than
$SPUrl:~sitecollection/ - Is this some kind of variable? What's ~ for?
%> - I do know this means greater than
CssRegistration is just one of the many ways of referencing CSS files in
SharePoint.
lower than (<) and greater than (>) obvious, and ~ refers to the root of the current web application.
CssRegistration is particularly interesting because you can use After to make sure your CSS is loaded after another CSS such as core.css
The real relevant parameter is name, which in this tag can be used with SPURL, which in turn can be used with sitecollection or site, to refer to the current sitecollection root, or just the current site/web.
Note that SPURL is only available on SharePoint Server, not Foundation.
To support Foundation you can use ProjectProperty, which takes Url or SiteUrl.
So to wrap up, SPUrl is a token available in SharePoint that we can use to specify a resource from a specific location, relative to the current page, web, site and others.

Link relative to Application root with client tag

Is there any way to link to the application root with the ~ character (or something similar) in a client tag (e.g. <link>)? I have some external stylesheets and scripts that I need to link to in a Master page, but I don't want to hardcode the path relative to the IIS site, I want to do it based on the relative application path.
Yes, use <link href="<%= ResolveUrl("~/meep/moop.css") %>" />.
Not the prettiest of solutions, but you should only use it a couple of times during development...
Rather than invoke ResolveUrl method, you could simply include the tilde and the runat attribute as follows:
My Link
This will resolve from the root always.

ASP.NET: urls in plain html files can't find app root

A client I'm working with insists on including a plain-jane html file in the ASP.NET app and I can't get the link urls to work properly. Here's an example:
<li><a class="nav_history2" href="/history.html">History</a></li>
It finds the server root (as I expect) but how to modify it to respect the app root? I'm looking for an equivalent to the ~. The client has tried ../ but claims it still finds the root. How is that possible? What SHOULD it look like please?
I don't have the ability to run it on his prod server, so I can't see the problem directly.
----- Edit -----
If I follow the suggestions given in the first two answers it will work if I turn the html page into an aspx, but so far not in the raw html file.
If I remember correctly, you just need to make ASP.NET actively aware of the tag, and the ~ symbol will work. Try:
<a class="nav_history2" runat="server" href="~/history.html">

How to create friendly url's in asp.net 2

I tried using the IHttpModule and managed to convert the urls just fine,
but all of my images returned path error (all going through the new url directory).
whats the solution?
You need to make sure that you use the "~/" path notation on your images and make sure that they are all server controls with runat='server'. Otherwise the images urls won't get rewritten.
For example if you have a page that gets rewritten from:
/Item/Bicycle.aspx
to
/Item.aspx?id=1234
Then what will happen is that an image reference like this:
<img src='images/something.gif' />
will break. So instead you have to do something like this:
<asp:image imageurl='~/images/something.gif' runat='server' id='img1'/>
Alternatively you can use absolute paths for your images. Or you can push as much as possible into your .css files.
You can try using a URL rewriter such as IIRF.
With IIRF you can use regular expressions to parse the incoming URL as you wish, then send it to the right place.
They have examples built in on how to do all that in the IIRF download.
What's the solution? Use the new routing engine in .NET 3.5 that started in the MVC project and got elevated to stand-alone status. :)
If Keltex's suggestion doesn't solve your specific problem look at ResolveUrl and ResolveClientUrl.

Resources