Having trouble with API Call Sveltekit

Hi,

When i use Postman to do API call, it works and i get data back but when i use fetch in my Sveltekit app, i get errors: ‘[API] Invalid API key or access token (unrecognized login or wrong password)’.

I am using this format for the call https://{username}:{password}@{shop}.myshopify.com/admin/api/2021-10/graphql.json

This is my fetch

try {
        const result = await fetch(import.meta.env.VITE_SHOPIFY_API_ENDPOINT, {
            method: 'POST',
            headers: {
                'Content-Type': 'application/json',
                'X-Shopify-Storefront-Access-Token': import.meta.env.VITE_SHOPIFY_STOREFRONT_API_TOKEN
            },
            body: JSON.stringify({ query, variables })
        }).then((res) => res.json());

        if (result.errors) {
            console.log({ errors: result.errors });
        } else if (!result || !result.data) {
            console.log({ result });
            return 'No results found.';
        }
        console.log(result);
        return result.data;
    } catch (error) {
        console.log(error);
    }

@oso this is what worked for me. If you are working off that log rocket blog I had a lot of trouble with that setup as well.

Here is what is working for me at the moment but I am still working on it.


# Products

Product List

{#each products.data.products.edges as product}

{product.node.title} 

{/each}

Right now I am trying to get a products.json.js to store the data and then pass to the products.svelte file but I have not be successful. Let me know if you find a better way.