Игнориране на маршрутизиране на Javascript, CSS и файлове с изображения в ASP.net

Превъртях Stack Overflow нагоре и надолу, но, за съжаление, нито един от отговорите не ми помогна.

Имам уеб приложение, което работи перфектно на моя локален компютър, използвайки IIS, предоставено от Visual Studio, но когато разположа това приложение на сървъра, само CSS се показва правилно.

Структурата на папките за файлове е както следва:

  • Root (this folder is named Knowledge Management on the server)
    • CSS
    • JS
    • Медия
    • Uploads
      • Documents
      • Изображения
      • Потребители

Моят код, поне за главния раздел на основната страница, изглежда така:

<head runat="server">
    <link href="/bgCSS/Style.css" rel="stylesheet" />
    <script src="/JS/jQuery203Min.js"></script>
    <script src="/JS/jQueryUI1103Min.js"></script>
    <asp:ContentPlaceHolder ID="head" runat="server">
    </asp:ContentPlaceHolder>
</head>

Браузърът обаче го генерира по следния начин:

<head>
    <link href="/bg../../CSS/Style.css" rel="stylesheet" />
    <script src="JS/jQuery203Min.js"></script>
    <script src="JS/jQueryUI1103Min.js"></script>    
    <script src="/JS/HomeArticles.js"></script>
</head> 

Проблемът е, че освен CSS, нито един от файловете в папката JS и нито един от файловете в папките и подпапката Media или Uploads не се генерира правилно.

Работата е там, че ако добавя "наклонена черта" пред атрибута src на изображението, изображението получава местоположение http://localhost/Media/Discussion.png и ако не добавя "наклонена черта", тогава местоположението на изображението е http://localhost/Uploads/Users/HrvojeFadiga.jpg, когато трябва да бъде http://localhost/Knowledge%20Management/Uploads/Users/HrvojeFadiga.jpg

Ето примерен код с изображения:

<div class="profileInfoWrapper">
    <img src="/Uploads/Users/<%=article.User.PhotoLocation %>" />
    <span class="postInfo">
        <img src="/Media/Rating.png" /><%= GetArticleRating(article.idArticle) %>
    </span>
    <span class="postInfo">
        <img src="/Media/Visitors.png" /><%= GetArticleViews(article.idArticle) %>
    </span>
    <span class="postInfo">
        <img src="/Media/Comments.png" /><%= GetArticleComments(article.idArticle) %>
    </span>
</div>

FYI, Global.asax не съдържа никакви правила за игнориране на файлови маршрути, освен за .axd файлове, които се добавят по подразбиране.


person wegelagerer    schedule 22.01.2014    source източник
comment
Работата е там, ако добавя наклонена черта пред атрибута src на изображението - Можете ли да покажете кода, който включва елемента на изображението? Освен това, ако премахнете / от атрибута src на скрипта, тези връзки все още ли не работят?   -  person Ben Smith    schedule 27.01.2014
comment
@Fresh Добавих кода с елемент на изображението. Премахването на наклонена черта не помага. Не знам дали има проблем с Windows Server тук или какво, защото в тестова среда (локално с IIS Express) всичко работи добре.   -  person wegelagerer    schedule 27.01.2014
comment
@Hrvach къде се намира вашата основна страница? В някоя папка?   -  person Afnan Ahmad    schedule 27.01.2014
comment
Главната страница @AfnanAhmad се намира в основната папка.   -  person wegelagerer    schedule 28.01.2014


Отговори (6)


Успях да сортирам това, като добавих атрибут runat=server и използвах tilt(~), преди да дефинирам източника на файла. Например:

<link href="/bg~/CSS/Style.css" rel="stylesheet" runat="server" />

Същото важи и за javascript файлове.

