1

Below is my code

export const redirectDomain: any = (lang, ctx, res) => {
    let redirectString;

    const getData = async () => {
        try {
            const response = await fetch('https://www.example.com');
            const data= await response.json();

            return data;
        } catch (error) {
            console.log('[ERROR]');
        }
    };

    const data = getData();
    const redirectUrl = data.split(',');

    return redirectUrl;
};

Why the output will show error

Cannot read property 'split' of undefined

5
  • 2
    You have to const data = await getData()... though I would expect the error to be something more like data.split is not a function Commented Apr 22, 2019 at 18:00
  • 1
    don't you have to await getData() as it is async? Commented Apr 22, 2019 at 18:00
  • @PatrickRoberts The error is correct though, evaluating (undefined).a() in my console gives Uncaught TypeError: Cannot read property 'a' of undefined Commented Apr 22, 2019 at 18:20
  • @DevanshJ what you should be evaluating is const data = new Promise(() => {}); data.split(). Commented Apr 22, 2019 at 23:42
  • @PatrickRoberts Oh yeah my bad xD You are correct it says "Uncaught TypeError: data.split is not a function" Commented Apr 22, 2019 at 23:44

3 Answers 3

2

Things outside the async function won't wait for the promise to get resolved. And hence data is still undefined when you split it. So here's one of the solutions...

export const redirectDomain: any = async (lang, ctx, res) => {
    let redirectString;

    const getData = async () => {
        try {
            const response = await fetch('https://www.example.com');
            const data = await response.json();

            return data;
        } catch (error) {
            console.log('[ERROR]');
        }
    };

    const data = await getData();
    const redirectUrl = data.split(',');

    return redirectUrl;
};

Another solution (I would prefer this):

export const redirectDomain: any = async (lang, ctx, res) => {
    let redirectString;
    let data;
    try {
        const response = await fetch('https://www.example.com');
        data = await response.json();
    } catch (error) {
        console.log('[ERROR]');
    }

    const redirectUrl = data.split(',');

    return redirectUrl;
};

Also if I were to write this piece of code (let me figure out how I would handle the error xD):

export const redirectDomain: any = (lang, ctx, resp) =>
    fetch("https://www.example.com")
    .then(res => res.json())
    .then(data => Promise.resolve(data.split(",")));

The point I wanted to make is sometimes promises look better than async/await.

Sign up to request clarification or add additional context in comments.

Comments

1

Simply await getData, redirectDomain must be async to do this

-export const redirectDomain: any = (lang, ctx, res) => {
+export const redirectDomain: any = async (lang, ctx, res) => {
    let redirectString;

    const getData = async () => {
        try {
            const response = await fetch('https://www.example.com');
            const data= await response.json();

            return data;
        } catch (error) {
            console.log('[ERROR]');
        }
    };

-   const data = getData();
+   const data = await getData();
    const redirectUrl = data.split(',');

    return redirectUrl;
};

Comments

0

You get this error because you data is undefined

Try axios library, alternative to fetch

const resp = axios.get('https://www.example.com');

return resp.data;

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.