Estoy enfrentando dificultades para obtener la cookie que se establece en el navegador desde el backend y luego enviarla en las siguientes solicitudes. Inicialmente, tengo un endpoint que al recibir contraseña y usuario devuelve dos cookies: 'token' y 'refreshToken', las cuales se establecen en el navegador correctamente. Posteriormente, deseo ejecutar otro endpoint que requiere el token para devolver el resultado deseado. ¿Cómo puedo enviar ese token que esta como una cookie establecido en las siguientes peticiones? A continuación, describo mi código actual:
investigue y dice que al configurar axios con withCredentials: true obtiene el token automaticamnte de la cookies y lo envia en las siguietes peticiones que se hagan en la misma url
Tengo este endpoint que estable dos cookies en el navegador al enviarle el usuario y contraseña correctamente las manda como Set-Cookie
[HttpPost]
[Route("Authenticate")]
[ServiceFilter(typeof(IpLimitActions))]
[EnableRateLimiting("General")]
public async Task<IActionResult> Autenticar([FromBody] AuthorizationRequest authorization)
{
try
{
var resultAuthorization = await _authorizationService.ReturnToken(authorization);
if (resultAuthorization == null)
{
return Unauthorized();
}
else
{
// Crear y configurar la cookie de token
var tokenCookieOptions = new CookieOptions
{
HttpOnly = true,
Secure = true, // Se debe configurar como true si el sitio es HTTPS
SameSite = SameSiteMode.Lax, // O ajusta según los requisitos de seguridad
Expires = DateTimeOffset.UtcNow.AddMinutes(30), // Tiempo de expiración de la cookie
Path = "/"
};
Response.Cookies.Append("token", resultAuthorization.Token, tokenCookieOptions);
// Crear y configurar la cookie de refresh token
var refreshTokenCookieOptions = new CookieOptions
{
HttpOnly = true,
Secure = true, // Se debe configurar como true si el sitio es HTTPS
SameSite = SameSiteMode.Strict, // O ajusta según los requisitos de seguridad
Expires = DateTimeOffset.UtcNow.AddHours(24 * 7), // Tiempo de expiración de la cookie
Path = "/"
};
Response.Cookies.Append("refreshToken", resultAuthorization.RefreshToken, refreshTokenCookieOptions);
return Ok();
}
}
catch (Exception ex)
{
// Manejar otras excepciones no controladas
throw new MethodsExceptions(StatusCod.UnprocessableContent, ex.Message, ex.InnerException.ToString());
}
}
De esta manera llamo el endpoint Authenticate cuando ejecuto el enpoint autenticar llegan las cookies al navegador correctamente
export const login = (credentials: authInput) => async (dispatch: any) => {
try {
debugger
await axiosInstance.post(`${API_BASE_URL}/Authenticate`, credentials, { withCredentials: true });
dispatch(setCredentials({}));
} catch (error) {
//Aquí podrías despachar otra acción para manejar el error
}
};
Y luego quiero ejeutar este otro enponint que devuelve los paises como ven tiene el Authorize, lo que necesito es que obtenga el token enviado a las cookies y se envie en la solicitud
[HttpGet]
[Route("Countries")]
[Authorize]
// [Authorize(Policy = "RequireAdmin")]
public async Task<IActionResult> GetList()
{ // Comprobar si el usuario tiene permiso de administrador
try
{
var listaPaises = await Task.FromResult(new List<string> { "Colombia", "Francia", "Croacia", "Marruecos", "España" });
return Ok(listaPaises);
}
catch (Exception ex)
{
return Unauthorized(new { message = ex.Message });
}
//throw new Exception("Esto es una excepción a propósito.");
}
lo llamo de este forma desde react
const getRoles = async (): Promise<string[]> => {
try {
debugger
const roleResponse = await callEndpoint(
GetRequests<string[]>(
'https://localhost:7050',
'/v2/Testing/Tests/Countries'
)
);
console.log(roleResponse.data);
return roleResponse.data;
} catch (error) {
console.log(error);
}
}
desde aca llamo las nuevas peticiones de modo generico
import axios, { AxiosRequestConfig } from "axios";
import { loadAbort } from "utilities/loadAbortAxiosUtility";
import axiosInstance from "./interceptor";
/**
* Construye la configuración común para las solicitudes Axios con autenticación por token.
* @param token Token del usuario de la aplicación.
* @param additionalHeaders Opciones adicionales que se agregarán a la configuración.
* @returns La configuración común para las solicitudes Axios.
*/
const buildCommonConfig = (additionalHeaders: Record<string, string> = {}): AxiosRequestConfig => {
return {
signal: loadAbort().signal,
headers: {
'Content-Type': 'application/json',
...additionalHeaders,
},
withCredentials: true,
};
};
export const GetRequests = <T>(url: string, endpoint: string, id?: string) => {
try {
debugger
const controller = loadAbort();
const config = buildCommonConfig();
const urlRequest = id ? `${url}${endpoint}/${id}` : `${url}${endpoint}`;
console.log('Configuración de la solicitud:', config);
return {
call: axiosInstance.get<T>(urlRequest, config),
controller
};
} catch (error) {
debugger
console.error('Error in GetRequest:', error);
throw error;
}
};
tengo este interceptor donde creo un intancia de axios y donde configuro withCredentials: true
const axiosInstance = axios.create({
withCredentials: true,
});
debugger
axiosInstance.interceptors.response.use(
response => {
if (response.status === 200) {
// Mostrar mensaje de éxito
console.log("¡Solicitud exitosa!");
// Puedes usar otras opciones para mostrar el mensaje, como Toastr o notificaciones personalizadas.
}
return response;
},
);
export default axiosInstance;