Support of feathers 4.0 crow authentication changes

Support of feathers crow authentication changes

The feathersClient will get some internal updates to the authentication part with crow. How will the new version be supported?

I tried to already use it, but there are some calls to old functions like:

return feathersClient.passport
          .verifyJWT(response.accessToken)
          .then(function(payload) {
            commit('setPayload', payload)

As feathers is now longer working with passport this part is failing.

Possible fix

Use something like const jwt = await feathersClient.getAccessToken() and commit its result to the store.

System configuration

    "@feathersjs/authentication-client": "^^4.3.0-pre.1",
    "@feathersjs/feathers": "^^4.3.0-pre.1",
    "feathers-vuex": "^2.0.0-pre.62"
    "vue": "^2.6.10",
    "vuex": "^3.1.0",

[morphatic]

Here’s what I did. When calling makeAuthPlugin() I overrode actions.responseHandler() with my own custom function. I’m using Auth0 to authenticate on the client side and not using feathers to generate an access token. I needed to add a few properties and custom logic to the auth plugin. My implementation ends up looking something like:

// src/store/services/auth.js
import { feathersClient, makeAuthPlugin, models } from '@/services/api'

export default makeAuthPlugin({
  userService: 'users',
  state: {
    my_custom_prop: null,
    ...
  },
  actions: {
    responseHandler: async ({ commit, state }, response) => {
      // my custom implementation
    }
  },
  mutations: { ... },
  getters: { ... }
}

I didn’t need to verify or decode the token returned from feathers (which is exactly the same one I sent them from the client) and the new JWTStrategy already sends you back a decoded token by default (I think it’s in response.authentication.payload).

There’s probably a lot of stuff that’s only relevant to my particular app, but if you’re interested, you can take a look at my implementation here

[popposoft]

This is my complete workaround defined in my auth.ts file

// src/services/auth.ts
import { makeAuthPlugin } from '../feathers-client';
import decode from 'jwt-decode';
import { models } from '../feathers-client';

function getValidPayloadFromToken(token: any): any {
  if (token) {
    try {
      const payload = decode(token);
      return payloadIsValid(payload) ? payload : undefined;
    } catch (error) {
      return undefined;
    }
  }
  return undefined;
}

export function payloadIsValid(payload: any): boolean {
  return payload && payload.exp * 1000 > new Date().getTime();
}

export default makeAuthPlugin({
  serverAlias: 'xxxxxxxxxx',
  userService: 'users',
  actions: {
    responseHandler({ commit, state, dispatch }: any, response: any) {
      if (response.accessToken) {
        commit('setAccessToken', response.accessToken);

        const payload = getValidPayloadFromToken(response.accessToken);
        if (!payload) {
          return response;
        }

        commit('setPayload', payload);

        let user = response[state.responseEntityField];

        // If a user was returned in the authenticate response, use that user.
        if (user) {
          if (state.serverAlias && state.userService) {
            const Model = Object.keys(models[state.serverAlias])
              .map((modelName) => models[state.serverAlias][modelName])
              .find((model) => model.servicePath === state.userService);
            if (Model) {
              user = new Model(user);
            }
          }
          commit('setUser', user);
          commit('unsetAuthenticatePending');
          // Populate the user if the userService was provided
        } else if (state.userService && payload.hasOwnProperty(state.entityIdField)) {
          return dispatch('populateUser', payload[state.entityIdField]).then(() => {
            commit('unsetAuthenticatePending');
            return response;
          });
        } else {
          commit('unsetAuthenticatePending');
        }
        return response;
      } else {
        // If there was not an accessToken in the response, allow the response to pass through to handle two-factor-auth
        return response;
      }
    },
  },
});