Reputation: 2159
I m building a Wen Application using Razor page (c#). So in my "_Layout.cshtml page" I m build this code:
<!DOCTYPE html>
<html style="height:110%;">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Title</title>
@Styles.Render("~/Content/css")
@Scripts.Render("~/bundles/modernizr")
<link href="https://fonts.googleapis.com/css?family=Roboto" rel="stylesheet">
<script src="../Scripts/jquery.min.js"></script>
<link href="../Content/jquery-ui.css" rel="stylesheet">
<script src="../Scripts/jquery-ui.min.js"></script>
</head>
<body style="width:100%;height:100%;">
<div class="container body-content">
@RenderBody()
</div>
</body>
</html>
So In my local pc, if I try to open Index Page, I can see this if I try to see Code of HTML page:
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Eresult srl</title>
<link href="/Content/bootstrap.css" rel="stylesheet"/>
<link href="/Content/site.css" rel="stylesheet"/>
<script src="/Scripts/modernizr-2.8.3.js"></script>
<link href="https://fonts.googleapis.com/css?family=Roboto" rel="stylesheet">
<script src="../Scripts/jquery.min.js"></script>
<link href="../Content/jquery-ui.css" rel="stylesheet">
<script src="../Scripts/jquery-ui.min.js"></script>
</head>
To see the index page on my local pc, I use this link "http:/localhost:9094/Pagina.aspx"
Now if I try to install this application on the server side, I have some problem of Graphic.
This is the url that I use: "http://url:9094/Questionario/Pagina.aspx"
This is the code that I can see if I see code of HTML page.
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Eresult srl</title>
<link href="/Questionario/Content/css?v=5h6Wc7kfOUsqxEEmYLsFbm8C9NAaEGNbzkeznwX1XR41" rel="stylesheet"/>
<script src="/Questionario/bundles/modernizr?v=inCVuEFe6J4Q07A0AcRsbJic_UE5MwpRMNGcOtk94TE1"></script>
<!--<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>-->
<!--<link href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/smoothness/jquery-ui.css" rel="stylesheet" />-->
<link href="https://fonts.googleapis.com/css?family=Roboto" rel="stylesheet">
<script src="../Scripts/jquery.min.js"></script>
<link href="../Content/jquery-ui.css" rel="stylesheet">
<script src="../Scripts/jquery-ui.min.js"></script>
</head>
As you can see on server side the system cannot load css and js file correctly.
Upvotes: 0
Views: 413
Reputation: 8311
You have to use relative paths all over your app especially when you deploy it to the server (like IIS):
~
won't work within static html code, therefore use:
<script src="@Url.Content("~/Scripts/jquery.min.js")"></script>
<link href="@Url.Content("~/Content/jquery-ui.css")" rel="stylesheet">
<script src="@Url.Content("~/Scripts/jquery-ui.min.js")"></script>
Upvotes: 1