Passing variable to fetch API

Question

I'm fetching from Spotify and I'm trying to add a query param if the user has made a country choice. I create a const and return a set of query params depending on this choice.

I keep getting the "only absolute URLs are allowed" error but, as far as I can tell, all the options I've tried have been with absolute URLs.

I've tried hardcoding it, I've tried a ternary operator in the template literal, I've tried various combos of using strings and creating URL objets, as found in threads like this one.

There's another string interpolation for context.params.word that also uses a regex, but that works just fine.

Here's my current code:

const spotifySearchUrl = () => {
    if (reduxStore.choices.country) {
      return new URL(
        `${context.params.word.replace(/#(.*)/, "")}&type=track&market=${
          reduxStore.choices.country
        }`
      );
    } else {
      return new URL(`${context.params.word.replace(/#(.*)/, "")}&type=track`);
    }
  };

const songsRes = await fetch(
  "https://api.spotify.com/v1/search?q=" + spotifySearchUrl,
    {
      method: "GET",
      headers: {
        authorization: "Bearer " + accessToken,
      },
    }
  ).then //...cont

Answer 1

Try this:

const songsRes = await fetch(
  "https://api.spotify.com/v1/search?q=" + spotifySearchUrl(),
    {
      method: "GET",
      headers: {
        authorization: "Bearer " + accessToken,
      },
    }
  ).then //...cont