Tengo un problema con las variables ENV. En la primera solicitud con:

 export const getStaticProps = async () => { const posts = await getPosts(1); return { props: posts, revalidate: 5 }; };

todo va bien y obtiene todos los datos, pero al hacer clic en el botón quiero obtener nuevos datos y obtuve 404:

 xhr.js:177 GET http://localhost:3000/fr/undefined/ghost/api/v3/content/posts?key=undefined&fields=id%2Ctitle%2Cfeature_image%2Cslug%2Cexcerpt%2Ccustom_excerpt%2Creading_time%2Ccreated_at&include=authors%2Ctags&page=2 404 (Not Found)

como puede ver, las variables env dan como resultado undefined, no sé por qué. como obtengo los datos:

 const fetchNewData =async (currentPage)=>{ console.log(currentPage); const post = await getPosts(currentPage) console.log(post); }

Cómo uso env

 export const CONTENTKEY=process.env.contentKey export const BLOG_API = process.env.blogApiLink;

 import axios from "axios"; import {BLOG_API,CONTENTKEY} from "../segret_keys" export const getPosts = async (page) => { const pageUrl = BLOG_API + "/ghost/api/v3/content/posts/?key=" + CONTENTKEY + "&fields=id,title,feature_image,slug,excerpt,custom_excerpt,reading_time,created_at&include=authors,tags&page=" + page; console.log(pageUrl); return axios({ method: "get", url: pageUrl, }) //&filter=tag:blog,tag:Blog .then((res) => { return { status: res.status, data: res.data }; }) .catch((err) => { console.log(err.response.status, err.response.data); return { status: err.response.status, data: "" }; }); };