图像，CSS和JS未在MVC4应用程序中加载
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了图像，CSS和JS未在MVC4应用程序中加载相关的知识，希望对你有一定的参考价值。
我刚刚在我的服务器上部署了一个新的MVC4应用程序，并且没有加载一些CSS，JS和图像。例如，Chrome控制台说，
无法加载资源：服务器响应状态为500（内部服务器错误）http://beta.vinformative.com/Content/themes/base/jquery-ui-1.8.20.custom.css
无法加载资源：服务器响应状态为500（内部服务器错误）http://beta.vinformative.com/Content/select2.css
无法加载资源：服务器响应状态为500（内部服务器错误）http://beta.vinformative.com/Scripts/Plugins/select2.js
无法加载资源：服务器响应状态为500（内部服务器错误）http://beta.vinformative.com/Scripts/WineCreate.js
无法加载资源：服务器响应状态为500（内部服务器错误）http://beta.vinformative.com/Content/images/logo_revisedsmall.png
它们都在他们提到的位置的服务器上提供。我整晚都在排除其他事情，所以我的眼睛有点模糊，也许我错过了一些明显的东西。你也可以在beta.vinformative.com的主页上看到这些错误。
以下是我的文件布局的截图：
我正在使用捆绑并在发布模式下将网站发布到文件系统，但我不希望这会影响图像，不是吗？我将继续这一点，但任何帮助将不胜感激！谢谢！
编辑请求捆绑配置：谢谢！
public class BundleConfig
{
// For more information on Bundling, visit http://go.microsoft.com/fwlink/?LinkId=254725
public static void RegisterBundles(BundleCollection bundles)
{
bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
"~/Scripts/Libraries/jquery-{version}.js",
"~/Scripts/Plugins/jquery.loaderbutton.js",
"~/Scripts/Plugins/jquery.form.js"));
bundles.Add(new ScriptBundle("~/bundles/base").Include(
"~/Scripts/Feedback.js",
"~/Scripts/Global.js",
"~/Scripts/WineSearch.js"
));
bundles.Add(new ScriptBundle("~/bundles/jqueryui").Include(
"~/Scripts/Libraries/jquery-ui-{version}.js"));
bundles.Add(new ScriptBundle("~/bundles/jqueryval").Include(
"~/Scripts/Libraries/jquery.validate*"));
bundles.Add(new ScriptBundle("~/bundles/bootstrap").Include(
"~/Scripts/bootstrap/bootstrap.js",
"~/Scripts/bootstrap/bootbox.js",
"~/Scripts/bootstrap/bootstrap-notify.js"
));
bundles.Add(new ScriptBundle("~/bundles/formhelpers").Include(
"~/Scripts/bootstrap/Form Helpers/bootstrap-formhelpers-countries.js",
"~/Scripts/bootstrap/Form Helpers/bootstrap-formhelpers-countries.en_US.js",
"~/Scripts/bootstrap/Form Helpers/bootstrap-formhelpers-phone.js",
"~/Scripts/bootstrap/Form Helpers/bootstrap-formhelpers-phone.format.js",
"~/Scripts/bootstrap/Form Helpers/bootstrap-formhelpers-states.js",
"~/Scripts/bootstrap/Form Helpers/bootstrap-formhelpers-states.en_US.js"
));
bundles.Add(new ScriptBundle("~/bundles/winedetails").Include(
"~/Scripts/WineDetails.js",
"~/Scripts/Plugins/jquery.uploadifive.js",
"~/Scripts/Plugins/jquery.fileDownload.js",
"~/Scripts/Plugins/jquery.fancybox.js",
"~/Scripts/Plugins/jquery.fancybox-media.js",
"~/Scripts/Plugins/jquery.nailthumb.1.1.js",
"~/Scripts/Plugins/jquery.lazyload.js"
));
// Use the development version of Modernizr to develop with and learn from. Then, when you're
// ready for production, use the build tool at http://modernizr.com to pick only the tests you need.
bundles.Add(new ScriptBundle("~/bundles/modernizr").Include(
"~/Scripts/modernizr-*"));
bundles.Add(new StyleBundle("~/Content/css").Include("~/Content/site.css", "~/Content/slideout.css"));
bundles.Add(new StyleBundle("~/Content/themes/bootstrap/css").Include(
"~/Content/themes/bootstrap/bootstrap.css",
"~/Content/themes/bootstrap/bootstrap-responsive.css",
"~/Content/themes/bootstrap/bootstrapSwitch.css",
"~/Content/themes/bootstrap/bootstrap-notify.css",
"~/Content/themes/bootstrap/bootstrap-formhelpers.css"
));
bundles.Add(new StyleBundle("~/Content/datatables").Include(
"~/Content/jquery.dataTables.css",
"~/Content/jquery.dataTables_themeroller.css"));
bundles.Add(new StyleBundle("~/Content/css").Include("~/Content/chosen.css"));
bundles.Add(new StyleBundle("~/Content/sitewide").Include(
"~/Content/themes/base/jquery.ui.autocomplete.css",
"~/Content/Site.css"
));
bundles.Add(new StyleBundle("~/Content/winedetails").Include(
"~/Content/uploadifive.css",
"~/Content/themes/fancybox/jquery.fancybox.css"
));
bundles.Add(new StyleBundle("~/Content/themes/base/css").Include(
"~/Content/themes/base/jquery.ui.core.css",
"~/Content/themes/base/jquery.ui.resizable.css",
"~/Content/themes/base/jquery.ui.selectable.css",
"~/Content/themes/base/jquery.ui.accordion.css",
"~/Content/themes/base/jquery.ui.autocomplete.css",
"~/Content/themes/base/jquery.ui.button.css",
"~/Content/themes/base/jquery.ui.dialog.css",
"~/Content/themes/base/jquery.ui.slider.css",
"~/Content/themes/base/jquery.ui.tabs.css",
"~/Content/themes/base/jquery.ui.datepicker.css",
"~/Content/themes/base/jquery.ui.progressbar.css",
"~/Content/themes/base/jquery.ui.theme.css"));
}
}
编辑＃2
我试图在我的_layout视图中更改我的引用而没有运气：
从
<link href="../../Content/themes/base/jquery-ui-1.8.20.custom.css" rel="stylesheet"
to
<link href="@Url.Content("~/Content/themes/base/jquery-ui-1.8.20.custom.css")" rel="stylesheet">
编辑＃3 Web.config
<?xml version="1.0" encoding="utf-8"?>
<!--
For more information on how to configure your ASP.NET application, please visit
http://go.microsoft.com/fwlink/?LinkId=169433
-->
<configuration>
<configSections>
<!-- For more information on Entity Framework configuration, visit http://go.microsoft.com/fwlink/?LinkID=237468 -->
<section name="entityFramework" type="System.Data.Entity.Internal.ConfigFile.EntityFrameworkSection, EntityFramework, Version=4.4.0.0, Culture=neutral, PublicKeyToken=b77a5c561934e089" requirePermission="false" />
<sectionGroup name="dotNetOpenAuth" type="DotNetOpenAuth.Configuration.DotNetOpenAuthSection, DotNetOpenAuth.Core">
<section name="messaging" type="DotNetOpenAuth.Configuration.MessagingElement, DotNetOpenAuth.Core" requirePermission="false" allowLocation="true" />
<section name="reporting" type="DotNetOpenAuth.Configuration.ReportingElement, DotNetOpenAuth.Core" requirePermission="false" allowLocation="true" />
<section name="openid" type="DotNetOpenAuth.Configuration.OpenIdElement, DotNetOpenAuth.OpenId" requirePermission="false" allowLocation="true" />
<section name="oauth" type="DotNetOpenAuth.Configuration.OAuthElement, DotNetOpenAuth.OAuth" requirePermission="false" allowLocation="true" />
</sectionGroup>
<sectionGroup name="elmah">
<section name="security" requirePermission="false" type="Elmah.SecuritySectionHandler, Elmah" />
<section name="errorLog" requirePermission="false" type="Elmah.ErrorLogSectionHandler, Elmah" />
<section name="errorMail" requirePermission="false" type="Elmah.ErrorMailSectionHandler, Elmah" />
<section name="errorFilter" requirePermission="false" type="Elmah.ErrorFilterSectionHandler, Elmah" />
</sectionGroup>
<section name="web.optimization" type="Web.Optimization.Configuration.OptimizationSection" />
<!-- For more information on Entity Framework configuration, visit http://go.microsoft.com/fwlink/?LinkID=237468 -->
<!-- For more information on Entity Framework configuration, visit http://go.microsoft.com/fwlink/?LinkID=237468 -->
</configSections>
<connectionStrings>
<add name="Elmah" connectionString="Data Source=.SQLEXPRESS;Initial Catalog=elmah;Integrated Security=True" providerName="System.Data.SqlClient" />
<add name="vfContext" connectionString="Data Source=.SQLEXPRESS;Initial Catalog=vf3;Integrated Security=SSPI" providerName="System.Data.SqlClient" />
</connectionStrings>
<appSettings>
<add key="webpages:Version" value="2.0.0.0" />
<add key="webpages:Enabled" value="false" />
<add key="PreserveLoginUrl" value="true" />
<add key="ClientValidationEnabled" value="true" />
<add key="UnobtrusivejavascriptEnabled" value="true" />
</appSettings>
<system.web>
<customErrors mode="On" defaultRedirect="~/Error/Generic">
<error statusCode="404" redirect="~/Error/NotFound" />
<error statusCode="500" redirect="~/Error/internal" />
</customErrors>
<compilation debug="true" targetFramework="4.0" />
<authentication mode="Forms">
<forms loginUrl="~/Account/Login" timeout="2880" />
</authentication>
<pages>
<namespaces>
<add namespace="System.Web.Helpers" />
<add namespace="System.Web.Mvc" />
<add namespace="System.Web.Mvc.Ajax" />
<add namespace="System.Web.Mvc.html" />
<add namespace="System.Web.Optimization" />
<add namespace="System.Web.Routing" />
<add namespace="System.Web.WebPages" />
</namespaces>
</pages>
<httpModules>
<add name="ErrorLog" type="Elmah.ErrorLogModule, Elmah" />
<add name="ErrorMail" type="Elmah.ErrorMailModule, Elmah" />
<add name="ErrorFilter" type="Elmah.ErrorFilterModule, Elmah" />
</httpModules>
</system.web>
<system.webServer>
<validation validateIntegratedModeConfiguration="false" />
<modules runAllManagedModulesForAllRequests="true">
<add name="ErrorLog" type="Elmah.ErrorLogModule, Elmah" preCondition="managedHandler" />
<add name="ErrorMail" type="Elmah.ErrorMailModule, Elmah" preCondition="managedHandler" />
<add name="ErrorFilter" type="Elmah.ErrorFilterModule, Elmah" preCondition="managedHandler" />
<remove name="BundleModule" />
<add name="BundleModule" type="System.Web.Optimization.BundleModule" />
</modules>
<handlers>
<remove name="ExtensionlessUrlHandler-ISAPI-4.0_32bit" />
<remove name="ExtensionlessUrlHandler-ISAPI-4.0_64bit" />
<remove name="ExtensionlessUrlHandler-Integrated-4.0" />
<add name="ExtensionlessUrlHandler-ISAPI-4.0_32bit" path="*." verb="GET,HEAD,POST,DEBUG,PUT,DELETE,PATCH,OPTIONS" modules="IsapiModule" scriptProcessor="%windir%Microsoft.NETFrameworkv4.0.30319aspnet_isapi.dll" preCondition="classicMode,runtimeVersionv4.0,bitness32" responseBufferLimit="0" />
<add name="ExtensionlessUrlHandler-ISAPI-4.0_64bit" path="*." verb="GET,HEAD,POST,DEBUG,PUT,DELETE,PATCH,OPTIONS" modules="IsapiModule" scriptProcessor="%windir%Microsoft.NETFramework64v4.0.30319aspnet_isapi.dll" preCondition="classicMode,runtimeVersionv4.0,bitness64" responseBufferLimit="0" />
<add name="ExtensionlessUrlHandler-Integrated-4.0" path="*." verb="GET,HEAD,POST,DEBUG,PUT,DELETE,PATCH,OPTIONS" type="System.Web.Handlers.TransferRequestHandler" preCondition="integratedMode,runtimeVersionv4.0" />
</handlers>
<staticContent>
<mimeMap fileExtension=".mp4" mimeType="video/mp4" />
<mimeMap fileExtension=".m4v" mimeType="video/m4v" />
<mimeMap fileExtension=".ogg" mimeType="video/ogg" />
<mimeMap fileExtension=".ogv" mimeType="video/ogg" />
<mimeMap fileExtension=".webm" mimeType="video/webm" />
<mimeMap fileExtension=".oga" mimeType="audio/ogg" />
<mimeMap fileExtension=".spx" mimeType="audio/ogg" />
<mimeMap fileExtension=".svg" mimeType="image/svg+xml" />
<mimeMap fileExtension=".svgz" mimeType="image/svg+xml" />
<remove fileExtension=".eot" />
<mimeMap fileExtension=".eot" mimeType="application/vnd.ms-fontobject" />
<mimeMap fileExtension=".otf" mimeType="font/otf" />
<mimeMap fileExtension=".woff" mimeType="font/x-woff" />
<remove fileExtension=".manifest" />
<mimeMap fileExtension=".manifest" mimeType="text/cache-manifest" />
</staticContent>
</system.webServer>
<runtime>
<assemblyBinding xmlns="urn:schemas-microsoft-com:asm.v1">
<dependentAssembly>
<assemblyIdentity name="System.Web.Helpers" publicKeyToken="31bf3856ad364e35" />
<bindingRedirect oldVersion="1.0.0.0-2.0.0.0" newVersion="2.0.0.0" />
</dependentAssembly>
<dependentAssembly>
<assemblyIdentity name="System.Web.Mvc" publicKeyToken="31bf3856ad364e35" />
<bindingRedirect oldVersion="0.0.0.0-4.0.0.0" newVersion="4.0.0.0" />
</dependentAssembly>
<dependentAssembly>
<assemblyIdentity name="System.Web.WebPages" publicKeyToken="31bf3856ad364e35" />
<bindingRedirect oldVersion="1.0.0.0-2.0.0.0" newVersion="2.0.0.0" />
</dependentAssembly>
<dependentAssembly>
<assemblyIdentity name="DotNetOpenAuth.AspNet" publicKeyToken="2780ccd10d57b246" culture="neutral" />
<bindingRedirect oldVersion="0.0.0.0-4.2.0.0" newVersion="4.2.0.0" />
</dependentAssembly>
<dependentAssembly>
<assemblyIdentity name="DotNetOpenAuth.Core" publicKeyToken="2780ccd10d57b246" culture="neutral" />
<bindingRedirect oldVersion="0.0.0.0-4.2.0.0" newVersion="4.2.0.0" />
</dependentAssembly>
<dependentAssembly>
<assemblyIdentity name="RazorEngine" publicKeyToken="9ee697374c7e744a" culture="neutral" />
<bindingRedirect oldVersion="0.0.0.0-3.0.8.0" newVersion="3.0.8.0" />
</dependentAssembly>
<dependentAssembly>
<assemblyIdentity name="System.Web.Razor" publicKeyToken="31bf3856ad364e35" culture="neutral" />
<bindingRedirect oldVersion="0.0.0.0-2.0.0.0" newVersion="2.0.0.0" />
</dependentAssembly>
<dependentAssembly>
<assemblyIdentity name="WebGrease" publicKeyToken="31bf3856ad364e35" culture="neutral" />
<bindingRedirect oldVersion="0.0.0.0-1.3.0.0" newVersion="1.3.0.0" />
</dependentAssembly>
<dependentAssembly>
<assemblyIdentity name="Newtonsoft.Json" publicKeyToken="30ad4fe6b2a6aeed" culture="neutral" />
<bindingRedirect oldVersion="0.0.0.0-4.5.0.0" newVersion="4.5.0.0" />
</dependentAssembly>
</assemblyBinding>
<legacyHMACWarning enabled="0" />
</runtime>
<entityFramework>
<defaultConnectionFactory type="System.Data.Entity.Infrastructure.SqlConnectionFactory, EntityFramework" />
</entityFramework>
<system.net>
<defaultProxy enabled="true" />
<mailSettings>
<smtp from="mailer@vinformative.com">
<network host="smtp.emailsrvr.com" port="2525" userName="mailer@vinformative.com" password="vinf0rmat1ve" />
</smtp>
</mailSettings>
<settings>
<!-- This setting causes .NET to check certificate revocation lists (CRL)
before trusting HTTPS certificates. But this setting tends to not
be allowed in shared hosting environments. -->
<!--<servicePointManager checkCertificateRevocationList="true"/>-->
</settings>
</system.net>
<dotNetOpenAuth>
<messaging>
<untrustedWebRequest>
<whitelistHosts>
<!-- Uncomment to enable communication with localhost (should generally not activate in production!) -->
<!--<add name="localhost" />-->
</whitelistHosts>
</untrustedWebRequest>
</messaging>
<!-- Allow DotNetOpenAuth to publish usage statistics to library authors to improve the library. -->
<reporting enabled="true" />
<openid>
<relyingParty>
<security requireSsl="false">
<!-- Uncomment the trustedProviders tag if your relying party should only accept positive assertions from a closed set of OpenID Providers. -->
<!--<trustedProviders rejectAssertionsFromUntrustedProviders="true">
<add endpoint="https://www.google.com/accounts/o8/ud" />
</trustedProviders>-->
</security>
<behaviors>
<!-- The following OPTIONAL behavior allows RPs to use SREG only, but be compatible
with OPs that use Attribute Exchange (in various formats). -->
<add type="DotNetOpenAuth.OpenId.RelyingParty.Behaviors.AXFetchAsSregTransform, DotNetOpenAuth.OpenId.RelyingParty" />
</behaviors>
</relyingParty>
</openid>
</dotNetOpenAuth>
<uri>
<!-- The uri section is necessary to turn on .NET 3.5 support for IDN (international domain names),
which is necessary for OpenID urls with unicode characters in the domain/host name.
It is also required to put the Uri class into RFC 3986 escaping mode, which OpenID and OAuth require. -->
<idn enabled="All" />
<iriParsing enabled="true" />
</uri>
<elmah>
<!--
See http://code.google.com/p/elmah/wiki/SecuringErrorLogPages for
more information on remote access and securing ELMAH.
-->
<errorLog type="Elmah.SqlErrorLog, Elmah" connectionStringName="Elmah"></errorLog>
<errorMail from="mailer@vinformative.com" to="support@vinformative.com" subject="ELMAH Error Log Mail"></errorMail>
<security allowRemoteAccess="false" />
</elmah>
<location path="elmah.axd" inheritInChildApplications="false">
<system.web>
<httpHandlers>
<add verb="POST,GET,HEAD" path="elmah.axd" type="Elmah.ErrorLogPageFactory, Elmah" />
</httpHandlers>
<!--
See http://code.google.com/p/elmah/wiki/SecuringErrorLogPages for
more information on using ASP.NET authorization securing ELMAH.
<authorization>
<allow roles="admin" />
<deny users="*" />
</authorization>
-->
</system.web>
<system.webServer>
<handlers>
<add name="ELMAH" verb="POST,GET,HEAD" path="elmah.axd" type="Elmah.ErrorLogPageFactory, Elmah" preCondition="integratedMode" />
</handlers>
</system.webServer>
</location>
<web.optimization>
<bundles>
<bundle virtualPath="~/Content/sample" transform="System.Web.Optimization.JsMinify, System.Web.Optimization">
<content>
<!-- Add some single files -->
<!-- <add path="~/Scripts/validation.js" /> -->
<!-- <add path="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.7.2.min.js" /> -->
<!-- Add a directory (and its subdirectories) -->
<!-- <add path="~/Scripts/Plugins" searchPattern="*.js" searchSubdirectories="true" /> -->
</content>
<!--
If you want to apply multiple transformations,
you should remove the "transform" attribute from the bundle.
-->
<!--
<transformations>
<add type="Web.Optimization.Bundles.CoffeeScript.CoffeeScriptTransform, Web.Optimization.Bundles.CoffeeScript" />
<add type="System.Web.Optimization.JsMinify, System.Web.Optimization" />
</transformations>
-->
</bundle>
</bundles>
</web.optimization>
</configuration>
只有非捆绑的CSS和JS和img标签才能呈现。
固定！我在节点中注释掉了以下内容：
<staticContent>
<!-- <mimeMap fileExtension=".mp4" mimeType="video/mp4" />
<mimeMap fileExtension=".m4v" mimeType="video/m4v" />
<mimeMap fileExtension=".ogg" mimeType="video/ogg" />
<mimeMap fileExtension=".ogv" mimeType="video/ogg" />
<mimeMap fileExtension=".webm" mimeType="video/webm" />
<mimeMap fileExtension=".oga" mimeType="audio/ogg" />
<mimeMap fileExtension=".spx" mimeType="audio/ogg" />
<mimeMap fileExtension=".svg" mimeType="image/svg+xml" />
<mimeMap fileExtension=".svgz" mimeType="image/svg+xml" />
<remove fileExtension=".eot" />
<mimeMap fileExtension=".eot" mimeType="application/vnd.ms-fontobject" />
<mimeMap fileExtension=".otf" mimeType="font/otf" />
<mimeMap fileExtension=".woff" mimeType="font/x-woff" />-->
<remove fileExtension=".manifest" />
<mimeMap fileExtension=".manifest" mimeType="text/cache-manifest" />
</staticContent>
答案
在web.config中的system.webserver下注释掉这个
<staticContent>
<!-- <mimeMap fileExtension=".mp4" mimeType="video/mp4" />
<mimeMap fileExtension=".m4v" mimeType="video/m4v" />
<mimeMap fileExtension=".ogg" mimeType="video/ogg" />
<mimeMap fileExtension=".ogv" mimeType="video/ogg" />
<mimeMap fileExtension=".webm" mimeType="video/webm" />
<mimeMap fileExtension=".oga" mimeType="audio/ogg" />
<mimeMap fileExtension=".spx" mimeType="audio/ogg" />
<mimeMap fileExtension=".svg" mimeType="image/svg+xml" />
<mimeMap fileExtension=".svgz" mimeType="image/svg+xml" />
<remove fileExtension=".eot" />
<mimeMap fileExtension=".eot" mimeType="application/vnd.ms-fontobject" />
<mimeMap fileExtension=".otf" mimeType="font/otf" />
<mimeMap fileExtension=".woff" mimeType="font/x-woff" />-->
<remove fileExtension=".manifest" />
<mimeMap fileExtension=".manifest" mimeType="text/cache-manifest" />
</staticContent>
另一答案
我在configure方法的startup.cs中添加了app.UseStaticFiles();这个代码，而不是修复它。
以上是关于图像，CSS和JS未在MVC4应用程序中加载的主要内容，如果未能解决你的问题，请参考以下文章
我的控制器索引视图的背景图像未在 rails 4 应用程序中加载？