My goal is to create a middleware that validates the authentication and entitlement of users. The authentication details are retrieved from my store:
//store/index.js
const state = () => ({
auth: {
isLoggedIn: false
// more properties here
}
});
While the entitlements come from a plugin:
//plugins/entitlement.js
import axios from 'axios';
export default (context, inject) => {
const { env: { config: { entitlementUrl } }, store: { state: { auth: { access_token } } } } = context;
const headers = {
Authorization: `Bearer ${access_token}`,
'Content-Type': 'application/json'
};
inject('entitlement', {
isEntitled: (resourceId) => new Promise((resolve, reject) => {
axios.get(`${entitlementUrl}/entitlements`, { headers, params: { resourceId } })
.then(({ data }) => {
resolve(data.Count > 0);
})
.catch((error) => {
reject(error);
});
})
};
I have implemented this middleware but it's not functioning as expected:
//middleware/isEntitled.js
export default function ({ app, store }) {
if(store.state.auth.isLoggedIn){
let isEntitled = app.$entitlement.isEntitled('someId');
console.log('Is user entitled? ', isEntitled)
}
}
To integrate it into my configuration, I added the following:
//nuxt.config.js
router: {
middleware: 'isEntitled'
},
However, when testing, I encounter an error stating isEntitled is undefined. My intention is to verify on each page whether the user is entitled or not. How can I rectify this issue?