I my next.js blog app I have been trying to setup a global API call:
import { createClient } from "contentful";
const client = createClient({
space: process.env.CONTENTFUL_SPACE_ID,
accessToken: process.env.CONTENTFUL_ACCESS_KEY,
});
const auth_data = await client.getEntries({ content_type: "author" });
export function getAuthors() {
var authors = [];
var auth_len = auth_data.items.length;
for (var i = 0; i < auth_len; i++) {
authors.push({
authorSlug: auth_data.items[i].fields.name
.toString()
.replace(/ /g, "-")
.toLowerCase(),
authorContent: auth_data.items[i].fields.description,
authorFrontMatter: {
title: auth_data.items[i].fields.name,
image: "https:" + auth_data.items[i].fields.image.fields.file.url,
},
});
}
return authors;
}
I keep getting TypeError: Expected parameter accessToken because the environment variable will not be reached from the /lib foleder where this getAuthor() function is located. If I prefix the variable with NEXT_PUBLIC_ I could reach the environment variable from the /lib, but at the same time I would expose the variables to the browser.
Is there a way to reach the environment variable from the /lib WITHOUT exposing them to the browser?