Home
Support Forums

Netlify Functions only work with relative paths

Hoping someone can help me understand…

My Netlify Function only works when I use a relative path, not absolute path. Why?

For example, why does this work…

const fetchData = async () => {
    try {
        const data = await axios.get('/.netlify/functions/hello_async')
        console.log(data);
    } catch (error) {
        console.log(error.response);
    }
}

fetchData();

but this does not?

const fetchData = async () => {
    try {
        const data = await axios.get('https://functions.netlify.com/.netlify/functions/hello_async')
        console.log(data);
    } catch (error) {
        console.log(error.response);
    }
}

fetchData();

(Note: The URL in the second example is from the Netlify docs. I thought a CORS issue might be the problem because it’s a different domain than mine, but I don’t see any CORS errors in the console.) Am I missing something?

Hi @vcamp,

Just for some clarity, is the above code being run in browsers from your website or from within Netlify functions?

Thanks for the reply. It’s running in the browser.

HI @vcamp

This worked for me.

This did not because of CORS.

But when changing the URL to that of my own site, it did work.

1 Like

Yup, the network tab showed a CORS error, I don’t know how I missed this :man_facepalming:

After adding this Access-Control-Allow-Origin header to my Netlify function, everything is good:

exports.handler = async (event, context) => {
    return {
        headers: {
            'Access-Control-Allow-Origin': 'https://example.com',
        },
        statusCode: 200,
        body: 'hello world',
    }
}

Thank you!

2 Likes