CODEWITHSUNDEEP
vue.jsnuxt.js
ottz0
ottz0

Reputation: 2605

Nuxt Secret Keys and reCaptcha

I'm using nuxt.js using the universal mode for pre-rendered html pages and have my secret key from Google reCaptcha.

Where in the nuxt.js application is the best place to store secret your keys? Do they do in the env object in nuxt.config.js?

export default {
  env: {
    secret: process.env.SECRET
  }
}

Also how does this work when the application is generated with nuxt generate and the aplication is client side? The env file stays on the server and never exposed to the client or does everything get compiled and packaged to send to the client?

Upvotes: 2

Views: 3058

Answers (3)

Aldo Escobar
Aldo Escobar

Reputation: 11

In nuxt 3 the privates and secrets must be in the runtimeConfig in the nuxt.config.ts file.

See https://nuxt.com/docs/getting-started/configuration#environment-variables-and-private-tokens

Upvotes: 0

cescur
cescur

Reputation: 46

If you have Nuxt 2.13+, you can use privateRuntimeConfig in nuxt.config.js. There you can link to your .env, and the key will be injected to server, and not be visible in frontend.

privateRuntimeConfig should hold all env variables that are private and that should not be exposed on the frontend. This could include a reference to your API secret tokens for example.

More info in the Nuxt Blog

Upvotes: 2

Nikita
Nikita

Reputation: 1

You shouldn't store your secret key on the client. The purpose of the secret key - validation the user's response. You need to store it on the backend with appropriate code for verification (https://developers.google.com/recaptcha/docs/verify)

Upvotes: 0

Related Questions