ब्राउज़र एक जेएसपी के लिए आगे आने वाले सर्वलेट को कॉल करते समय सीएसएस, छवियों और लिंक जैसे रिश्तेदार संसाधनों तक पहुंच / खोज नहीं कर सकता है

83

जब मैं एक जेएसपी के आगे एक सर्वलेट रखता हूं तो मुझे सीएसएस और छवियों को लोड करने और अन्य पृष्ठों के लिंक बनाने में परेशानी हो रही है। विशेष रूप से, जब मैंने मुझे सेट <welcome-file>किया index.jsp, तो सीएसएस लोड किया जा रहा है और मेरी छवियां प्रदर्शित की जा रही हैं। हालाँकि, अगर मैं अपने <welcome-file>को HomeServletफॉरवर्ड कंट्रोल करने के लिए सेट करता हूं index.jsp, तो सीएसएस लागू नहीं किया जा रहा है और मेरी छवियों को प्रदर्शित नहीं किया जा रहा है।

मेरी सीएसएस फ़ाइल में है web/styles/default.css।
मेरी छवियाँ में हैं web/images/।

मैं अपने सीएसएस की तरह लिंक कर रहा हूँ:

<link href="styles/default.css" rel="stylesheet" type="text/css" />

मैं अपनी छवियों को इस प्रकार प्रदर्शित कर रहा हूं:

<img src="images/image1.png" alt="Image1" />

यह समस्या कैसे होती है और मैं इसे कैसे हल कर सकता हूं?

अद्यतन 1 : मैंने एप्लिकेशन की संरचना और साथ ही कुछ अन्य जानकारी जोड़ी है जो मदद कर सकती हैं।

वैकल्पिक शब्द

header.jspफ़ाइल फ़ाइल है कि सीएसएस के लिए लिंक टैग होता है। HomeServletमेरी के रूप में सेट किया गया है welcome-fileमें web.xml:

<welcome-file-list>
    <welcome-file>HomeServlet</welcome-file>
</welcome-file-list>

सर्वलेट घोषित किया गया है और निम्नानुसार मैप किया गया है web.xml:

<servlet>
    <servlet-name>HomeServlet</servlet-name>
    <servlet-class>com.brianblog.frontend.HomeServlet</servlet-class>
</servlet>
<servlet-mapping>
    <servlet-name>HomeServlet</servlet-name>
    <url-pattern>/</url-pattern>
</servlet-mapping>

अद्यतन 2 : मैंने समस्या को अंत में पाया - मेरे सर्वलेट को गलत तरीके से मैप किया गया था। जाहिरा तौर पर एक सर्वलेट सेट करते समय आपके पास <welcome-file>इसका URL पैटर्न नहीं हो सकता है /, जो मुझे अजीब लगता है, क्योंकि यह साइट की मूल निर्देशिका के लिए खड़ा नहीं होगा?

नई मैपिंग इस प्रकार है:

<servlet-mapping>
    <servlet-name>HomeServlet</servlet-name>
    <url-pattern>/HomeServlet</url-pattern>
</servlet-mapping>
css  image  jsp  servlets 
— ब्रायन डायकासा
स्रोत
अपडेट 2 के लिए धन्यवाद, दीवार के खिलाफ मेरे सिर को कोस रहा था कुछ घंटों के लिए यह जानने की कोशिश कर रहा था कि मेरा सीएसएस लोड क्यों नहीं हो रहा था। (है / एनोटेशन के रूप में)।
— कीवीकोम्बजैम

जवाबों:

101

जेएसपी फ़ाइल द्वारा उत्पन्न HTML पृष्ठ के सभी रिश्तेदार URL वर्तमान अनुरोध URL (ब्राउज़र पता बार में दिखाई देने वाले URL) के सापेक्ष होते हैं, न कि सर्वर साइड में JSP फ़ाइल के स्थान पर जहाँ तक आप अपेक्षा करते हैं। यह अर्थात् वेबब्रोसर है जिन्हें URL द्वारा व्यक्तिगत रूप से उन संसाधनों को डाउनलोड करना है, न कि वेबसर्वर जिन्हें उन्हें किसी भी तरह डिस्क से शामिल करना है।

