Sirva recursos estáticos con Spring

1. Información general

Este artículo explora cómo servir recursos estáticos con Spring , utilizando la configuración XML y Java.

2. Usando Spring Boot

Spring Boot viene con una implementación preconfigurada de ResourceHttpRequestHandler para facilitar el servicio de recursos estáticos.

De forma predeterminada, este controlador proporciona contenido estático de cualquiera de los directorios / static, / public, / resources y / META-INF / resources que se encuentran en la ruta de clases . Dado que src / main / resources normalmente se encuentra en la ruta de clases de forma predeterminada, podemos colocar cualquiera de estos directorios allí.

Por ejemplo, si colocamos un archivo about.html dentro del directorio / static en nuestra ruta de clases, entonces podemos acceder a ese archivo a través de //localhost:8080/about.html . De manera similar, podemos lograr el mismo resultado agregando ese archivo en otros directorios mencionados.

2.1. Patrones de ruta personalizados

De forma predeterminada, Spring Boot sirve todo el contenido estático en la parte raíz de la solicitud, es decir, / ** . Aunque parece ser una buena configuración predeterminada, podemos cambiarla a través de la propiedad de configuración spring.mvc.static-path-pattern .

Por ejemplo, si queremos acceder al mismo archivo a través de //localhost:8080/content/about.html, podemos decirlo en nuestra application.properties:

spring.mvc.static-path-pattern=/content/**

In WebFlux environments, we should use the spring.webflux.static-path-pattern property.

2.2. Custom Directories

Similar to path patterns, it's also possible to change the default resource locations via the spring.resources.static-locations configuration property. This property can accept multiple comma-separated resource locations:

spring.resources.static-locations=classpath:/files/,classpath:/static-files

Here, we're serving static contents from the /files and /static-files directories inside the classpath. Moreover, Spring Boot can serve static files from outside of the classpath:

spring.resources.static-locations=file:/opt/files 

Here we're using the file resource signature, file:/, to serve files from our local disk.

3. XML Configuration

If you need to go the old fashion way with XML-based configuration, you can make good use of the mvc:resources element to point to the location of resources with a specific public URL pattern.

For example – the following line will serve all requests for resources coming in with a public URL pattern like “/resources/**” by searching in the “/resources/” directory under the root folder in our application.

Now, we can access a CSS file as in the following HTML page:

Example 3.1.


     Home   

4. The ResourceHttpRequestHandler

Spring 3.1. introduced the ResourceHandlerRegistry to configure ResourceHttpRequestHandlers for serving static resources from the classpath, the WAR, or the file system. We can configure the ResourceHandlerRegistry programmatically inside our web context configuration class.

4.1. Serving a Resource Stored in the WAR

To illustrate this, we'll use the same URL as before to point to myCss.css, but now the actual file will be located in the WAR's webapp/resources folder, which is where static resources should be placed when deploying Spring 3.1+ applications:

Example 4.1.1.

@Configuration @EnableWebMvc public class MvcConfig implements WebMvcConfigurer { @Override public void addResourceHandlers(ResourceHandlerRegistry registry) { registry .addResourceHandler("/resources/**") .addResourceLocations("/resources/"); } }

Let's analyze the example bit. First, we configure the external-facing URI path by adding defining a resource handler. Then, we map that external-facing URI path internally to the physical path where the resources are actually located.

We can, of course, define multiple resource handlers using this simple yet flexible API.

Now – the following line in an html page would get us the myCss.css resource inside the webapp/resources directory:


    

4.2. Serving a Resource Stored in the File System

Let's say we want to serve a resource stored in the /opt/files/ directory whenever a request comes in for the public URL matching the pattern: /files/**. We simply configure the URL pattern and map it to that particular location on disk:

Example 4.2.1.

@Override public void addResourceHandlers(ResourceHandlerRegistry registry) { registry .addResourceHandler("/files/**") .addResourceLocations("file:/opt/files/"); }

*(For Windows users: The argument passed to addResourceLocations for this example would be “file:///C:/opt/files/“).

Once we configure the resource location, we can use the mapped URL pattern in our home.html to load an image stored in the file system as follows:

Example 4.2.2.


     Home   

4.3. Configuring Multiple Locations for a Resource

What if we want to look for a resource in more than one location?

We can include multiple locations with the addResourceLocations method. The list of locations will be searched in order until the resource is found. Let's take a look at Example 3.3.1.

Example 4.3.1

@Override public void addResourceHandlers(ResourceHandlerRegistry registry) { registry .addResourceHandler("/resources/**") .addResourceLocations("/resources/","classpath:/other-resources/"); }

The following curl request will display the Hello.html page stored in either the application's webappp/resources or the other-resources folder in the classpath.

curl -i //localhost:8080/handling-spring-static-resources/resources/Hello.html

5. The New ResourceResolvers

Spring 4.1. provides – with the new ResourcesResolvers – different types of resource resolvers that can be used to optimize browser performance when loading static resources. These resolvers can be chained and cached in the browser to optimize request handling.

5.1. The PathResourceResolver

This is the simplest resolver and its purpose is to find a resource given a public URL pattern. In fact, if no ResourceResolver is added to the ResourceChainRegistration, this is the default resolver.

Let's see an example:

@Override public void addResourceHandlers(ResourceHandlerRegistry registry) { registry .addResourceHandler("/resources/**") .addResourceLocations("/resources/","/other-resources/") .setCachePeriod(3600) .resourceChain(true) .addResolver(new PathResourceResolver()); }

Things to notice:

  • We are registering the PathResourceResolver in the resource chain as the sole ResourceResolver in it. See section 4.3. to check how to chain more than one ResourceResolver.
  • The resources served will be cached in the browser for 3600 seconds.
  • The chain is finally configured with the method resourceChain(true).

Now – the HTML code that, in conjunction with the PathResourceResolver, locates the foo.js script in either the webapp/resources of the webapp/other-resources folder: