Les projets de démarrage angulaire et à ressort déployés sur Azure ne fonctionnent pas comme prévu

la programmation


J’ai déployé un projet angulaire dans son propre service d’application et également déployé Spring Boot dans son propre service d’application. Les deux applications fonctionnent correctement localement mais le problème survient en production. J’obtiens cette erreur “Demande d’origine croisée bloquée : la politique de même origine interdit la lecture du ressource distante sur https://mineralsportal-api.azurewebsites.us/auth_api/authenticate. (Raison : en-tête CORS ‘Access-Control-Allow-Origin’ manquant). Code d’état : 503” Je ne sais pas d’où vient l’erreur depuis que j’ai configuré la classe cross-origin pour activer le partage de ressources et la classe corsFilter au Spring Boot, mais j’obtiens cette erreur sur Azure (production) même si cela fonctionne parfaitement localement.

Ce que j’ai essayé :

Voici ma classe corsConfig

@Configuration
public class CorsConfig {
    @Bean
    public WebMvcConfigurer corsConfigurer(){
        return new WebMvcConfigurer() {
            @Override
            public void addCorsMappings(CorsRegistry registry) {
            registry.addMapping("/**").allowedMethods("GET", "POST", "PUT", "DELETE")
                    .allowedOrigins("*")
                    .allowedHeaders("*");
            }
        };
    }
}

Voici ma classe corsFilter

@Component
public class CorsFilter implements Filter {

    @Override
    public void doFilter(ServletRequest req, ServletResponse res, FilterChain chain) throws IOException, ServletException {
    HttpServletResponse response = (HttpServletResponse) res;
    response.setHeader("Access-Control-Allow-Origin", "*");
    response.setHeader("Access-Control-Allow-Methods", "POST, GET, PUT, OPTIONS, DELETE, PATCH");
    response.setHeader("Access-Control-Max-Age", "3600");
    response.setHeader("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
    response.setHeader("Access-Control-Expose-Headers", "Location");
    chain.doFilter(req, res);
    }
    
    @Override
    public void init(FilterConfig filterConfig) {}

    @Override
    public void destroy() {}

}

Voici ma classe securityConfig

@Configuration
@EnableWebSecurity
@SuppressWarnings("deprecation")
public class SecurityConfig extends WebSecurityConfigurerAdapter {

    @Autowired
    private CustomUserService userService;

    @Autowired
    private RequestFilter requestFilter;

    @Override
    protected void configure(AuthenticationManagerBuilder auth) throws Exception {
        auth.userDetailsService(userService);
    }

    @Bean
    @Override
    public AuthenticationManager authenticationManagerBean() throws Exception {
        return super.authenticationManagerBean();
    }

    @Override
    protected void configure(HttpSecurity http) throws Exception {
    http.cors().disable();
    http.csrf().disable();
    http.authorizeRequests().antMatchers("/auth_api/authenticate").permitAll().anyRequest().authenticated()
    .and().sessionManagement().sessionCreationPolicy(SessionCreationPolicy.STATELESS);
    http.addFilterBefore(requestFilter, UsernamePasswordAuthenticationFilter.class);
    }
}

Après de nombreuses recherches sur Google, je n’ai pas pu obtenir la meilleure réponse qui pourrait m’aider à résoudre le problème. Toutes les suggestions seront très appréciées.

et existe-t-il un moyen dans Azure de déployer les deux applications pour qu’elles s’exécutent sur le même service d’application (angular + spring boot) sans les empaqueter sur le même fichier jar ?

Solution 1

Le problème ne vient pas de votre code, mais plutôt de votre déploiement. Vous avez déclaré avoir déployé votre application sur Azure, ce qui entraîne son propre ensemble d’attentes. Fondamentalement, la requête CORS est bloquée par Azure et non par votre application. Ce que vous devez faire, c’est gérer vous-même la fonctionnalité CORS – jetez un œil à la documentation ici[^] pour comprendre comment gérer CORS dans Azure.

[Edit – I posted this response without seeing that this was an old question. The answer still stands though, and could be useful to others in the future.]

コメント

タイトルとURLをコピーしました