JSP फ़ाइल के स्थान के बजाय उन्हें सर्वलेट के URL के सापेक्ष बनाने के लिए संबंधित URL को बदलने के अलावा, इस समस्या को ठीक करने का एक और तरीका उन्हें डोमेन रूट (यानी के साथ शुरू /) के सापेक्ष बनाना है । जब आप सर्वलेट के URL को बदलते हैं, तो आपको एक बार फिर से संबंधित रास्तों को बदलने की चिंता करने की आवश्यकता नहीं है।

<head>
    <link rel="stylesheet" href="/context/css/default.css" />
    <script src="/context/js/default.js"></script>
</head>
<body>
    <img src="/context/img/logo.png" />
    <a href="/context/page.jsp">link</a>
    <form action="/context/servlet"><input type="submit" /></form>
</body>

हालाँकि, आप शायद संदर्भ पथ को हार्डकोड नहीं करना चाहेंगे। बहुत ही उचित। आप ईएल में संदर्भ पथ प्राप्त कर सकते हैं ${pageContext.request.contextPath}।

<head>
    <link rel="stylesheet" href="${pageContext.request.contextPath}/css/default.css" />
    <script src="${pageContext.request.contextPath}/js/default.js"></script>
</head>
<body>
    <img src="${pageContext.request.contextPath}/img/logo.png" />
    <a href="${pageContext.request.contextPath}/page.jsp">link</a>
    <form action="${pageContext.request.contextPath}/servlet"><input type="submit" /></form>
</body>

(जिसे आसानी से छोटा किया जा सकता है <c:set var="root" value="${pageContext.request.contextPath}" />और ${root}कहीं और इस्तेमाल किया जा सकता है)

या, यदि आप बिना पढ़े XML से नहीं डरते हैं और XML सिंटैक्स हाइलाइटिंग से टूट जाते हैं, तो JSTL का उपयोग करें<c:url> :

<head>
    <link rel="stylesheet" href="<c:url value="/css/default.css" />" />
    <script src="<c:url value="/js/default.js" />"></script>
</head>
<body>
    <img src="<c:url value="/img/logo.png" />" />
    <a href="<c:url value="/page.jsp" />">link</a>
    <form action="<c:url value="/servlet" />"><input type="submit" /></form>
</body>

किसी भी तरह से, यदि आपके पास बहुत सारे सापेक्ष URL हैं, तो यह बहुत बोझिल है। उसके लिए आप <base>टैग का उपयोग कर सकते हैं । सभी रिश्तेदार URLs तुरंत इसके सापेक्ष बन जाएंगे। यह योजना (साथ शुरू करने के लिए तथापि है http://, https://, आदि)। सादे ईएल में आधार संदर्भ पथ प्राप्त करने का कोई साफ तरीका नहीं है, इसलिए हमें यहां JSTL की थोड़ी मदद की आवश्यकता है।

<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<c:set var="req" value="${pageContext.request}" />
<c:set var="uri" value="${req.requestURI}" />
<c:set var="url">${req.requestURL}</c:set>
...
<head>
    <base href="${fn:substring(url, 0, fn:length(url) - fn:length(uri))}${req.contextPath}/" />
    <link rel="stylesheet" href="css/default.css" />
    <script src="js/default.js"></script>
</head>
<body>
    <img src="img/logo.png" />
    <a href="page.jsp">link</a>
    <form action="servlet"><input type="submit" /></form>
</body>

यह बदले में (फिर से) कुछ caveats है। एंकर ( #identifierURL का) आधार पथ के सापेक्ष भी हो जाएगा! आप इसके बजाय अनुरोध URL (URI) के सापेक्ष बनाना चाहेंगे। तो, जैसे बदलो

<a href="#identifier">jump</a>

सेवा

<a href="${uri}#identifier">jump</a>

प्रत्येक तरीके के अपने नियम और विपक्ष हैं। यह आप पर निर्भर है कि किसे चुनना है। कम से कम, आपको अब यह समझना चाहिए कि यह समस्या कैसे होती है और इसे कैसे हल किया जाए :)

यह सभी देखें:

— BalusC
स्रोत
मैं वास्तव में उम्मीद कर रहा था कि यह काम करेगा क्योंकि यह समझ में आता है, लेकिन ब्राउज़र अभी भी फ़ाइलों का पता नहीं लगा सकता है। मैंने अपने प्रश्न (ऐप संरचना, और कुछ अन्य सामान्य जानकारी) में कुछ और जानकारी जोड़ी है। सहायता के लिए धन्यवाद!
— 22
3
आपने सर्वलेट /(गंध, गंध;) पर मैप किया है । इसलिए यह सीएसएस फाइलों (वास्तव में हर HTTP अनुरोध) पर भी ग्रहण करता है। क्या यह उन्हें सही तरीके से संभाल रहा है? यानी आप लोकलहोस्ट द्वारा सीधे webbrowser में CSS फ़ाइल को एक्सेस करने में सक्षम हैं : 8080 / संदर्भ / शैली / default.css ?
— बालूसी
तब नहीं जब इसे "/" मैप किया गया था। मैं कर सकता हूँ जब यह "/ HomeServlet" के रूप में मैप किया जाता है।
— ब्रायन डायकासा
मुझे यकीन नहीं है कि आपने शुरुआत में इसे मैप क्यों किया /*, लेकिन अगर आप एक तरह का फ्रंट कंट्रोलर बनाने की कोशिश कर रहे हैं, तो मैं खुद को इस उत्तर के माध्यम से प्राप्त करने का सुझाव दूंगा और शायद यह उत्तर भी ।
— बालूसी
@BalusC - आपके पहले पैराग्राफ में, जहां आपने कहा था "यह वेबब्रोसर है जिन्हें URL द्वारा उन संसाधनों को व्यक्तिगत रूप से डाउनलोड करना है, न कि वेबसर्वर जिन्हें उन्हें किसी तरह डिस्क से शामिल करना है।" क्या हम इसे व्यावहारिक रूप से जांच सकते हैं कि यह संसाधनों को लाने के लिए ब्राउज़र की ज़िम्मेदारी है और वेबसर्वर की नहीं? यदि आप मुझे कुछ व्यावहारिक उदाहरण या ट्यूटोरियल के लिए इंगित कर सकते हैं जो बहुत अच्छा होगा!
— अभिषेक अग्रवाल
6

मुझे स्प्रिंग एमवीसी एप्लिकेशन के साथ इसी तरह के मुद्दे का सामना करना पड़ा। मैंने < mvc:resources >इस समस्या को हल करने के लिए टैग का उपयोग किया ।

कृपया अधिक जानकारी वाले निम्नलिखित लिंक को खोजें।

http://www.mkyong.com/spring-mvc/spring-mvc-how-to-include-js-or-css-files-in-a-jsp-page/

— अश्विनी पाटिल
स्रोत
2

आपको संकेत के लिए वास्तविक HTML आउटपुट का विश्लेषण करना चाहिए।

इस तरह से रास्ता देने का अर्थ है "वर्तमान स्थान से", दूसरी तरफ यदि आप इसके साथ शुरू करते हैं /तो इसका अर्थ "संदर्भ से" होगा।

— अदील अंसारी
स्रोत
मैं तुम्हारे बारे में अनिश्चित हूं। अगर मैं इसका सीएसएस लिंक बदलता हूं:
— ब्रायन डायकासा
मेरा मतलब है कि आप अपने ब्राउज़र से HTML स्रोत देख सकते हैं, यह पता लगाने के लिए कि क्या रास्ता सही है या नहीं। यदि यह नहीं है, तो इसे सही करने के लिए आपको क्या करना चाहिए।
— आदिल अंसारी
मैं स्रोत देख रहा हूं, और मेरे लिंक टैग के लिए जो आता है वह वही है जो मैंने अपने प्रश्न में पोस्ट किया है। मुझे लगता है कि मैं अनिश्चित हूं कि अगर मैं सीधे अपने जेएसपी से लिंक करता हूं, तो फाइलें मिल सकती हैं, और अगर मैं आगे करता हूं, तो वे नहीं मिल सकते हैं? मैं अपनी छवियां कहां संग्रहीत कर सकता हूं ताकि वे वेब ऐप में किसी भी स्थान से मिल सकें?
— ब्रायन डीकासा
ठीक है, यह इसलिए है क्योंकि आपका index.jspस्थान उसी स्तर / स्तर पर है जैसा कि आपकी stylesऔर imagesनिर्देशिकाएं हैं। इसलिए, जब आप सीधे index.jspस्वागत फ़ाइल के रूप में उपयोग करते हैं, तो सब कुछ आकर्षण की तरह दिखाई देता है। दूसरी ओर, जब आप उसी संसाधन को सर्वलेट के माध्यम से अग्रेषित करते हैं, तो मामला अब ऐसा नहीं है। [जारी रखा जाए ...]
— आदिल अंसारी
@ ब्रायन डी।: ... एक विशेष सर्वलेट के लिए अनुरोध करने के लिए हम रास्ते पर विचार नहीं करते हैं, हम सर्वलेट मैपिंग का उपयोग करते हैं। अब, हमें context pathयहाँ समझना चाहिए । जैसा कि आपने डॉक्स में देखा है कि /जब हम अनुरोध को अग्रेषित करना चाहते हैं, या अनुरोध को पुनर्निर्देशित करना चाहते हैं, तो कुछ विशिष्ट अर्थ हैं। स्लैश के बिना इसे वर्तमान स्थान से लिया जाएगा, न कि संदर्भ पथ से। मुझे आशा है कि अब आप मुझे प्राप्त कर रहे हैं।
— अदील अंसारी
0

आपका स्वागत पृष्ठ उस सर्वलेट के रूप में सेट है। तो सभी सीएसएस, चित्र पथ को उस सर्वलेट डीआईआर के सापेक्ष दिया जाना चाहिए। जो एक बुरा विचार है! आपको होम पेज के रूप में सर्वलेट की आवश्यकता क्यों है? सूचकांक पृष्ठ के रूप में .jsp और वहाँ से किसी भी पृष्ठ पर पुनर्निर्देशित करें?

क्या आप db से किसी भी फ़ील्ड को पॉप्युलेट करने की कोशिश कर रहे हैं, इसलिए कि आप सर्वलेट का उपयोग क्यों कर रहे हैं?

— GoodSp33d
स्रोत
4
(MVC) फ्रंट कंट्रोलर के रूप में एक सर्वलेट का उपयोग करना निश्चित रूप से एक बुरा विचार नहीं है।
— बालुसक
0

यदि आप स्प्रिंग एमवीसी का उपयोग कर रहे हैं, तो आपको स्थिर सामग्री के लिए डिफ़ॉल्ट एक्शन सर्वलेट घोषित करने की आवश्यकता है। स्प्रिंग-एक्शन-सर्वलेट.एक्सएमएल में निम्नलिखित प्रविष्टियाँ जोड़ें। इसने मेरे लिए काम किया।

नोट: WEB-INF के बाहर सभी स्थिर सामग्री रखें।

<!-- Enable annotation-based controllers using @Controller annotations -->
<bean id="annotationUrlMapping" class="org.springframework.web.servlet.mvc.annotation.DefaultAnnotationHandlerMapping">
    <property name="order" value="0" />
</bean>

<bean id="controllerClassNameHandlerMapping" class="org.springframework.web.servlet.mvc.support.ControllerClassNameHandlerMapping">
    <property name="order" value="1" />
</bean>

<bean id="annotationMethodHandlerAdapter" class="org.springframework.web.servlet.mvc.annotation.AnnotationMethodHandlerAdapter"/>
— AjayP
स्रोत
0

आपके अपडेट के लिए, मैं पीछे के तर्क के लिए उलझन में था। थोड़ा गहरा खोदा और इस मणि को पाया:

  • yourite.com हो जाता है yourite.com/
  • yourite.com/ एक निर्देशिका है, इसलिए स्वागत-फ़ाइल-सूची स्कैन की जाती है
  • yourite.com/CMS पहली स्वागत-फ़ाइल (स्वागत-फ़ाइल-सूची में "CMS) है, और MyCMS सर्वलेट के लिए / CMS की मैपिंग है, ताकि सर्वलेट एक्सेस हो।

स्रोत: http://wiki.metawerx.net/wiki/HowToUseAServletAsYourMainebebage

तो, मैपिंग तो समझ में आता है।

और एक अब स्वतंत्र रूप से $ {pageContext.request.contextPath} / path / के रूप में src / href के लिए सापेक्ष लिंक का उपयोग कर सकता है!

— जस्टिन क्यूरेस्मा
स्रोत
0

संक्षिप्त उत्तर - jsp में निम्न पंक्ति जोड़ें जो आधार
बेस को परिभाषित करेगा href = "/ आपके आवेदन की जड़} /"

— अंकित पंडोह
स्रोत
0

आप इस एक के रूप में अच्छी तरह से बाहर की कोशिश कर सकते हैं। क्योंकि यह मेरे लिए काम करता है और यह सरल है।

<style>
    <%@ include file="/css/style.css" %>
</style>
— दुलिया परेरा
स्रोत
हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.