JWT (JSON Web Token) é uma forma de token de autenticação que pode ser usado para

autenticar usuários em uma aplicação. O OAuth2 é um protocolo de autorização que

permite que aplicativos acessem recursos em nome do usuário.

Um exemplo de uso de JWT e React Native com autenticação OAuth2 pode ser um
aplicativo de compras online. Quando um usuário faz login, o aplicativo obtém um
token de acesso do servidor de autenticação OAuth2. Esse token é então usado para
autenticar o usuário em todas as solicitações subsequentes para o servidor de API.

O token JWT é normalmente armazenado no dispositivo do usuário em um local seguro,

como o armazenamento seguro do dispositivo. Em seguida, quando o usuário acessa uma
página protegida, o token é enviado para o servidor de API como parte da
solicitação. O servidor de API verifica se o token é válido e, em caso afirmativo,
permite o acesso ao recurso.

Um exemplo de como implementar isso pode envolver a utilização de uma biblioteca

como o react-native-app-auth, que fornece uma maneira fácil de autenticar usuários
em um aplicativo React Native usando o protocolo OAuth2. Esta biblioteca pode ser
configurada para funcionar com o provedor de autenticação OAuth2 desejado, como o
Google ou o Facebook.

Uma vez que o usuário é autenticado com sucesso e o token JWT é gerado, você pode
usar a biblioteca AsyncStorage do React Native para armazenar o token no
dispositivo do usuário. Em seguida, você pode usá-lo para autenticar solicitações
para o servidor de API, por exemplo, através do cabeçalho Authorization.

Assim, o aplicativo pode fornecer uma experiência de compra online segura e

personalizada para o usuário, permitindo que ele faça compras com segurança e
facilidade sem precisar fazer login toda vez que acessa o aplicativo.

um exemplo simples de como implementar a autenticação OAuth2 com JWT em um

aplicativo React Native usando a biblioteca react-native-app-auth:
import React, { useState } from 'react';
import { View, Text, Button } from 'react-native';
import { authorize } from 'react-native-app-auth';
import AsyncStorage from '@react-native-async-storage/async-storage';

const App = () => {

const [user, setUser] = useState(null);

const config = {
issuer: 'https://accounts.google.com',
clientId: 'your-client-id-here',
redirectUrl: 'your-redirect-uri-here',
scopes: ['openid', 'profile', 'email'],
};

const login = async () => {

try {
const result = await authorize(config);
await AsyncStorage.setItem('jwtToken', result.accessToken);
setUser(result);
} catch (error) {
console.log(error);
}
};

const logout = async () => {

await AsyncStorage.removeItem('jwtToken');
 setUser(null);
};

const fetchData = async () => {

const token = await AsyncStorage.getItem('jwtToken');
if (!token) return;

try {
const response = await fetch('https://api.example.com/data', {
headers: {
Authorization: `Bearer ${token}`,
},
});
const data = await response.json();
console.log(data);
} catch (error) {
console.log(error);
}
};

return (
<View>
{user ? (
<View>
<Text>Logged in as {user.name}</Text>
<Button title="Logout" onPress={logout} />
<Button title="Fetch data" onPress={fetchData} />
</View>
) : (
<Button title="Login with Google" onPress={login} />
)}
</View>
);
};

export default App;

o aplicativo usa o provedor de autenticação do Google e requer as permissões

"openid", "profile" e "email". Quando o usuário faz login com sucesso, o token JWT
é armazenado no AsyncStorage. O token é usado para autenticar as solicitações para
o servidor de API, neste caso, a chamada para fetchData(). Quando o usuário faz
logout, o token é removido do AsyncStorage.

Neste exemplo, a classe SecurityConfig configura a autenticação e autorização da

aplicação. A classe JwtRequestFilter é um filtro que verifica o token JWT em cada
solicitação e autentica o usuário se o token for válido. A classe
UserDetailsService é usada para buscar os detalhes do usuário no banco de dados.

