Using .jsp to create a simple login functionality with oauth 2.0

I’m trying to load a navbar from another file into my login page, using jsp files and a javascript function:

<script>
        $(document).ready(function () {
            $("#navbar").load("navbar.jsp");
            console.log("testing testing");
        });
</script>

I’m using google oauth 2.0 to secure my site for better authentication.
This means the user cannot type in a specific mapping into the search bar without being prompted to authenticate. I want to create a single .jsp for just my navbar. I’ve typed in the mapping to antMatchers so that it can bypass authentication, to enable the navbar be shown on my landing page and login page (before user logs in).

However, I cannot get the navbar to show up on my page, because the prompt to authenticate still covers the navbar. The rest of my login page is visible though.

@Configuration
public class WebSecurityConfiguration extends WebSecurityConfigurerAdapter {
    @Override
    protected void configure(HttpSecurity http) throws Exception {
        http
                .csrf()
                    .disable()
                .antMatcher("/**")
                .authorizeRequests()    //problem in antmatchers whenever it sends me to sign in w google randomly       //added after example:
                .antMatchers("/", "views/navbar","/Login", "/Register", "/resources/", "/login/database", "/example/**","/public/**", "/resources/**","/resources/static/**")
                    .permitAll()
                .antMatchers("/**.js").permitAll()  //added this for navbar, not sure if works yet
                .anyRequest()
                    .authenticated()
                    .and()
                    .oauth2Login()  
                .and()
                    .logout()
                    .logoutUrl("/logout")
                    .logoutSuccessUrl("/");
    }
}

I’ve been researching for a while and cannot seem to find what I’m missing. Any help is appreciated, thanks