Can't get 8base auth to work

Dev Support
1

I’m trying to get the default authentication working. I have a simple web app as a client, I’m just trying to follow the docs and do the minimum amount of configuration to get a user account to authenticate and then make a query while being authenticated.

I have a few questions/issues.

  • auth.currentUser does not actually exist in the SDK. The docs describe it as the way to get the idToken after logging in, but it’s undefined.
  • auth.authorize() seems to not work, but the login URL I get from the console does work
  • auth.signOut() forwards me to an error page: “An error was encountered with the requested page.”
  • In docs, the parameter logoutRedirectURI seems to be spelled wrong (it seems like it’s supposed to be logoutRedirectUri?)

My most immediate issue is: how am I supposed to get the ID token after login?

Do I have to manually add it to each API request? Do I have I to worry about refreshing it? The SDK has an autoRefresh parameter, but the docs still frequently refer to updating it upon errors.

When I delved deeper into the source code, I found a whole host of different packages on GitHub. It’s a bit difficult to understand what packages are used and up to date, and which are possible

Is there a straightforward, simple example of the most up-to-date, working client-side implementation of auth I could see as a new user? I can see there has been changes to the platform recently, and I gather the docs and SDKs are not necessarily up to date.

I’m using 8base-js-sdk. I can see that there are quite a few packages, but that’s what’s shown in the SDK section of the docs so I assume it’s the newest one.

2

Hello @jerryjappinen !
Yeah, I get your pain, our repo and docs can be kinda messy, we’re working on it though.

The main and most up-to-date SDK is https://github.com/8base/sdk and here is the Auth module: https://github.com/8base/sdk/tree/master/packages/core/auth (note that WEB_8BASE_COGNITO is the default 8base auth strategy at the moment).

Here are the few working examples for 3 type of authentication profiles available:

Hope these materials will help you handle the auth.

As for your questions:

1 Like
3

Thanks for the help. Working on this now.

I can’t get 8base-sdk to install/set up correctly. I consistently get runtime output about missing dependencies after doing npm install 8base-sdk. I’m not using Apollo or React.

I do get an install-time message about required peer dependencies (@apollo/client and graphql). I don’t want to use these packages and am concerned about bundle sizes and dependency management.

I did an initial pass to set up the SDK in my client based on the Vue sample app you linked to, and I didn’t see any part of the code that would actually need any of this, since I’m using graphql-request for doing the GraphQL communication. Still, the package.json looks like this:

"dependencies": {
    "@apollo/client": "^3.4.10",
    "8base-sdk": "^2.5.1",
    "apollo-cache-inmemory": "^1.6.6",
    "apollo-client": "^2.6.10",
    "apollo-link-context": "^1.0.20",
    "apollo-link-error": "^1.1.13",
    "apollo-link-http": "^1.5.17",
    "core-js": "^2.6.5",
    "graphql-request": "^3.5.0",
    "graphql-tag": "^2.12.5",
    "react": "^17.0.2"
}

Are these extra packages really necessary? Or is there something wrong with how this builds on my end?

