401 error when using a variable from .env.local as the accessToken value about nextjs-starter-prismic-multi-language HOT 3 CLOSED

Hey @FrancoisLeclerc,

Thanks for posting this issue. Just FYI, for questions like this, you can always use the Prismic Community Forum. We monitor discussion on the forum more actively than on GitHub.

Unfortunately, there is no easy way to use a private repo with client-side routing. With Next projects, API requests are made client-side, so your API key will be exposed.

The only workaround would be to create your own API to proxy requests from your Next app to the Prismic API. More info in this article.

from nextjs-starter-prismic-multi-language.

Hello @FrancoisLeclerc. Thank you for letting us know about this and for sharing your solution.

Indeed, environment variables work correctly if you do not make those extra calls to Prismic on the client-side. As Sam said before, this is the only available option to make the toolbar work properly in Next.js.

The toolbar works like this; when it is active, it is always waiting or ‘listening’ to queries made to a Prismic endpoint from every page. This is how you get the documents for each displayed page and a link that redirects you to the correct document within the repository. This is not possible in Next as everything is done at build time. Static pages make no calls to Prismic. And that’s the reason why we built a method that makes these needed calls even when every page is already rendered. Being so, you have two options:

1. If you don’t need to use the edit button, you can remove the functions pageToolbarDocs and homepageToolbarDocs prismicToolbarQueries.js file altogether. As their only function is to load queries used in the Toolbar, you can remove them without any problem.

2. If you want to use the edit button: You’re going to have to expose the API token using the NEXT_PUBLIC variable name that you mentioned before. For the time being, these are the two feasible options.

You could also try and implement a proxy like the one Sam suggested. We hope this doesn’t complicate much your development process.

from nextjs-starter-prismic-multi-language.

Thank you for your help! I ended up removing them as it's not crucial for my use case.

from nextjs-starter-prismic-multi-language.