person Morpheus    schedule 24.01.2014
comment
За съжаление добавянето на маркер runat към javascript файлове доведе до грешка. - person wegelagerer; 27.01.2014
comment
Опитвали ли сте <script src="~/JS/jQuery203Min.js" runat="server"/>? Забележка /> и без край </script> - person Morpheus; 27.01.2014
comment
Да, имам - все същото. Наистина съм озадачен. Дори се опитах да добавя .js файлове към папката CSS, тъй като .css файловете работят както трябва, но също не помогна. - person wegelagerer; 27.01.2014
comment
Наистина странно, че работи добре за мен. Вместо това помислете за използване на пакети. - person Morpheus; 27.01.2014
comment
Вярвам, че намерих заобиколно решение (след почти 10 дни настройване, опити и т.н.)! :) Изглежда, че добавянето на скриптове към ScriptManager ще свърши работа - трябва да го тествам малко, но ще ви уведомя! Благодаря ти за помощта! - person wegelagerer; 27.01.2014

За всякакви URL адреси за скриптове и стилове трябва да извикате ResolveUrl по този начин:

<link href="/bg<%= ResolveUrl("~/CSS/Style.css") %>" rel="stylesheet" />
person Jay Douglass    schedule 29.01.2014

Опитайте тази. без "~" също може да работи, но можете да го добавите само за препратка към главната директория, която винаги е решението на вашия проект. Така че с помощта на тилда "~" можете правилно да посочите къде се намират вашите css и js файлове.

<link href="/bg~/CSS/styles.css" type="text/css" rel="stylesheet"/>
<script src="~/JS/jScript.js" type="text/javascript"/>

По същия начин за вашите изображения, които сте съхранили в папки за качване. Можете да получите достъп до него, като използвате

<img src="~/Uploads/Images/youImage.gif" />
person Suhaib Janjua    schedule 30.01.2014

Просто опитайте както по-долу и при мен се получи...

<script src="JS/jQuery203Min.js" type="text/javascript"></script>
<script src="JS/jQueryUI1103Min.js" type="text/javascript"></script>
<link href="/bgCSS/Style.css" rel="stylesheet" type="text/css"/>
person Biby Augustine    schedule 28.01.2014
comment
Това беше първото нещо, което опитах. За съжаление не беше полезно. - person wegelagerer; 29.01.2014

Първо, благодаря на всички ви за отговорите. След няколко дни игра най-накрая разбрах какво да направя, за да накарам всичко да работи.

Проблеми с JS

Реших проблеми с JS, като добавих контрола ScriptManager към страницата .aspx и като добавих JS файлове в нея.

<asp:ScriptManager ID="smScripts" runat="server">
     <Scripts>
          <asp:ScriptReference Path="JS/jQuery203Min.js"/>
     </Scripts>
</asp:ScriptManager>

По някаква причина CSS файловете работеха „извън кутията“, така че ги оставих непроменени.

Проблеми с изображение

Успях да отстраня проблемите с изображенията, като избягвах твърдо кодирани връзки към изображенията и като добавях <%: Page.ResolveUrl("~/Media/Image.png") %> към атрибута src на маркера <img>. Предполагам, че трябваше да направя това за всичко, което не искам да маршрутизирам. Това може да се направи за CSS файлове, JS файлове, всичко. Въпреки това (въпреки че това трябва да работи перфектно) имах някои странни проблеми с JS файлове и това е причината да използвам ScriptManager.

Проблем с връзки към страници

Първоначално не разбрах, че никоя от връзките ми не работи, така че реших, че проблемът е в полутвърдо кодирани връзки, които по някаква причина не маршрутизират правилно, въпреки че кодирах маршрута по същия начин, както е дефинирано в Global.asaxфайл. Все още не съм сигурен защо това не работи.

Решението за това е да генерирате връзки с помощта на <%: Page.GetRouteUrl("RouteName", new { routeParameter1 = routeParameter1Value, routeParameter2 = routeParameter2Value}) %> и всичко ще работи добре.

person wegelagerer    schedule 30.01.2014

Вероятният виновник е настройката на директориите/виртуалната директория.

Вижте страницата си в Google Chrome и след това „Проверете елемента“. Превъртете до върха и включвате вашите .JS файлове. Можете да щракнете върху тях, за да видите към кой URL се опитват да се свържат. Повече от вероятно пътят е малко по-различен на сървъра от вашето локално копие.

person Jason Geiger    schedule 30.01.2014