Full output when I load up my page (on Nuxt3):

 > node_modules/@8base/apollo-client/dist/index.js:20:25: error: Could not resolve "@apollo/client" (mark it as external to exclude it from the bundle, or surround it with try/catch to handle the failure at run-time)
    20 │ const client_1 = require("@apollo/client");

 > node_modules/@8base/apollo-links/dist/SubscriptionLink.js:13:21: error: Could not resolve "@apollo/client/link/ws" (mark it as external to exclude it from the bundle, or surround it with try/catch to handle the failure at run-time)
    13 │ const ws_1 = require("@apollo/client/link/ws");

 > node_modules/@8base/apollo-client/dist/index.js:22:29: error: Could not resolve "@apollo/client/link/batch-http" (mark it as external to exclude it from the bundle, or surround it with try/catch to handle the failure at run-time)
    22 │ const batch_http_1 = require("@apollo/client/link/batch-http");

 > node_modules/@8base/apollo-links/dist/SignUpLink.js:32:25: error: Could not resolve "@apollo/client" (mark it as external to exclude it from the bundle, or surround it with try/catch to handle the failure at run-time)
    32 │ const client_1 = require("@apollo/client");

 > node_modules/@8base/apollo-links/dist/AuthHeadersLink.js:24:25: error: Could not resolve "@apollo/client" (mark it as external to exclude it from the bundle, or surround it with try/catch to handle the failure at run-time)
    24 │ const client_1 = require("@apollo/client");

 > node_modules/@8base/apollo-links/dist/TokenRefreshLink.js:24:25: error: Could not resolve "@apollo/client" (mark it as external to exclude it from the bundle, or surround it with try/catch to handle the failure at run-time)
    24 │ const client_1 = require("@apollo/client");

 > node_modules/@8base/apollo-links/dist/AuthLink.js:4:25: error: Could not resolve "@apollo/client" (mark it as external to exclude it from the bundle, or surround it with try/catch to handle the failure at run-time)
    4 │ const client_1 = require("@apollo/client");

 > node_modules/@8base/apollo-client/dist/index.js:23:24: error: Could not resolve "@apollo/client/link/error" (mark it as external to exclude it from the bundle, or surround it with try/catch to handle the failure at run-time)
    23 │ const error_1 = require("@apollo/client/link/error");

 > node_modules/@8base/apollo-links/dist/SignUpLink.js:33:24: error: Could not resolve "@apollo/client/link/utils" (mark it as external to exclude it from the bundle, or surround it with try/catch to handle the failure at run-time)
    33 │ const utils_1 = require("@apollo/client/link/utils");

 > node_modules/@8base/apollo-links/dist/SuccessLink.js:5:25: error: Could not resolve "@apollo/client" (mark it as external to exclude it from the bundle, or surround it with try/catch to handle the failure at run-time)
    5 │ const client_1 = require("@apollo/client");

 > node_modules/@8base/apollo-links/dist/utils/index.js:28:28: error: Could not resolve "@apollo/client/utilities" (mark it as external to exclude it from the bundle, or surround it with try/catch to handle the failure at run-time)
    28 │ const utilities_1 = require("@apollo/client/utilities");

 > node_modules/@8base/apollo-client/dist/index.js:24:46: error: Could not resolve "graphql-tag" (mark it as external to exclude it from the bundle, or surround it with try/catch to handle the failure at run-time)
    24 │ const graphql_tag_1 = __importDefault(require("graphql-tag"));

 > node_modules/@8base/apollo-links/dist/graphql/mutations.js:4:25: error: Could not resolve "@apollo/client" (mark it as external to exclude it from the bundle, or surround it with try/catch to handle the failure at run-time)
    4 │ const client_1 = require("@apollo/client");
4

Hi
you can use @8base/auth package standalone without @apollo/client and 8base-sdk

2 Likes
5

Thanks for the help @vyacheslav.solomin. I think I got it working now. Need to play around with the permissions more to check but seems like that was the way to go. Cheers!

1 Like
6

Hey @vyacheslav.solomin I was able to get @base/auth working - for a while. I’m at a loss however, after this error started popping up:

stack
stack1358×310 92.5 KB

Somehow the build consistently breaks. I haven’t been able to fix it. I was able to use the SDK for a while, but now I get this consistently, with a minimum repro available here: https://github.com/jerryjappinen/8base-auth-parser (should mount the app and render the constants from 8base/auth but it never makes its way to mounting the app).

I’m on Nuxt 3 which is using rollup and vite, so I’m assuming something there makes this module blow up. I would normally chalk it up to Nuxt 3 being a little bit of a moving target, but everything else is pretty stable, and I can’t really figure out how 8base/auth wants me to manage dependencies (it seems to rely on graphql-request but even trying different versions there didn’t solve this).

I’m at a loss as to how to fix this, it blocks the client app from being served now.

7

:thinking:
Looks weird.
With nuxt2 it works fine.
I suppose this some issue on rollup side, will be investigate this.

At the moment, I can suggest adding classes directly to the project to work with authorization without additional dependencies.
if needed i can provide it

8

I would appreciate it if you could post a workaround, yeah. Right now I mostly care about getting the dev server working so I can keep developing the project.

I will come back to polish up authentication later if I ever release what I’m working on. Maybe by then you’ve had the chance to make some updates and make the SDK more robust.

9

I filed an issue here: https://github.com/8base/sdk/issues/378

1 Like
10

Look at the example with an ejected authorization package without additional dependencies, if you don’t need any authorization strategy, you can safely delete the corresponding class and the dependencies that were used in it

11

Thanks for posting this. It will take me a while to comb through this and re-implement the auth, I’ll post back when I’ve had the time to go over things.

Is there any timeline for a new, more robust/easy version of the SDK? And/or updated docs?