No puedo divulgar la URL y qué API estoy usando porque infringe la política de mi trabajo, pero espero poder proporcionar suficiente información para obtener ayuda. Tengo una función de JavaScript que se ejecuta con un clic (eventualmente estoy creando un formulario que hará uso de esta búsqueda).
function getdata() { let customer_po = document.getElementById("customer").value; let access_token; let data = { 'grant_type': 'REDACTED' } let state = { "state": "REDACTED" } fetch(prod_auth, { method: "POST", headers: login_header, body: new URLSearchParams(data), }) .then(response => response.json()) .then(result => console.log(result)) }Esto funciona y puedo acceder al diccionario en la consola. Sin embargo, cuando trato de usar mi variable access_token declarada anteriormente de esta manera:
.then(response => response.json()) .then(result => {access_token = result["access_token"];}) y console.log(access_token) da indefinido. Necesito acceder a esta variable en mi función getdata() para que pueda usarse como parámetro en otra llamada de búsqueda.
Si definió y asignó un valor a una variable sincrónicamente como lo hace normalmente, esa variable estará disponible hasta que abandone su ámbito. A los efectos de esta explicación (y en general), las variables de JavaScript se limitan a la función en la que se ejecutan, por ejemplo
var myVariable = 'acb123'; console.log(myVariable); // 'abc123' var myFunc = function() { var myFunctionVariable = 'def456'; console.log(myFunctionVariable); // 'def456' }; console.log(myFunctionVariable); // Uncaught ReferenceEError: myFunctionVariable is not definedDado que está usando promesas, está manejando el resultado de una asignación no sincrónica a través de funciones y las variables que usa en cada una de esas funciones de devolución de llamada se limitan solo a esas funciones. Si bien no hay ningún problema en tomar una variable con alcance actual y escribirla en la consola, tendrá el problema que describe cuando intente usar una variable asignada en otra función que no sea principal. Puede acceder al diccionario en su consola porque en realidad no está accediendo a la variable en ese punto, está accediendo al objeto guardado en su consola.
Volviendo a su declaración de búsqueda, está haciendo una llamada asíncrona, por lo que ni siquiera devolverá inmediatamente nada más que una promesa cuando se le asigne. Ya se dio cuenta de que si desea hacer algo con el resultado de la promesa cuando se completa, debe hacerlo en un método .then() encadenado. Lo que está tratando de hacer es tomar este resultado asincrónico y pasarlo a una variable utilizada y llamada sincrónicamente y eso no funcionará.
Más bien, todo lo que desea hacer, debe hacerlo en los métodos posteriores de then() :
fetch(prod_auth, { method: "POST", headers: login_header, body: new URLSearchParams(data), }) .then(response => response.json()) .then(result => result["access_token"]) .then(access_token => {} //Call your next fetch method);Especialmente si está buscando hacer cadenas más elaboradas de operaciones asincrónicas, también puede usar RxJS para simplificar un poco las asignaciones en diferentes operaciones encadenadas.