Danushka
Danushka

Reputation: 67

Angular + Spring boot cross-origin filter not working

I know there are a lot of questions has asked regarding this. But still, I couldn't resolve the cross-origin block issue in my application. I have implemented all the filters in Spring boot application but the issue is still coming. Can anyone direct me to the right path?

Angular application - http://localhost:4200/auth

Spring boot application - http://localhost:8082/app1

Main class

@SpringBootApplication
public class App1Application implements WebMvcConfigurer {

    public static void main(String[] args) {
        SpringApplication.run(App1Application.class, args);
    }
}

Cors Filter class

@Component
public class CORSFilter implements Filter {

    public CORSFilter() {
        System.out.println("Filtering on...........................................................");
    }

    @Override
    public void doFilter(ServletRequest req, ServletResponse res, FilterChain chain) throws IOException, ServletException {

        HttpServletRequest request = (HttpServletRequest) req;
        HttpServletResponse response = (HttpServletResponse) res;

        response.setHeader("Access-Control-Allow-Origin", request.getHeader("Origin"));
        response.setHeader("Access-Control-Allow-Credentials", "true");
        response.setHeader("Access-Control-Allow-Methods", "POST, GET, OPTIONS, DELETE");
        response.setHeader("Access-Control-Max-Age", "3600");
        response.setHeader("Access-Control-Allow-Headers", "Content-Type, Accept, X-Requested-With, remember-me");
        chain.doFilter(req, res);
    }

    public void init(FilterConfig filterConfig) {
    }

    public void destroy() {
    }
}

Controller class

@RestController
public class UserController {

    @GetMapping("/get-id")
    public String getId() {
        return "Welcome SSO";
    }

Application.yml

server:
  port: 8082
  servlet:
    context-path: /app1

Angular service part

import { Injectable } from '@angular/core';
import { HttpClient, HttpHeaders } from '@angular/common/http';
import { Observable } from 'rxjs';

@Injectable({
  providedIn: 'root'
})
export class AuthService {

  private baseUrl ="http://localhost:8082/app1";

  constructor(private http: HttpClient) { }

  changeButton(id: number): Observable<any> {
    console.log("Service hit")
    return this.http.get<any>(this.baseUrl + '/get-id');
  }
}

Upvotes: 0

Views: 605

Answers (2)

Marc
Marc

Reputation: 1896

You should enable CORS in spring boot with @CrossOrigin in the controller or a global config like this:

@Configuration
public class MyConfiguration {

    @Bean
    public WebMvcConfigurer corsConfigurer() {
        return new WebMvcConfigurerAdapter() {
            @Override
            public void addCorsMappings(CorsRegistry registry) {
                registry.addMapping("/**");
            }
        };
    }
}

See: Spring Boot Referenz CORS

or: Blog: CORS support in spring boot

In your code you can try to set *

response.setHeader("Access-Control-Allow-Origin", "*");

Upvotes: 1

Related Questions