ASP.NET 4.0 Deployment Issue CSS / Javascript

I have created a small ASP .Net 4.5 application for a client which I have deployed to their server.

When the application is deployed to the client server, the css is not applied to the screens and javascript is not working either.

The clients server is a Windows Server 2008 R2 server and IIS is version 7.

Any help or advice would be greatly appreciated.

Code is listed below:

<!DOCTYPE html>
<html lang="en">
<head><meta charset="utf-8" /><title>
    Log in
</title><script src="/UmcDashboard/bundles/modernizr?v=jmdBhqkI3eMaPZJduAyIYBj7MpXrGd2ZqmHAOSNeYcg1"></script>
<link href="/UmcDashboard/Content/css?v=R7tMRBB8EvG-sAq1G9GPLSOfNpsUdVt2BDKTXrBboUg1" rel="stylesheet"/>
<link href="../favicon.ico" rel="shortcut icon" type="image/x-icon" /><meta name="viewport" content="width=device-width" /></head>
<body>
    <form method="post" action="Login.aspx?ReturnUrl=%2fUmcDashboard" onsubmit="javascript:return WebForm_OnSubmit();" id="ctl01">
<div class="aspNetHidden">
<input type="hidden" name="ctl08_HiddenField" id="ctl08_HiddenField" value="" />
<input type="hidden" name="__EVENTTARGET" id="__EVENTTARGET" value="" />
<input type="hidden" name="__EVENTARGUMENT" id="__EVENTARGUMENT" value="" />
<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="X/PrXVBXRj648w7TC6ht7amXKGcYUTtuIRfHi+jJnqCNeHPB+RC+5MN7lXWQsYvAGHnZc4GFo0gJgJf6O5F57FPnkx856OjmgrVge+SVcrKAM9Ss1mUmJBTGZf4GeyBIwSpsgcoxntEJDl5+C8h/S69Uz1h3UIRdkJtn0Ut8FEkhxJ09ZksX9a0M/5c/ESCewFwe/BPzeckstskezULt1ME7NYD4uF3OweYsuyuOMTL7qJt/XPz6dTEMETwIhAsMxMkA7y62w6uztsj+v6c03q9ICI7a2ViQ1d3/f/RIMQcyI1X/MpRlpwVP6cdjtCwT" />
</div>

<script type="text/javascript">
//<![CDATA[
var theForm = document.forms['ctl01'];
if (!theForm) {
    theForm = document.ctl01;
}
function __doPostBack(eventTarget, eventArgument) {
    if (!theForm.onsubmit || (theForm.onsubmit() != false)) {
        theForm.__EVENTTARGET.value = eventTarget;
        theForm.__EVENTARGUMENT.value = eventArgument;
        theForm.submit();
    }
}
//]]>
</script>


<script src="/UmcDashboard/WebResource.axd?d=pynGkmcFUV13He1Qd6_TZC0itZSQ0gdC6rM1cTDLkhXQkqBs8vcEUYGxjW3G_UlqGyzCShtM_WOfFbVmSDqIwA2&amp;t=634773866700000000" type="text/javascript"></script>


<script src="/UmcDashboard/ScriptResource.axd?d=nv7asgRUU0tRmHNR2D6t1E097zp5q6ASuVO_NvVVES9ARDjdENBrgQSxWwB3uWl4y3kAg1I3muUX35kS0cxi4of4O1yiJ7p9Eb8ue-b_QWQehLHDV-vkZXVEefEhHB_HMuiuC5VZuEied1NgnR23DA2&amp;t=ffffffffdf4c7f25" type="text/javascript"></script>
<script src="/UmcDashboard/ScriptResource.axd?d=x6wALODbMJK5e0eRC_p1Le6JxhuIS2MLNuH3Qlo-s18bUt5DAKao4jMh-P6xYQ6CpcmSKTOw7RDwOdZbolz4CAMqtE6lYH4RL_lyIg_qfBT3kZhHV1dmqwfOIJ_HveLg0&amp;t=7a2ecbb7" type="text/javascript"></script>
<script src="/UmcDashboard/ScriptResource.axd?d=P5lTttoqSeZXoYRLQMIScLO_IGK9f9WiZHHvmSCixGXPkFBZYW9OV3bZYPv8ydKcRpuDkSp2SW3USQ1oCeje17QEcAp6MIqmzxfUxr_NmJZiXcuGo1Wg0axAk3moOAUa0&amp;t=7a2ecbb7" type="text/javascript"></script>
<script src="../Scripts/jquery-1.7.1.min.js" type="text/javascript"></script>
<script src="../Scripts/jquery-ui-1.8.20.min.js" type="text/javascript"></script>
<script src="/UmcDashboard/bundles/WebFormsJs?v=q9E9g87bUDaS624mcBuZsBaM8xn2E5zd-f4FCdIk2cA1" type="text/javascript"></script>
<script type="text/javascript">
//<![CDATA[
function WebForm_OnSubmit() {
if (typeof(ValidatorOnSubmit) == "function" && ValidatorOnSubmit() == false) return false;
return true;
}
//]]>
</script>

<div class="aspNetHidden">

    <input type="hidden" name="__EVENTVALIDATION" id="__EVENTVALIDATION" value="v59u+dgHdVImvalqQpn+eUQMJmO43qxrPx50v0ifATzQdHQVd1J+bf71jTw+7sc3igXvXHKDyzt/1swIEszxECv9zb0mkG6/JdKwv8Dj69GtJ4F3v0HW73YLF6uZ0v440Xw5IEAYzgNpD7icMSrYRXITx9xsphq5KlhKtumarKRTMRZp/34mwXiKmDNq+xDR" />
</div>
        <script type="text/javascript">
//<![CDATA[
Sys.WebForms.PageRequestManager._initialize('ctl00$ctl08', 'ctl01', [], [], [], 90, 'ctl00');
//]]>
</script>

    <header>
        <div class="content-wrapper">
            <div class="float-left">
                <p class="site-title">
                    <a href="../">UMC - Intake Arrivals</a>
                </p>
            </div>
            <div class="float-right">


            </div>
        </div>
    </header>
    <div id="body">

        <section class="content-wrapper main-content clear-fix">

    <hgroup class="title">
        <h1>Log in.</h1>
    </hgroup>
    <section id="loginForm">

                <p class="validation-summary-errors">

                </p>
                <fieldset>
                    <legend>Log in Form</legend>
                    <ol>
                        <li>
                            <label for="MainContent_LogInControl_UserName">User name</label>
                            <input name="ctl00$MainContent$LogInControl$UserName" type="text" id="MainContent_LogInControl_UserName" />
                            <span data-val-controltovalidate="MainContent_LogInControl_UserName" data-val-errormessage="The user name field is required." id="MainContent_LogInControl_ctl02" class="field-validation-error" data-val="true" data-val-evaluationfunction="RequiredFieldValidatorEvaluateIsValid" data-val-initialvalue="" style="visibility:hidden;">The user name field is required.</span>
                        </li>
                        <li>
                            <label for="MainContent_LogInControl_Password">Password</label>
                            <input name="ctl00$MainContent$LogInControl$Password" type="password" id="MainContent_LogInControl_Password" />
                            <span data-val-controltovalidate="MainContent_LogInControl_Password" data-val-errormessage="The password field is required." id="MainContent_LogInControl_ctl04" class="field-validation-error" data-val="true" data-val-evaluationfunction="RequiredFieldValidatorEvaluateIsValid" data-val-initialvalue="" style="visibility:hidden;">The password field is required.</span>
                        </li>
                        <li>
                            <input id="MainContent_LogInControl_RememberMe" type="checkbox" name="ctl00$MainContent$LogInControl$RememberMe" />
                            <label for="MainContent_LogInControl_RememberMe" class="checkbox">Remember me?</label>
                        </li>
                    </ol>
                    <input type="submit" name="ctl00$MainContent$LogInControl$ctl06" value="Log in" onclick="javascript:WebForm_DoPostBackWithOptions(new WebForm_PostBackOptions(&quot;ctl00$MainContent$LogInControl$ctl06&quot;, &quot;&quot;, true, &quot;&quot;, &quot;&quot;, false, false))" />
                </fieldset>

    </section>



        </section>
    </div>
    <footer>
        <div class="content-wrapper">
            <div class="float-left">
                <p>&copy; 2013 - Created by <a href="http://www.mcsgroup.co.uk">MCS</a></p>
            </div>
        </div>
    </footer>


<script type="text/javascript">
//<![CDATA[
(function() {var fn = function() {$get("ctl08_HiddenField").value = '';Sys.Application.remove_init(fn);};Sys.Application.add_init(fn);})();//]]>
</script>
</form>
</body>
</html>

回答1:

Please check the console and resolve the error. I think you have hardcode the CSS and JS Path

回答2:

It is always good to place the CSS/JS files in a publicly accessible folder. In my case, FormsAuthentication restricted access to such resources.

Change your web.config to make your resource files : CSS , JS publicly accessible. for example::

<location path="~/Resources/Css">
    <system.web>
        <authorization>
            <allow users="*"/>
        </authorization>
    </system.web>
</location>

One more solution is to check the account used by Anonymous Access. If it is using the IUSR account not the IIS_IUSRS account, add IUSR to the website folder.