hcaptcha-nuxt
TypeScript icon, indicating that this package has built-in type declarations

1.0.1 • Public • Published

License CircleCI npm npm bundle size

hcaptcha-module

hCaptcha integration with Nuxt.js

Usage

  1. Install
npm i hcaptcha-nuxt

or using yarn

yarn add hcaptcha-nuxt
  1. Add hcaptcha-nuxt module in nuxt.config.js
export default {
    modules: [
        "hcaptcha-nuxt"
    ],
}
  1. Specify your site key in nuxt.config.js
export default {
    hcaptcha: {
        siteKey: process.env.HCAPTCHA_SITE_KEY || ''
    }
}
  1. Add <hcaptcha> component in your-component.vue
<template>
    <div>
        <hcaptcha />
    </div>
</template>
  1. You are ready to go. get the response and send it to the server then validate it

In your-component.vue

<script>
export default {
    methods: {
        onSubmit() {
            const hcaptcha_response = this.$hcaptcha.getResponse()
        }
    }
}
</script>

Local Development

For local development, as modern browsers have strict CORS CORB,
hCaptcha will not work on file://somewhere either localhost

add 127.0.0.1 your.domain.com to the hosts to prevent this.

  • /etc/hosts on Linux,
  • /private/hosts on OSX,
  • %SystemRoot%/System32/drivers/etc/hosts on Windows.

License

MIT

Package Sidebar

Install

npm i hcaptcha-nuxt

Weekly Downloads

6

Version

1.0.1

License

MIT

Unpacked Size

6.89 kB

Total Files

7

Last publish

Collaborators

  • kkent030315