0x API key in Client-Side dapp

Question

From the docs, getting started section:

"Starting in June 2023, all API requests without an API key will return an error. Visit 0x Dashboard to get your API key."

"This key is unique and tied to your app. Do not share it"

And, in the tutorial:

https://0x.org/docs/0x-swap-api/guides/how-to-build-a-token-swap-dapp-with-0x-api

async  function  getPrice(){
...
const params = {
    sellToken: currentTrade.from.address,
    buyToken: currentTrade.to.address,
    sellAmount: amount,
  }

  const headers = {'0x-api-key: [api-key]'}; // This is a placeholder. Get your live API key from the 0x Dashboard (https://dashboard.0x.org/apps)

  // Fetch the swap price.
  const response = await fetch(
    `https://api.0x.org/swap/v1/price?${qs.stringify(params)}`, { headers }
    );
...
}

So, if you have a pure client-side dapp (statically served assets with no backend) (like the tutorial) that is making requests to 0x endpoints you will now be forced to expose the secret key to the client, making it accesible to everyone.

How is this the expected implementation? Does the enterprise version has taken this issue into account? Are access control lists (origin headers) considered so the abuse of the exposed API key are mitigated?

I am pretty confused right now due to the documentation stating that the api key should be kept private and showing quite the opposite in the tutorial.

I do understand that API keys will never be completely safe in full client side apps. And, at the end of day, there is always the need for a server and the extra overhead.

Or maybe I am missing something? Or why would the docs state one thing and the opposite?

Thanks in advanced.