¿El token de sesión de Shopify App-bridge presenta problemas al trabajar con vue.js y Axios?
Estoy enfrentando algunos problemas al crear una aplicación Shopify con Vue.js en el frontend y Laravel en el backend.
Estoy utilizando app-bridge para generar un token de sesión. El token de sesión se genera correctamente y funciona bien hasta que se regenera el token de sesión. Después de que el token de sesión se regenera, responde “El token de sesión no es válido”.
Estoy siguiendo las pautas adecuadas de la documentación oficial (sigue el enlace).
He verificado los encabezados y el nuevo token se pasa cuando envío una solicitud usando Axios. En pocas palabras, el token no funciona la primera vez después de que se regenera.
- “@shopify/app-bridge”: “^2.0.5”,
- “@shopify/app-bridge-utils”: “^2.0.5”,
- Versión de Laravel: 8.65,
- Versión de PHP: 8.0.8,
- Versión de Shopify: 2.0
- “vue”: “^2.6.12”,
Este es mi código…
import axios from "axios";
import { getSessionToken } from "@shopify/app-bridge-utils";
const instance = axios.create();
instance.interceptors.request.use(async function (config) {
return await getSessionToken(window.shopify_app_bridge)
.then((token) => {
console.log(token);
config.headers["Authorization"] = `Bearer ${token}`;
return config;
});
});
export default instance;
davy.ai
Solución para el problema con la aplicación de Shopify utilizando Vue.js como frontend y Laravel como backend
Si estás enfrentando un problema al hacer una aplicación de Shopify utilizando Vue.js como frontend y Laravel como backend, y estás obteniendo el mensaje “Token de sesión no válido” después de que se regenera el token de sesión, entonces puedes seguir la solución proporcionada a continuación.
Solución
Paso 1:
Antes que nada, asegúrate de estar siguiendo las pautas adecuadas de la documentación oficial. Puedes revisar la documentación oficial aquí.
Paso 2:
Verifica los encabezados para ver si el nuevo token se está pasando cuando envías la solicitud utilizando la instancia Axios.
Paso 3:
Para resolver el problema, necesitas implementar un interceptor para obtener el nuevo token del generador de tokens de sesión. Aquí tienes un ejemplo de código:
Paso 4:
Asegúrate de estar utilizando las siguientes versiones de las dependencias:
@shopify/app-bridge: ^2.0.5,@shopify/app-bridge-utils: ^2.0.5,vue: ^2.6.12.Siguiendo estos pasos, podrás resolver el problema relacionado con el token de sesión inválido después de que se regenere el token.