Agregar recursos externos (CSS / JavaScript / images, etc.) en JSP

Agregué una hoja de estilo CSS externa a mi proyecto y la coloqué en la carpeta WEB-CONTENTS de mi proyecto en Eclipse. Cuando lo implementé en Tomcat, la hoja de estilo no se aplicó. Cuando depuré en Chrome y lo abrí, me dio el error 404 file not found . ¿Por qué es eso y cómo solucionarlo?

Aquí está el código:

       joined now     
this is at the top

La razón por la que obtiene el error 404 File Not Found , es que a su ruta a CSS dada como un valor para el atributo href le falta la ruta del contexto .

Una URL de solicitud HTTP contiene las siguientes partes:

 http://[host]:[port][request-path]?[query-string] 

La ruta de solicitud se compone además de los siguientes elementos:

  • Ruta de contexto : una concatenación de una barra inclinada (/) con la raíz de contexto de la aplicación web del servlet. Ejemplo: http://host[:port]/context-root[/url-pattern]

  • Ruta del servlet : la sección de ruta que corresponde al alias del componente que activó esta solicitud. Esta ruta comienza con una barra inclinada (/).

  • Información de ruta : la parte de la ruta de solicitud que no es parte de la ruta del contexto o la ruta del servlet.

Lea más aquí .


Soluciones

Hay varias soluciones para su problema, estas son algunas de ellas:

1) Usando la etiqueta de JSTL

En mis aplicaciones web Java usé habitualmente la etiqueta de JSTL cuando definía la ruta a CSS / JavaScript / image y otros recursos estáticos. Al hacerlo, puede estar seguro de que esos recursos se referencian siempre en relación con el contexto de la aplicación (ruta del contexto).

Si dices que tu CSS está ubicado dentro de la carpeta WebContent , entonces debería funcionar:

 " /> 

La razón por la que funciona se explica en la ” Especificación de la versión 1.2 de la biblioteca de tags de JavaServer Pages ™ ” capítulo 7.5 (el énfasis es mío):

7.5
Crea una URL con las reglas de reescritura correctas aplicadas.

La URL debe ser una URL absoluta que comience con un esquema (por ejemplo, “http: // server / context / page.jsp”) o una URL relativa como se define en JSP 1.2 en JSP.2.2.1 “Relative URL Specification”. Como consecuencia, una implementación debe anteponer la ruta de contexto a una URL que comienza con una barra diagonal (por ejemplo, “/page2.jsp”) para que dichas URL puedan ser interpretadas correctamente por un navegador cliente.

NOTA
No olvide utilizar la directiva Taglib en su JSP para poder hacer referencia a las tags JSTL . También vea un ejemplo de página JSP aquí .

2) Uso de JSP Expression Language y objetos implícitos

Una solución alternativa es usar Expression Language (EL) para agregar el contexto de la aplicación:

  

Aquí hemos recuperado la ruta de contexto del objeto de solicitud . Y para acceder al objeto de solicitud, hemos utilizado el objeto implícito pageContext .

3) Usando la etiqueta de JSTL

RENUNCIA
La idea de esta solución fue tomada desde aquí .

Para que el acceso al contexto sea más compacto que en la solución №2, primero puede usar la etiqueta JSTL , que establece el valor de una variable EL o la propiedad de una variable EL en cualquiera de los ámbitos JSP ( página, solicitud, sesión o aplicación) para un acceso posterior.

  ...  

NOTA IMPORTANTE
De forma predeterminada, para establecer la variable de esa manera, se debe acceder al JSP que contiene esta etiqueta de conjunto al menos una vez (incluso en el caso de establecer el valor en el scope de la aplicación utilizando el atributo scope , como ), antes de usar esta nueva variable. Por ejemplo, puede tener varios archivos JSP donde necesite esta variable. Entonces debe éter a) establecer la nueva variable manteniendo la ruta de contexto en el scope de la aplicación Y acceder primero a esta JSP, antes de usar esta variable en otros archivos JSP, ob) establecer esta variable de tenencia de la ruta de contexto en TODOS los archivos JSP, donde necesita para acceder a ella

4) Usando ServletContextListener

La forma más efectiva de hacer que el acceso a la ruta de contexto sea más compacto es establecer una variable que contenga la ruta de contexto y almacenarla en el scope de la aplicación usando un Listener . Esta solución es similar a la solución №3, pero la ventaja es que ahora la ruta de contexto de mantenimiento variable se establece al inicio de la aplicación web y está disponible para toda la aplicación, sin necesidad de pasos adicionales.

Necesitamos una clase que implemente la interfaz ServletContextListener . Aquí hay un ejemplo de tal clase:

 package com.example.listener; import javax.servlet.ServletContext; import javax.servlet.ServletContextEvent; import javax.servlet.ServletContextListener; import javax.servlet.annotation.WebListener; @WebListener public class AppContextListener implements ServletContextListener { @Override public void contextInitialized(ServletContextEvent event) { ServletContext sc = event.getServletContext(); sc.setAttribute("ctx", sc.getContextPath()); } @Override public void contextDestroyed(ServletContextEvent event) {} } 

Ahora en un JSP podemos acceder a esta variable global usando EL:

  

NOTA
La anotación @WebListener está disponible desde Servlet versión 3.0. Si utiliza un contenedor de servlets o un servidor de aplicaciones que admita especificaciones anteriores de Servlet, elimine la anotación @WebServlet y en su lugar configure el detector en el descriptor de despliegue (web.xml). Aquí hay un ejemplo del archivo web.xml para el contenedor que admite la versión 2.5 del Servlet máximo (otras configuraciones se omiten por razones de brevedad):

   ...  com.example.listener.AppContextListener  ...  

5) Usar scriptlets

Según lo sugerido por el usuario @gavenkoa , también puedes usar scriptlets como este:

 <%= request.getContextPath() %> 

Para algo tan pequeño, probablemente esté bien, solo tenga en cuenta que generalmente se desaconseja el uso de scriptlets en JSP .

Conclusión

Yo personalmente prefiero la primera solución (la usé en mis proyectos anteriores la mayor parte del tiempo) o la segunda, ya que son más claras, intuitivas y no ambiguas (en mi humilde opinión). Pero tú eliges lo que más te convenga.


Otros pensamientos

Puede implementar su aplicación web como la aplicación predeterminada (es decir, en el contexto raíz predeterminado ), de modo que se puede acceder sin especificar la ruta del contexto . Para obtener más información, lea la sección “Actualizar” aquí .

Usando el código siguiente, resuelve esta pregunta … Si ejecuta un archivo usando el servidor localhost, resuelva este problema siguiendo el código de la página Jsp. Este código pone Between Head Tag en el archivo jsp.

   
    Intereting Posts