@Service
public class JwtUserDetailsService implements UserDetailsService {

@Autowired
private UserRepository userRepository;

@Override
public UserDetails loadUserByUsername(String username) throws
UsernameNotFoundException {
User user = userRepository.findByUsername(username);
 if (user == null) {
throw new UsernameNotFoundException("User not found with username: " +
username);
}
return new
org.springframework.security.core.userdetails.User(user.getUsername(),
user.getPassword(),
new ArrayList<>());
}

Neste exemplo, a classe JwtUserDetailsService implementa a interface

UserDetailsService e é usada para buscar os detalhes do usuário no banco de dados.
A classe UserRepository é usada para buscar o usuário com base no nome de usuário.

@Service
public class JwtTokenUtil {

private static final String SECRET_KEY = "your-secret-key-here";

public String generateToken(UserDetails userDetails) {

Map<String, Object> claims = new HashMap<>();
return createToken(claims, userDetails.getUsername());
}

private String createToken(Map<String, Object> claims, String subject) {

return Jwts.builder().setClaims(claims).setSubject(subject)
.setIssuedAt(new Date(System.currentTimeMillis()))
.setExpiration(new Date(System.currentTimeMillis() + 1000 * 60 * 60
* 10))
.signWith(SignatureAlgorithm.HS256, SECRET_KEY).compact();
}

public Boolean validateToken(String token, UserDetails userDetails) {

final String username = getUsernameFromToken(token);
return (username.equals(userDetails.getUsername()) && !
isTokenExpired(token));
}

private Boolean isTokenExpired(String token) {

final Date expiration = getExpirationDateFromToken(token);
return expiration.before(new Date());
}

private Date getExpirationDateFromToken(String token) {

return
Jwts.parser().setSigningKey(SECRET_KEY).parseClaimsJws(token).getBody().getExpirati
on();
}

public String getUsernameFromToken(String token) {

return
Jwts.parser().setSigningKey(SECRET_KEY).parseClaimsJws(token).getBody().getSubject(
);
}
}
outro exemplo
@Configuration
@EnableWebSecurity
public class ConfiguracaoSeguranca extends WebSecurityConfigurerAdapter {

@Autowired
private UserDetailsService servicoDetalhesUsuario;

@Autowired
private FiltroRequisicaoJwt filtroRequisicaoJwt;

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

@Override
protected void configure(HttpSecurity http) throws Exception {
http.csrf().disable()
.authorizeRequests().antMatchers("/autenticar").permitAll()
.anyRequest().authenticated()
.and().sessionManagement().sessionCreationPolicy(SessionCreationPolicy.
STATELESS);

http.addFilterBefore(filtroRequisicaoJwt,
UsernamePasswordAuthenticationFilter.class);
}

@Bean
public PasswordEncoder codificadorSenha() {
return new BCryptPasswordEncoder();
}

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

Neste exemplo, a classe ConfiguracaoSeguranca configura a autenticação e

autorização da aplicação. A classe FiltroRequisicaoJwt é um filtro que verifica o
token JWT em cada solicitação e autentica o usuário se o token for válido. A classe
UserDetailsService é usada para buscar os detalhes do usuário no banco de dados.

@Service
public class ServicoDetalhesUsuarioJwt implements UserDetailsService {

@Autowired
private RepositorioUsuario repositorioUsuario;

@Override
 public UserDetails loadUserByUsername(String nomeUsuario) throws
UsernameNotFoundException {
Usuario usuario = repositorioUsuario.buscarPorNomeUsuario(nomeUsuario);
if (usuario == null) {
throw new UsernameNotFoundException("Usuário não encontrado com nome de
usuário: " + nomeUsuario);
}
return new
org.springframework.security.core.userdetails.User(usuario.getNomeUsuario(),
usuario.getSenha(),
new ArrayList<>());
}