Asp.net: relative paths not working when deployed IIS - c#

I spent almost 2-3 good hours on this and im here now, as the question states. The project works fine in VS but when I deploy/publish it through IIS (to access it on local network) some files (well most of them) aren't accessible. This happened when I added the Metronic theme within my web project. The files are like:
<!-- BEGIN GLOBAL MANDATORY STYLES -->
<link href="http://fonts.googleapis.com/css?family=Open+Sans:400,300,600,700&subset=all" rel="stylesheet" type="text/css" />
<link href="../../assets/global/plugins/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css" />
<link href="../../assets/global/plugins/simple-line-icons/simple-line-icons.min.css" rel="stylesheet" type="text/css" />
<link href="../../assets/global/plugins/bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
<link href="../../assets/global/plugins/bootstrap-switch/css/bootstrap-switch.min.css" rel="stylesheet" type="text/css" />
<!-- END GLOBAL MANDATORY STYLES -->
OR
<img src="../assets/pages/img/logo.png" alt="place Logo Here" />
Now once its published, it throws me a pile of errors that it could not find any of those files.
Notice: the url in both the pictures, the deployed project is under another folder. is it the culprit?
I am trying to figure out a solution that works for both VS debugging and the deployed project.
What I have tried is:
1: https://weblogs.asp.net/scottgu/tip-trick-how-to-run-a-root-site-with-the-local-web-server-using-vs-2005-sp1
2: Deploying asp.net application to root directory in IIS
3: How to avoid deploying ASP.NET MVC3 application in subpath on IIS 7.5
4: ASP.NET WebForms: Why do relative paths within user controls work locally, but not when deployed?
5: IIS virtual directory and ASP.NET directory paths
6: Relative path from site root

You might want to use absolute paths starting with '~/' as the base directory of your Web Site / Web App.
e.g. "~/assets/pages/img/logo.png"
and when working in Code Behind use the
Server.MapPath("~/")
as Base Folder.

