Gérer les CORS dans votre application Spring

Introduction

Par défaut, il n’est pas autorisé de faire des requêtes entre une application qui est dans un domaine A vers une autre qui serait dans un domaine B (pour des raisons de sécurité, il y a plus de détails dans les sources).

Si vous avez un front qui tourne sur un serveur node (localhost:3000) et votre backend Spring sur (localhost:8090), les requêtes du front vers le back seront bloquées car ils sont dans des domaines différents (ils n’ont pas le même numéro de port).

Si vous n’autorisez pas les CORS dans votre application, vous aurez un message de ce type: 

Firefox

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at http://localhost:8090/pom. (Reason: CORS header ‘Access-Control-Allow-Origin’ missing).

Chrome

has been blocked by CORS policy: No ‘Access-Control-Allow-Origin’ header is present on the requested resource. If an opaque response serves your needs, set the request’s mode to ‘no-cors’ to fetch the resource with CORS disabled.

Autoriser les CORS dans votre application Spring

Techniquement, lorsque votre front va appeler votre backend Spring, il va avant tout faire un appel de type OPTION qu’on appelle le “preflight check”. En réponse, votre backend va indiquer quels autres domaines peuvent le solliciter et sur quelles routes.

Il y a plusieurs méthodes prévues dans Spring pour autoriser les CORS

De façon centralisée

Pour autoriser les CORS de partout et pour toutes les routes:

Créez la classe suivante:

package com.globaldashboard;

import org.springframework.context.annotation.Configuration;
import org.springframework.web.servlet.config.annotation.CorsRegistry;
import org.springframework.web.servlet.config.annotation.EnableWebMvc;
import org.springframework.web.servlet.config.annotation.WebMvcConfigurer;

@Configuration
@EnableWebMvc
public class WebConfig implements WebMvcConfigurer {

   @Override
   public void addCorsMappings(CorsRegistry registry) {
       registry.addMapping("/**");
   }
}

⚠️ Attention si votre API est publique, c’est peut-être pas la meilleure des idées de tout autoriser !

On peut filtrer par routes, méthodes et origines comme ceci: 

@Override
public void addCorsMappings(CorsRegistry registry) {
   registry
           .addMapping("/**")
           .allowedMethods("GET")
           .allowedOrigins("http://localhost:3000");
}

De façon plus spécifique

On pourrait aussi utiliser l’annotation @CrossOrigin spécifiquement sur des contrôleurs ou des méthodes avec les mêmes options:

@RestController
@RequestMapping("pom")
@CrossOrigin(origins = "http://localhost:3000", methods = RequestMethod.GET)
public class PomController {

Résultat

Si on applique une des méthodes citées précédemment et qu’on regarde le réseau dans notre navigateur, on peut s’apercevoir que ça fonctionne et qu’on a bien le Header “Access-Control-Allow-Origin” setté.

Alors qu’avant, il était absent.

Conclusion

J’espère que grâce à cet article, vous avez à présent toutes les clefs pour gérer correctement les CORS de votre application Spring. Pour aller plus loin, n’hésitez pas à regarder nos sources 🙂

Sources

https://blog.vnaik.com/posts/web-attacks.html

https://docs.spring.io/spring-framework/docs/5.3.x/reference/html/web.html#mvc-cors

https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS