5

Need help on the basics - I have integrated Angular and Spring Boot. I made production build of the Angular app and copied the 6 files in the Spring boot static resource folder.

By default when I hit localhost:8080 index.html is rendered as Spring boot Automatically registers it as welcome page.

Now when i am inside angular i can navigate to different component via ANGULAR ROUTER and the url is also changing.

But when i copy the same URL for example - localhost:8080/myTask and enter it in url address bar it throws 404 resource not found. Because it hits the Spring controller first and since there is no mapping for that it fails.

Arpan Sharma
  • 395
  • 1
  • 10
  • 20
  • I also had similar issue. Only index page was loading after copying angular dist folder to Spring boot static directory. But setting `useHash: true` in app.routing.ts fixed the error 404. – Olakunle Awotunbo Mar 03 '19 at 13:57

3 Answers3

5

In the class where you have extended WebMvcConfigurerAdapter in Spring Boot, inside addViewControllers method, you should do something like this

@Override
    public void addViewControllers(final ViewControllerRegistry registry) {
        super.addViewControllers(registry);
      registry.addViewController("/myTask").setViewName("forward:/");
 }

for forwarding, all request, you can do registry.addViewController("/**").setViewName("forward:/");

Update Thanks Jonas for the Suggestion. Since WebMvcConfigurerAdapter is deprecated in Spring 5.0, you can implement the above logic by extending WebMvcConfigurer

CGS
  • 2,782
  • 18
  • 25
  • Cool bro Spot on answer. Can you please guide on where I can read all these information. I want more knowledge on this and Spring security(the filter chain). Want to be clear more on basics/fundamentals. – Arpan Sharma Dec 01 '17 at 03:11
  • You can explore more in the following links https://docs.spring.io/spring-boot/docs/current/reference/html/boot-features-developing-web-applications.html https://spring.io/guides/gs/securing-web/ . It would be great, if you can accept my answer as you found it useful – CGS Dec 01 '17 at 05:26
  • 1
    Great answer, precisely what is needed to be able to actually serve Angular code from Spring Boot! Thanks Chids! – Jonck van der Kogel Mar 13 '18 at 22:04
  • 1
    You can also use `@Configuration public class AngularRedirectConfig implements WebMvcConfigurer { @Override ... }` since `WebMvcConfigurerAdapter` is deprecated as of Spring 5.0: https://docs.spring.io/spring-framework/docs/current/javadoc-api/org/springframework/web/servlet/config/annotation/WebMvcConfigurerAdapter.html – Jonas Gröger Nov 06 '19 at 17:32
3
// the perfect solution(from jhipster)
@Controller
public class ClientForwardController {
    @GetMapping(value = "/**/{path:[^\\.]*}")
    public String forward() {
        return "forward:/";
    }
}
Mechria Rafik
  • 87
  • 1
  • 3
2

If you don't use Spring MVC (for example, you are using Jersey), you can also solve this by using a javax.servlet.Filter:

@Component
@Order(Ordered.HIGHEST_PRECEDENCE)
public class AngularRoutingFilter implements Filter {

  @Override
  public void doFilter(ServletRequest request, ServletResponse response, FilterChain chain) throws IOException, ServletException {
    HttpServletRequest httpServletRequest = ((HttpServletRequest) request);
    String requestURI = httpServletRequest.getRequestURI();

    if (shouldDispatch(requestURI)) {
        request.getRequestDispatcher("/").forward(request, response);
    } else {
        chain.doFilter(request, response);
    }
  }

  @Override
  public void init(FilterConfig filterConfig) {}

  @Override
  public void destroy() {}

  private boolean shouldDispatch(String requestURI) {
    /* Exclude/Inlclude URLs here */
    return !(requestURI.startsWith("/api") || requestURI.equals("/"));
  }

}
Jacob van Lingen
  • 8,989
  • 7
  • 48
  • 78