Jak čekat na odpověď od ostatních výzvu k vytvoření žádosti o příspěvek zavolat

0

Otázka

Mám pod 2 soubory, chci se ujistit, že hovor je v pořadí. Zkoušel jsem slib a zpětné volání, musím přiznat, že nejsem 100% obeznámeni s asynchronní volání.

config.js:

import rolesJson from '../../roles';

class Config{

url;
rolesList;

constructor(callback){

    var baseurl = 'www.example.com/env';

    fetch(baseurl)
        .then(response => response.json())
        .then(data => {
            this.url = data.url;
            getAuth(data.env);
    }).catch((error) => {

    });

    const getAuth= (env) => {
        const headers = { 'Content-Type': 'application/json' };
        const options = { method: 'POST', headers, body:JSON.stringify(rolesJson(env))};
        console.log("THIS BODY SHOULD NOT BE UNDEFINED", options.body);
        fetch('www.example.com/auth', options)
            .then(response => response.json())
            .then(data => {

            }).catch((error) => {

            });
    };
}    
}
module.exports = Config;

roles.js

var roleUrl = 'www.example.com/roles';

const setEnviroment = (rolesdata,env) => {
let reqBody = {
    "environment": env,
    "components": rolesdata
}
console.log("REQUEST BODY CREATED", reqBody);
return req;
}

const getRoles = (env) => {
fetch(roleUrl)
.then(response => response.json())
.then(roles => {
    let rolesList = [];
    roles.map(x => {
        const roleObj = {
            name: x.name,
            id: x.id,
        }
        rolesList.push(roleObj);
    })
    return setEnviroment(rolesList, env);
 }).catch((error) => {

});
};
module.exports = getRoles;

Jak se mohu ujistit, že když jsem volat fetch('www.example.com/auth', options), možnosti.tělo není definován? Snažil jsem se použít async/await a zpětná volání, nic pro mě pracuje.

Jakákoliv pomoc bude velmi ocenil.

Díky

1

Nejlepší odpověď

0

Žádné starosti - sliby jsou není snadné se dostat na první. Tak za prvé, můžete se spolehnout pouze na hodnotě, pokud jste čekali, že to byl vyřešen. To lze provést, jak již poukázal, se .tak nebo s async / await.

.a pak-řešení:

var roleUrl = 'www.example.com/roles';

const setEnviroment = (rolesdata,env) => {
let reqBody = {
    "environment": env,
    "components": rolesdata
}
console.log("REQUEST BODY CREATED", reqBody);
return req;
}

const getRoles = (env) => {
fetch(roleUrl)
.then(response => response.json())
.then(roles => {
    let rolesList = [];
    roles.map(x => {
        const roleObj = {
            name: x.name,
            id: x.id,
        }
        rolesList.push(roleObj);
    })
    return setEnviroment(rolesList, env);
 });
 // we return the promise
};
module.exports = getRoles;
class Config{

url;
rolesList;

constructor(callback){

    var baseurl = 'www.example.com/env';

    fetch(baseurl)
        .then(response => response.json())
        .then(data => {
            this.url = data.url;
            getAuth(data.env);
    }).catch((error) => {

    });

    const getAuth= (env) => {
        const headers = { 'Content-Type': 'application/json' };
        const options = { method: 'POST', headers, body:JSON.stringify(rolesJson(env))};
        console.log("THIS BODY SHOULD NOT BE UNDEFINED", options.body);
        fetch('www.example.com/auth', options)
            .then(response => response.json());
        // we return the Promise
    };
}    
}
module.exports = Config;
// calling method

Config.getAuth(env).then((value) => {
    return getRoles(env); //this returns a Promise again
}).then(x => {
    // here you have the return type of getRoles
})

async-await-řešení:

var roleUrl = 'www.example.com/roles';

const setEnviroment = (rolesdata,env) => {
let reqBody = {
    "environment": env,
    "components": rolesdata
}
console.log("REQUEST BODY CREATED", reqBody);
return req;
}

const getRoles = async (env) => {
    let response await fetch(roleUrl); // awaiting fetch promise
    let roles = await response.json(); // awaiting .json()-promise
    let rolesList = [];
    roles.map(x => {
        const roleObj = {
            name: x.name,
            id: x.id,
        }
        rolesList.push(roleObj);
    })
    return setEnviroment(rolesList, env);
 };
 // async always returns a promise

module.exports = getRoles;
class Config{

url;
rolesList;

constructor(callback){

    var baseurl = 'www.example.com/env';

    fetch(baseurl)
        .then(response => response.json())
        .then(data => {
            this.url = data.url;
            getAuth(data.env);
    }).catch((error) => {

    });

    const getAuth = async (env) => {
        const headers = { 'Content-Type': 'application/json' };
        const options = { method: 'POST', headers, body:JSON.stringify(rolesJson(env))};
        console.log("THIS BODY SHOULD NOT BE UNDEFINED", options.body);
        const response = await fetch('www.example.com/auth', options);
        const body = await response.json();
        return body; // we return a Promise including the body
    };
}    
}
module.exports = Config;
// calling method

const callerMethod = async () => {
    const auth = await Config.getAuth(env);
    const roles = await getRoles(env);
    //now you can work with the resolved stuff
};

Vezměte prosím na vědomí, že callerMethod vrátí Slib sám znovu, protože to je asynchronní.

2021-11-23 07:44:07

Je tam způsob, jak vytvořit další metody, jako callerMethod? , Jako je měnící se v roles.js nebo getAuth v config.js
Tian Qin

Ano, můžete použít .pak a .tam chytit, pokud chcete. To je důvod, proč mnoho vývojářů používat async přes celou codebase
Marcel Cremer

Snažil jsem se přidat .pak a .chytit v getAuth, to nefunguje..A to celé je zabalené v konstruktoru, nemůžu dát asynchronní na konstruktor..
Tian Qin

V jiných jazycích

Tato stránka je v jiných jazycích

Русский
..................................................................................................................
Italiano
..................................................................................................................
Polski
..................................................................................................................
Română
..................................................................................................................
한국어
..................................................................................................................
हिन्दी
..................................................................................................................
Français
..................................................................................................................
Türk
..................................................................................................................
Português
..................................................................................................................
ไทย
..................................................................................................................
中文
..................................................................................................................
Español
..................................................................................................................
Slovenský
..................................................................................................................