g2 is the folder that I created inside wwwroot which has the published files
If your intent was to make that a "sub application" (of whatever is the "parent" in wwwroot then it can be a "virtual directory" or a "sub application"
If your intent was to publish it as it's own application, separate from any other, then you don't have to publish it under wwwroot. You create new IIS sites.
The previous answer using ~/ is based on what is defined as the application root
Hth...

Related

ASP.NET Core 6 MVC not loading CSS styles

In my ASP.NET Core 6 MVC project, the .css file is not working in the view file.
I ran .NET externally as html file and it worked without any problems.
In my ASP.NET Core 6 MVC project, the .css file is not working in the
view file.
As you may know, Static files are stored within the project's web root directory.And the default directory is {content root}/wwwroot, You can refer to the official document here about static files.
Inside wwwroot:
Thus, You need to put your css files either in folder into wwwroot like following:
Then try to use:
<link rel="stylesheet" href="~/css/site.css" asp-append-version="true" />
In Program.cs file include the reference:
app.UseStaticFiles();
Outside wwwroot:
Furthermore, if you want to serve files outside of the web root in that scenario, Consider below directory hierarchy :
Program.cs
Include reference as following in your program.cs file:
app.UseStaticFiles(new StaticFileOptions
{
FileProvider = new PhysicalFileProvider(
Path.Combine(builder.Environment.ContentRootPath, "StaticFilesFolderName")),
RequestPath = "/StaticFilesFolderName"
});
Use Reference:
<link rel="stylesheet" href="~/StaticFilesFolderName/site.css" asp-append-version="true" />
Note:
As per your scenario, it would be AdminLTE... so on and follow the accurate path. For more details and example please have a look our official document here.

Why bootstrap isn't loaded Quick Install Package

I'm building the ASP.Net Core Web Application
I installed bootstrap using Quick Install Package. So now I have it in my dependencies:
Also, there's a folder "node_modules" with bootstrap and everything is fine there, all classes are where they're supposed to be:
Then I created a view and in html wrote the following:
<link rel="stylesheet" href="node_modules/bootstrap/dist/css/bootstrap.css" />
When I hover the mouse over the href, I see a warning:
Path C:\Users\Shep\SportsStore\SportsStore\wwwroot\~node_modules not found
Well, it's true, because there's no such folder, but how to keep it from looking in wwwroot and use the specified folder? My wwwroot is empty, I guess it's because I didn't use bower
If I use the full path (href="C:/Users/Shep/SportsStore/SportsStore/node_modules/bootstrap/dist/css/bootstrap.css"), it seems right, but I bootstrap classes are unavailable:
<body>
<div class="panel-info">
</div>
</body>
and if I hover the mouse over, I see "Unknown CSS class 'panel-info'" even though there's this class in bootstrap.css
.panel-info {
border-color: #bce8f1;
}
I'm not using Angular and haven't created any js files of my own yet.
I have seen lots of similar issues and haven't found suitable solution, sorry if it's a duplicate
In ASP.NET Core, the runtime supports a piece of middleware called StaticFiles that allows anything in the /wwwroot folder to be accessible from the browser. But since the node_modules directory is outside of /wwwroot ,that problem occurs .
You can use Library Manager/Bundler and Minifier to copy the files into wwwroot . There are a lot of solutions you could find from here .

What are the mechanics of producing bundled js and css files with master pages?

I have a .NET Core project in which the master page _Layout.cshtml page references site wide style and js files:
<link rel="stylesheet" href="~/css/site.css" />
<script src="~/js/site.js" asp-append-version="true"></script>
The Index.cshtml page, which utilizes the above master page, references page specific style and js files:
<link type="text/css" rel="stylesheet" href="~/css/landing.css">
<script src="~/js/landing.js" asp-append-version="true"></script>
And then Contact.cshtml and About.cshtml also have page specific css and js files.
What is the correct method to bundle the site wide files with page specific files?
Should I avoid referencing anything the in the master page and simply reference the bundled file in each page's .cshtml?
You reference in your Master Page all scripts and Style Sheets you share across pages. For instance, you could reference only jquery.
You reference in your pages scripts and styles that are used specific on that pages.
It sounds simple like that.

Webform in subfolder using master page

Currently all of my web-form files (.aspx) are in root folder of my project (VS 2012).
I created a new folder name "pages" and add a new webform to it (WebForm1), using master page. When I run this page, its address is localhost:49217/pages/WebForm1.aspx which is correct, problems are:
All of links now have been added the word "pages", for example the correct link should be localhost:49217/Contact.aspx now became: localhost:49217/pages/Contact.aspx
The CSS look weird, kind of missing some css files (the path is wrong).
The CSS code in master page, css files are in css folder:
<link rel="stylesheet" href="css/reset.css" type="text/css" media="screen">
<link rel="stylesheet" href="css/style.css" type="text/css" media="screen">
<link rel="stylesheet" href="css/grid.css" type="text/css" media="screen">
If I add a new webform in root folder, everything is fine, but if I do that in a subfolder, everything is messed up.
EDIT:
CSS has been fixed, thanks for everybody.
Still the "pages" not fixed, it is added in all the links (of the master page)
When referencing style sheets or java script files inside of a master page I usually do the following:
<link href="<%= ResolveUrl("~/css/reset.css") %>" rel="stylesheet" />
<script type="text/javascript" src='<%= ResolveUrl("~/js/master.js") %>'></script>
This will work if you are debugging on your local, deploying to a web server in a virtual directory or if you deploy to the website root.
Your paths are relative to the current directory, you need to prefix them with a slash so that they always reference the root directory. Like this:
<link rel="stylesheet" href="/css/reset.css" type="text/css" media="screen">
<link rel="stylesheet" href="/css/style.css" type="text/css" media="screen">
<link rel="stylesheet" href="/css/grid.css" type="text/css" media="screen">
You'll also have to do the same thing to your image paths.

Render bundled scripts from app in Virtual Directory (VD) to an app in another VD

I have 2 projects ABC and XYZ created as 2 separate Virtual Directories in IIS (7). Now my problem is I have many .JS (script) files in project XYZ that need to be bundled and minfied and rendered in an aspx page (containing HTML code) that is available in project ABC. Is this possible ?
Note: Using Microsoft ASP.NET Web Optimization Framework 1.1.1
[http://www.nuget.org/packages/microsoft.aspnet.web.optimization/]
Yes, just use the correct link to the bundle in your other project.
If you bundle is for example defines as
bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
"~/Scripts/jquery-{version}.js"));
which can get accessed via
#Scripts.Render("~/bundles/jquery")
you can use
<script src='http://<host>/<site>/bundles/jquery' type='text/javascript' language='javascript' />
Just as simple as that.
If you have both applications installed on the same website (same root), you can also use relative URLs, e.g.
<script src='/XYZ/bundles/jquery' type='text/javascript' language='javascript' />

Categories