Далее JS переменные среды не работают - PullRequest
Новая
       26

Далее JS переменные среды не работают

0 голосов
/ 05 августа 2020

Я ковыряюсь с этим как минимум час и пока что в тупике. Возможно, я не понимаю документы или статьи о среде. Но, насколько я понимаю, Next JS (у меня установлена ​​последняя версия) предоставляет встроенное решение для переменных env. Таким образом, нет необходимости в пакете dotenv.

Поскольку Next JS настроен, все, что мне нужно сделать, это создать env.local для хранения моего API_KEY и другой конфиденциальной информации. Затем, как только я сохраню этот обновленный файл, я должен иметь доступ к ${process.env.API_KEY} и иметь доступ к этому значению в любом месте моего кода.

Если приведенные выше утверждения верны, я ' m не могу заставить это работать.

В моем случае я использую переменные среды для подключения к Firebase. В приведенном ниже коде это реализуется. Я получаю ошибку 500 в неправильном формате: 

Connection GRPC stream error. Code: 3 Message: 3 INVALID_ARGUMENT: 
Project id parakeat-a1-7706, is malformed: it either contains invalid 
characters or is too long. Look at https://cloud.google.com
/resource-manager/docs/creating-managing-projects#identifying_projects 
for instructions in how to get a project's id.

import * as firebase from 'firebase/app';
import 'firebase/auth';
import 'firebase/firestore';
import 'firebase/storage';
import 'firebase/analytics';

const config = {
  apiKey: process.env.FIREBASE_API_KEY,
  authDomain: process.env.FIREBASE_AUTH_DOMAIN,
  databaseURL: process.env.FIREBASE_DATABASE_URL,
  projectId: process.env.FIREBASE_PROJECT_ID,
  storageBucket: process.env.FIREBASE_STORAGE_BUCKET,
  messagingSenderId: process.env.FIREBASE_MESSAGING_SENDER_ID,
  appId: process.env.FIREBASE_APP_ID,
  measurementId: process.env.FIREBASE_MEASUREMENT_ID,
};
// Initialize Firebase
try {
  firebase.initializeApp(config);
} catch (err) {
  // we skip the "already exists" message which is
  // not an actual error when we're hot-reloading
  if (!/already exists/.test(err.message)) {
    console.error('Firebase initialization error', err.stack);
  }
}

// const firebaseAnalytics = firebase.analytics();
const firebaseStorage = firebase.storage();
const firebaseFirestore = firebase.firestore();

export { firebaseStorage, firebaseFirestore };

Идентификатор указан правильно, так что же не так? Почему, если я помещаю фактическое значение напрямую и пропускаю process.env, он успешно подключается?

Ответы [ 2 ]

2 голосов
/ 05 августа 2020

По умолчанию все переменные среды, загруженные через .env.local, доступны только в среде Node.js (в таких методах, как getStaticProps), то есть они не будут доступны браузеру.

Для того, чтобы раскрыть переменная в браузере, вы должны добавить к переменной префикс NEXT_PUBLIC_. Например: 

NEXT_PUBLIC_ANALYTICS_ID=abcdefghijk

Документы

0 голосов
/ 05 августа 2020

Я использовал вышеупомянутое решение раньше, но позже мне потребовалось включить мои переменные .env в пакет, поэтому я использовал файл next.config. js для размещения своих переменных.

Отметьте это ссылка на их документацию для справки:

Далее js - next.config. js

...