Cannot Get Access Token

[yang-cloudlet]

Hi,

I am trying to get Access Token, but failed. Error message is

Unable to retrieve access token for current auth strategy.

ReactStormpath.getAccessToken()
  .then((accessToken) => {
    fetch('http://localhost:3000/api/subscription', {
      method: 'get',
      headers: {
        'Authorization': 'Bearer ' + accessToken
      }
    });
  }).catch(() => {
    // Could not get access token, user is not logged in
  });

Then, realise there is no getToken method in the UserSerivce.js

Please verify this.

Thanks

[MadJay]

I have a very similar issue. I am able to login and I see the the actions USER_SET, USER_LOGIN, USER_SET get dispatched. When I call ReactStormpath.getAccessToken() I get an uncaught type error: "_reactStormpath2.default.getAccessToken is not a function"

[yang-cloudlet]

@MadJay getAccessToken was not in version 1.3.3, but after I upgrade to 2.0, you will be able to access that function. However, at least from my tests, I couldn't get the access token.

[the-overengineer]

@yangyu0311ugroop Are you using the Client API? The token store functionality is only accessible (at the time this was written) if you are. If you look at https://github.com/stormpath/stormpath-sdk-react/blob/master/src/app.js#L44, the Client-API-based ClientApiUserService is only used if you set up a base URI pointing to a different host for auth, otherwise we use the UserService which, as you rightly pointed out, does not support this operation.

@MadJay @yangyu0311ugroop was correct in pointing out only 2.X.X supports this (thanks, by the way :)). Is this still happening if you upgrade?

[MadJay]

I did upgrade to 2.0.0 Thanks! I initially just took the NPM default version, the 'not a function' error is gone. I am now where yangyu0311ugroop and am looking at your advice to him on this.

[yang-cloudlet]

@Tweety-FER Thank you for pointing that out. I do not have different hosts so no base URI was set in App, so the question what will be the easiest way to fetch the access token from the React-SDK? Because some of the functions, I am trying to use is not in React-Stormpath-SDK, I need use standard API call.

[MadJay]

I now capture the TOKEN_SET action to grab the access and refresh tokens as they are dispatched from the react-stormpath sdk. But my issue is now the same as @yangyu0311ugroop, I'm not sure how to capture the accessToken from the SDK other than via the dispatched TOKEN_SET action.

[the-overengineer]

@yangyu0311ugroop @MadJay At the moment, I believe such "hacky" solutions are the only solution directly from the React SDK, when not using the Client API for your auth needs. This will probably change in the future, when the back-end integrations also begin to support the same flow that is currently used with the Client API.

However, if you are using one of the back-end integrations, maybe the simpler solution would simply be to proxy the calls through them, implementing the new endpoints there? It's a bit more complicated than just grabbing it, but it certainly can be done (you would need to grab the header and them use the nJwt or similar to unpack it).

On the other hand, if you're just doing authentication for the tokens and want to send the tokens elsewhere, maybe using the Client API feature is the better option? That's kind of the idea of it, and that's why the ClientApiUserService implements this feature in the first place. That way you can get the token when you need it and just pass it around to wherever you need it, and without the need to set up all the nitty-gritty details of Stormpath in the back-end.

@robertjd Any thoughts on this? You're far more expert on the topic than I.

[yang-cloudlet]

@MadJay I figure it out finally. After you call React-Stormpath-Sdk login, cookie will be set from StormPath-Server (I an using the Express-Stormpath-Node).

From the front end, I am using whatwg-fetch. In the document, you shall have a look at sending cookie section. Basically, for the same origin. You use this.

fetch('/me', {
  credentials: 'same-origin'
})

And if you have different host, you use credentials: 'include', cookie will pass along when you request. I have tested both, it works.

fetch('https://example.com:1234/users', {
  credentials: 'include'
})

[SanzSeraph]

I'm receiving a javascript error indicating that getAccessToken is not a function. When I look at the source in the repository I can see where the method is defined on the App class, but when I look in my node_modulesc folder (after forcing an install of react-stormpath@2.0.0) the app.js file does not include this method.

[robertjd]

Hello everyone, thank you for all the help and debug info!

As mentioned by @Tweety-FER, the 2.x upgrade is moving this library towards using the Stormpath Client API for authentication. This change makes your app simpler, because you don't need extra code in your server to handle login, you just need to focus on protecting your endpoints with the access token that you can now get from the Client API.

In 2.0.0, the internal logic says "if the endpoints.baseUri is the same domain as the current page, use our traditional cookie approach for storing the token". In this case, getAccessToken() won't work becuaes the token is hidden in a secure cookie.

I don't see a way to override this behaviour, so I'm proposing a change to make the cookie mode an opt-in configuration, so that you can use the new token strategy as the default, with both the Client API and your own server.

Please see #175 for my proposed changes. Thanks!

[SanzSeraph]

Why doesn't the 2.0.0 version of the react-stormpath package reflect the source in this repository? Will that be changing any time soon?

[robertjd]

Hi @godsbreath , I do see that the file app.js in the es6 and lib folders is out of date, I'm not sure why that is, @typerandom or @Tweety-FER can you look at this with me?

@godsbreath can you tell us how you're wanting to include the files in your project? Thanks.

[SanzSeraph]

@robertjd, I'm using npm + webpack.

Thanks for looking into this!

[robertjd]

Hi @godsbreath , thanks for the ping - unfortunately we haven't had a chance to look into the issue with app.js. Could you compare your webpack configuration to what we have in our example app? I'm curious, because while the app.js file isn't getting updated, our example app is still working (I'm assuming it requires/imports the index.js instead of app.js). The example app is here:

https://github.com/stormpath/stormpath-express-react-example

Thanks!

[SanzSeraph]

Thanks for your reply, @robertjd . I think you're onto something with the webpack configuration. The only differences I see are implementation-specific. However, based on your suggestion I looked at the lib/index.js. Initially it did not match the contents of index.js from installing node dependencies for your example app. However, installing the package again in my own app updated the index.js file.

However, once I ran webpack in my project, the contents of index.js reverted back to the old, outdated version! I don't know what it could be if not my webpack configuration.

Edit: This gets stranger by the minute. I thought webpack was responsible, but I just uninstalled and reinstalled react-stormpath for the umpteenth time to get the latest version of index.js. Then, to see if webpack was somehow using the outdated files to rebuild index.js, I deleted app.js using a bash shell. Immediately after that, when I callled less index.js, I found the file had reverted to the old version. Am I losing my mind?