{"id":17122541,"url":"https://github.com/stephenkr/nuxt-password-protect","last_synced_at":"2025-04-13T05:38:36.144Z","repository":{"id":35063189,"uuid":"201620867","full_name":"stephenkr/nuxt-password-protect","owner":"stephenkr","description":"The Nuxt password protect module","archived":false,"fork":false,"pushed_at":"2023-03-04T04:29:22.000Z","size":2148,"stargazers_count":37,"open_issues_count":28,"forks_count":9,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-03-26T22:12:39.625Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/stephenkr.png","metadata":{"files":{"readme":"Readme.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2019-08-10T11:29:11.000Z","updated_at":"2024-09-10T17:52:23.000Z","dependencies_parsed_at":"2024-06-20T21:49:48.626Z","dependency_job_id":"3257a6bf-f88d-4793-8307-5e2ff6dbd8c9","html_url":"https://github.com/stephenkr/nuxt-password-protect","commit_stats":{"total_commits":69,"total_committers":5,"mean_commits":13.8,"dds":0.3188405797101449,"last_synced_commit":"bc4a659e37a53882010bcb9cf445fcfff0d8466d"},"previous_names":[],"tags_count":11,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/stephenkr%2Fnuxt-password-protect","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/stephenkr%2Fnuxt-password-protect/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/stephenkr%2Fnuxt-password-protect/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/stephenkr%2Fnuxt-password-protect/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/stephenkr","download_url":"https://codeload.github.com/stephenkr/nuxt-password-protect/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248670505,"owners_count":21142897,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-10-14T18:23:08.369Z","updated_at":"2025-04-13T05:38:35.898Z","avatar_url":"https://github.com/stephenkr.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"\u003ch1 align=\"center\"\u003enuxt-password-protect\u003c/h1\u003e\n\u003cp align=\"center\"\u003eA simple module used to password protect your pages or your entire website.\u003c/p\u003e\n\n\u003cp align=\"center\"\u003e\n  \u003ca href=\"https://david-dm.org/stephenkr/nuxt-password-protect\"\u003e\n    \u003cimg alt=\"\" src=\"https://david-dm.org/stephenkr/nuxt-password-protect/status.svg?style=flat-square\"\u003e\n  \u003c/a\u003e\n  \u003ca href=\"https://standardjs.com\"\u003e\n    \u003cimg alt=\"\" src=\"https://img.shields.io/badge/code_style-standard-brightgreen.svg?style=flat-square\"\u003e\n  \u003c/a\u003e\n  \u003ca href=\"https://www.npmjs.com/package/nuxt-password-protect\"\u003e\n    \u003cimg alt=\"\" src=\"https://img.shields.io/npm/v/nuxt-password-protect/latest.svg?style=flat-square\"\u003e\n  \u003c/a\u003e\n  \u003cbr/\u003e\n  \u003ca href=\"https://www.npmjs.com/package/nuxt-password-protect\"\u003e\n    \u003cimg alt=\"\" src=\"https://img.shields.io/npm/dt/nuxt-password-protect.svg?style=flat-square\"\u003e\n  \u003c/a\u003e\n  \u003ca href=\"https://circleci.com/gh/stephenkr/nuxt-password-protect\"\u003e\n    \u003cimg alt=\"\" src=\"https://img.shields.io/circleci/project/github/stephenkr/nuxt-password-protect.svg?style=flat-square\"\u003e\n  \u003c/a\u003e\n\u003c/p\u003e\n\n\u003cp align=\"center\"\u003e\n  \u003ca href=\"./CHANGELOG.md\"\u003eRelease notes\u003c/a\u003e\n\u003c/p\u003e\n\n# No longer actively maintained.\n\nPlease beaware that this module is no longer actively maintained. It will continue to be available, but not for new Nuxt features at this time.\n\n## Features\n- Require a password to access a page\n- Require a password to access the entire website\n- Full control over the password page\n\n## Usage\n\n### Add module to nuxt.config.js along with the password protect options.\n\nYour passwords can be stored as an environment variable or hardcoded in your source files.\n\n### Add module to nuxt.config.js\n\nTo setup the `nuxt-password-protect`, ensure you add the module in your nuxt.config.js file.\n\n```\nmodule.exports = {\n  modules: ['nuxt-password-protect']\n}\n```\n\n#### Options\n\nModule initialisation in nuxt.config.js\n```\nmodule.exports = {\n  modules: ['nuxt-password-protect'],\n\n  passwordProtect: {\n    enabled: true,\n    formPath: '/password',\n    password: 'hello-world',\n    tokenSeed: 101010,\n    queryString: '_pw',\n    cookieName: '_password',\n    cookie: {\n      prefix: '',\n      expires: 5\n    },\n    ignoredPaths: ['/public-page']\n  }\n}\n```\n\nWith the options you can define the basics of your website protection.\n\nYou can also enable or disable the protection using the option `enabled`, this could be a nice way to protect your website depending on the environment is has been deployed too.\n\n### To protect a page, simply add the middleware\n\n```\nexport default {\n  name: 'MyComponent',\n  middleware: ['password-protect']\n}\n```\n\n### To protect an entire website\nAdd the middle ware to your nuxt configuration file\n\n```\nmodule.exports = {\n  router: {\n    middleware: ['password-protect']\n  }\n}\n```\n\nTo allow specific pages to be accessible without password protection, add the page's full path (`$route.fullPath`) to the `ignoredPaths` option.\n\n### Using the API\n\nWe provide three methods you can use on your password form page, these will either add or remove authorisation or check if a user is authorised.\n\nYou can access these methods using the context of your vue component.\n\n*this.$passwordProtect.authorise(password)*\n\nThis method will create a cookie with a unique cookie if the user has entered the correct password.\n\n*this.$passwordProtect.isAuthorised()*\n\nIs the user authorised to view this content, this will return a boolean depending.\n\n*this.$passwordProtect.removeAuthorisation()*\n\nRemoves the users authorisation.\n\n### Using the query string\n\nWe also support granting authorisation using a querystring, by default the query string is `_pw`.\n\nSo to attempt to authorise you can do `https://mywebsite.com?_pw=password`\n\nThe query string can be changed by the protect password options in your nuxt config file.\n\n### Control the redirect\n\nIf your website supports i18n routes, you can register a callback to handle the redirect logic.\n\nAn example can be seen in the plugins folder in the example Nuxt app in this repository.\n\nTo apply the callback, create a new Nuxt plugin with the following code:\n\n```js\nexport default function({ $passwordProtect, route, app, redirect }) {\n  $passwordProtect.registerRedirectCallback(opts =\u003e {\n    const localePath = app.localePath('password')\n\n    if (route.path === localePath) {\n      return\n    }\n\n    redirect(localePath, { previousPath: route.fullPath })\n  })\n}\n```\n\nIn the case above we are handling a redirect to a localised path to show the password form.\n\n\u003e Please also ensure you handle the path if you have password protection enabled for your entire website.\n\nThe form path is used as a fallback if a callback is not registered.\n\nThe redirect callback has access to the password protect options, incase you need it, and you should be able to access the context of the application like any normal Nuxt plugin.\n\n# Demo website\n\nYou can see an example of the module at this website, https://nuxt-password-protect.netlify.com/\n\nThis code can be found in this repository at ./examples/demo.\n\n# License\n\n\u003ca href=\"./LICENSE\"\u003eMIT License\u003c/a\u003e\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fstephenkr%2Fnuxt-password-protect","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fstephenkr%2Fnuxt-password-protect","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fstephenkr%2Fnuxt-password-protect/lists"}