JWT Vue Spring Boot Invalid Token with Custom Domain

Questions
1

I’ve an error with custom domain.
I can auth with okta domain without error.
I’ve changed url of Authorization Server and Social Identity Provider
But when i try my custom domain, this error apear

WWW-Authenticate: Bearer error="invalid_token", error_description="An error occurred while attempting to decode the Jwt: Invalid token", error_uri="https://tools.ietf.org/html/rfc6750#section-3.1"

Accept: application/json, text/plain, */*

Authorization: Bearer eyJraWQiOiJTZUM2U1hhZ0x1RXFwb3NJWjNxSl9yMjhBTVI5THZ3dzF3eTdRR3VrYmNJIiwiYWxnIjoiUlMyNTYifQ.eyJ2ZXIiOjEsImp0aSI6IkFULmRfZnE1ZTJkTUtrbVBkdmZPRmk4emFiUUFXeEhPalhEUVlsN0V4UG5yNm8iLCJpc3MiOiJodHRwczovL2F1dGgubm9wYWluLmNvZGVzL29hdXRoMi9kZWZhdWx0IiwiYXVkIjoiYXBpOi8vZGVmYXVsdCIsImlhdCI6MTU2OTExOTYyNywiZXhwIjoxNTY5MTIzMjI3LCJjaWQiOiIwb2ExYzYxYzd0V3JuemcwSDM1NyIsInVpZCI6IjAwdTFhemw4YjE0NHhGRWhTMzU3Iiwic2NwIjpbIm9wZW5pZCIsInByb2ZpbGUiLCJlbWFpbCJdLCJzdWIiOiJub3BhaW4yMTEwQGdtYWlsLmNvbSIsImdyb3VwcyI6WyJFdmVyeW9uZSIsIkFkbWluaXN0cmF0b3IiXX0.ZxMpk9IsOZA41LkT_1g0yC1R7GWodYELsE9RlwhLs-JHtX4Y1IBoiHn0_SzwbosMhB2EjQIZqXiWFe0i3II9h8h1M4Mh5GlMrB3ybSbfuDAf5bJUKITEtv-GKeWVIIyhF5OfpXfMX7ZvzoMqBH3lXXPt-WQsdQTv9RY-3sUQAtGs8AuSwvoWojDm-l-ADSr_C-hGT2b8c6_mAu7KsqtI8mERV9Y76OOtQhWvpIlr8rN-pjcdUB_EcpvxMyMkGAKAz8mbGau5GUWF96c08Fjl9lNUvCFaIG0v9TeNel_GZZMr_srExoe0rpxHxh9-B6DZfQ-xunpVnYnG5BSE6a5lvg

My client config:
clientId: ‘0oa1c61c7tWrnzg0H357’,
issuer: ‘https://auth.nopain.codes/oauth2/default’,
redirectUri: ‘http://localhost:8080/implicit/callback’,
scopes: [‘openid’, ‘profile’, ‘email’],
pkce: true,
testing: {
disableHttpsCheck: false
}
My serverside config:
okta:
oauth2:
issuer: https://auth.nopain.codes/oauth2/default
client-id: 0oa1c61c7tWrnzg0H357

protected void configure(HttpSecurity http) throws Exception {
    http.authorizeRequests()
            .antMatchers("/api/**").authenticated()
            .anyRequest().permitAll()
            .and()
            .oauth2ResourceServer().jwt();

    // process CORS annotations
    http.cors();
    // force a non-empty response body for 401's to make the response more browser friendly
    Okta.configureResourceServer401ResponseBody(http);
}

@Bean
public FilterRegistrationBean simpleCorsFilter() {
    UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
    CorsConfiguration config = new CorsConfiguration();
    config.setAllowCredentials(true);
    // *** URL below needs to match the Vue client URL and port ***
    config.setAllowedOrigins(Collections.singletonList("http://localhost:8080"));
    config.setAllowedMethods(Collections.singletonList("*"));
    config.setAllowedHeaders(Collections.singletonList("*"));
    source.registerCorsConfiguration("/api/**", config);
    FilterRegistrationBean bean = new FilterRegistrationBean<>(new CorsFilter(source));
    bean.setOrder(Ordered.HIGHEST_PRECEDENCE);
    return bean;
}
2

Does it work without a custom domain?

3

Yes, it work with okta domain.

4

I haven’t tried it myself, but I’m guessing you may need to configure your authorization server to use a custom URL.

5

It doesn’t work.
I’ve change issue uri on my authorization server

6

Can you please send an email with your issue to developers@okta.com? I’m out of ideas.

1 Like
7

I had the same issue with the invalid token. I’m using letsencrypt to generate the ssl cert.

I solved this by doing the following. When your at the upload ‘tls certificate’ page in okta portal.

Copy the cert.pem into certificate, the privkey.pem into private key and the chain.pem into certificate chain.

With letsencrypt the fullchain.pem doesn’t work for the certificate chain in okta but using chain.pem works.

It seems that the certificate chain is mandatory if your using custom domain with the code flow login logic.

8

This topic was automatically closed 24 hours after the last reply. New replies are no longer allowed.