nuxt-modules / turnstile

🔥 Cloudflare Turnstile integration for Nuxt
https://cloudflare.com/products/turnstile
MIT License
217 stars 17 forks source link

Documentation way of using siteKey doesn't work #318

Open hdwebpros opened 6 days ago

hdwebpros commented 6 days ago

🐛 The bug

According to https://github.com/nuxt-modules/turnstile/blob/main/README.md this is all you need in your Nuxt config to declare the siteKey

  turnstile: {
    siteKey: '<your-site-key>',
  },

However, that provides an error NuxtTurnstile.vue:53 Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'siteKey')

I couldn't use your Stackblitz since that gives:

# This is a non-commercial version of StackBlitz.
# If you’re using this for business purposes, please purchase a license here.

~/projects/gqairkmjlx.github
❯ npm install && npm run dev
npm ERR! code EUNSUPPORTEDPROTOCOL
npm ERR! Unsupported URL Type "link:": link:..

npm ERR! A complete log of this run can be found in: /home/.npm/_logs/2024-06-25T13_56_37_750Z-debug-0.log

🛠️ To reproduce

Doesn't work. All I have on my Nuxt app for modules though is Tailwind and Turnstile. I just followed the docs as they say.

🌈 Expected behaviour

I expected not to get the error.

ℹ️ Additional context

In order to fix my issue, I put the suggested code into public runtimeConfig and it worked. My final implementation was:

  runtimeConfig: {
    public: {
      turnstile: {
        siteKey: "<my-site-key>",
      },
    },
    turnstile: {
      secretKey: "<my-secret-key>",
    },
  },