Setting up authManagement in Nuxt.js gives not authenticated error (feathers-vuex)
See original GitHub issueI am trying to implement the authManagement module in a Vue frontend (Nuxt.js) but I can’t get it to work.
Steps to reproduce
- Added the authManagement service to the feathers client.
- Created a route that takes the verifyToken from an URL parameter
User flow:
- User signs up with email and password
- feathers client creates a cookie containing an accessToken
- User gets email containing link with verifyToken in parameter
- User clicks the link and ends up in verify.vue
- Verify.vue dispatches an auth/authenticate action
- Verify.vue dispatches an ‘authManagement/create’ action containing the
{action: action, value:token}
object. (In my mind the same as sending a post request to the /authManagement endpoint
Expected behavior
The user is authenticated and posting the token verifies the user
Actual behavior
Server side error message (I think on dispatching auth/authenticate):
type: 'FeathersError',
name: 'NotAuthenticated',
message: 'Could not find stored JWT and no authentication strategy was given',
code: 401,
className: 'not-authenticated'
Client side error message (set as createError on the authManagement state):
errorOnCreate:Object
hook:Object
app:Object
data:Object
id:undefined
method:"patch"
params:Object (empty)
path:"users"
service:Object
type:"before"
message:"An id must be provided to the 'patch' method"
name:"Error"
What I don’t understand
Shouldn’t the userid of the verification action be taken from the token? Why is my cookie not recognized? Is there anything I am missing? I will happily contribute to the Vue docs if I get this working
Code
feathers.js in plugins (client)
import feathers from '@feathersjs/client'
import io from 'socket.io-client'
import { CookieStorage } from 'cookie-storage'
import authManagementService from 'feathers-authentication-management'
const socket = io(process.env.baseUrl)
const feathersClient = feathers()
.configure(feathers.socketio(socket))
.configure(feathers.authentication({ storage: new CookieStorage() }))
.configure(authManagementService())
export default feathersClient
Vuex store index.js
import Vue from 'vue' // eslint-disable-line import/no-extraneous-dependencies
import Vuex from 'vuex' // eslint-disable-line import/no-extraneous-dependencies
import feathersVuex from 'feathers-vuex'
import feathersClient from '../plugins/feathers'
import { initAuth } from 'feathers-vuex/lib/utils'
const { service, auth } = feathersVuex(feathersClient, { idField: '_id' })
Vue.use(Vuex)
const store = new Vuex.Store({
plugins: [
service('/products'),
service('/users'),
auth({ userService: '/users' }),
service('authManagement')
],
state: {},
actions: {
nuxtServerInit ({ commit }, { req }) {
return initAuth({
commit,
req,
moduleName: 'authManagement',
cookieName: 'feathers-jwt'
})
}
}
})
export default () => store
script in verify.vue
<script>
export default {
methods: {
async verifyToken() {
const authData = {
action: 'verifySignupLong',
value: this.$route.query.token
}
console.log(authData)
await this.$store.dispatch('auth/authenticate')
await this.$store.dispatch('authManagement/create', authData)
this.$router.push('/onboarding')
}
},
created () {
this.verifyToken()
}
}
</script>
Issue Analytics
- State:
- Created 6 years ago
- Comments:6 (1 by maintainers)
Top Results From Across the Web
Setting up authManagement in Nuxt.js gives not authenticated ...
I am trying to implement the authManagement module in a Vue frontend (Nuxt.js) but I can't get it to work.
Read more >Nuxt | FeathersVuex
Set the access token on the feathers client instance so that the next time authenticate is called, it will have the JWT from...
Read more >How To Implement Authentication in a Nuxt.js App
In this tutorial, you'll implement authentication in a Nuxt.js app using the Auth module. For the purpose of this tutorial we'll be using ......
Read more >https://raw.githubusercontent.com/octopusOnJellyfi...
... -plus/feathers-authentication-management/issues/96) - Migration error from ... Setting up authManagement in Nuxt.js gives not authenticated error ...
Read more >Feathers-vuex My auth state do not persist despite the install ...
I have a little problem. I'm making a project using feathers and vuex on Vue 2. In this project there is a dashboard...
Read more >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
It seems that even though you are setting up the feathers client with the cookie storage module, the JWT is still not available to the feathers client as a cookie in the server environment. Hence, the error
'Could not find stored JWT and no authentication strategy was given'
.I recommend using a debugger to set a breakpoint in your feathers-client.js so you can see if you can get access to the cookie in that context. I wrote an article on debugging Nuxt that might still be helpful even though I wrote it for a Nuxt beta release. https://codeburst.io/debugging-nuxt-js-with-visual-studio-code-724920140b8f
If you’d like to push your code to GitHub, I’d be glad to pull and troubleshoot.
Ok, I feel this is off topic here. I’ll close the issue. Thanks for the help so far 😃.