abner / nuxt-oauth Goto Github PK

nuxt-outh Simple OAuth2 integration for your Nuxt app

Usage

Get Setup

1. Install the dependency:

yarn add nuxt-oauth

2. Add to your nuxt.config.js and configure:

// nuxt.config.js

modules: ['nuxt-oauth'],
oauth: {
  sessionName: 'mySession',
  secretKey: process.env.SECRET_KEY,
  oauthHost: process.env.OAUTH_HOST,
  oauthClientID: process.env.OAUTH_CLIENT_ID,
  oauthClientSecret: process.env.OAUTH_CLIENT_SECRET,
  onLogout: (req, res) => {
    // do something after logging out
  },
  fetchUser: (accessToken) => {
    // do something to return the user
    const user = User.findByToken(accessToken)
    return user
  }
}

Use in your application

• Use the access token as you'd like from the Vuex store:

// any-component.vue

export default {
  mounted () {
    const { accessToken } = this.$store.state.oauth
    // fetch more details from somewhere...
  }
}

• Mark your authenticated page components:

// secret.vue

export default {
  authenticated: true,
  name: 'MySecretComponent'
}

• Or, manually log in:

// any-component.vue
<template>
  <a @click="login">Log In</a>
</template>
<script>
  export default {
    methods: {
      login () {
        const redirectUrl = this.$route.path 
        // Or another path to return to after logging in
        this.$router.push(`/auth/login?redirect-url=${redirectUrl}`)
      }
    }
  }
</script>

Configuration

Manual Usage

• Log In

  Redirect to /auth/login?redirect-uri=REDIRECT_URL where REDIRECT_URL is the URL you'd like to be redirected back to after successfully logging in.

• Log Out

  Redirect to /auth/logout?redirect-uri=REDIRECT_URL where REDIRECT_URL is the URL you'd like to be redirected back to after successfully logging out.

With your tests

Set options.oauth.testMode to true to tell the module to skip authentication. Using this, along with the fetchUser option, can be helpful in e2e tests to stub your test users.

Develop

git clone [email protected]:samtgarson/nuxt-oauth.git
cd nuxt-oauth
yarn
yarn test

# To use while developing other apps:
yarn link
cd ../my-other-app
yarn link nuxt-oauth

Contributing

Bug reports and pull requests are welcome on GitHub at https://github.com/samtgarson/nuxt-oauth. This project is intended to be a safe, welcoming space for collaboration, and contributors are expected to adhere to the Contributor Covenant code of conduct.

Thanks

• Many thanks to Evan You and the VueJS team for sustaining such a vibrant and supportive community around Vue JS
• Many thanks also Alex Chopin, Sébastien Chopin, Pooya Parsa and the other Nuxt contributors for creating this awesome library

License

The module is available as open source under the terms of the MIT License.