Persistant Wix-Authentication / Wix-Members-API issue

Since there were these post here…

I think many of you will have problems to work with the following APIs…

  1. Authentication-API:
  • login()

  • onLogin()

  • perhaps register() ,too.

  1. CurrentMember-API:
  • getMember()

These are the two APIs which are involved in the described issue of the posts (on my opinion).

And after some further analasying researches, i want try to explain the issued sutuation.

To answer the following questions:

  • Why does the new Member-API do not work 100%?

  • What exactly is the reason for the instability of the new Member+Authentication-API?

  • How to fix the problem, without beeing forced to use the old and depricated Wix-Users-API?

Well to be able to explain the issued situation a little bit better, i have prepared a little TEST-ENVIRONMENT, which should simulate the issued situation, when it comes to the usage of the Wix authentication + wix-members-API.

https://mt2-king.wixsite.com/website-3-1/blank-3

So give Mr-Persident a like, if he could help you to solve your issue …:laughing::rofl:

How to use the example to see the ERROR?

  1. Login with the given LOGIN-TEST-ACCOUNT.
    Take a look onto console.
    Log out again.

  2. Activate the SWITCH of the currentMember-API and do the same again, do not forget to take a look onto the given CONSOLE-LOG-RESULTS!
    Log-out again!

  3. Now activate both SWITCH-BUTTONS to activate all included APIs and run the test again.
    Take a look onto given CONSOLE-LOG-RESULTS!

To understand what this example wanted to tell you → you can show additional information by a click onto → SHOW-DETECTED-ERRORS-button.

So, i hope this example makes the issued situation more understandable for everybody.

I already tried to explain this in several different posts, but i think i was not able to give a precise and good understandable answer.

One person was already able to use this knowledge as a workaround…

Back to the questions…
Why does the new Member-API do not work 100%?

Well, like you perhaps have seen in the example, you don’t have any chance to get the ID after login the direct way.

The authentication . login - function…
https://www.wix.com/velo/reference/wix-members/authentication/login


import { authentication } from 'wix-members';

$w('#login').onClick(async () => {
  const email = $w('#email').value;
  const password = $w('#password').value;

  try {
    await authentication.login(email, password);
    console.log('Member is logged in');
  } catch (error) {
    console.error(error);
  }
});

Don’t give you anything back as result, after you have logged-in.

Because of that, you will have to use (additionaly) → the getCurrentMember() - function/API…

import { currentMember } from 'wix-members';

// Sample options value:
// {
//   fieldsets: [ 'FULL' ]
// }

currentMember.getMember(options)
  .then((member) => {
    const id = member._id;
    const fullName = `${member.contactDetails.firstName} ${member.contactDetails.lastName}`;
    return member;
  })
  .catch((error) => {
    console.error(error);
  });

To get informations about the current logged-in user.

But even this do not work → 100%. The example demonstrates exacly this issue.

Using the following SETUP…


…you still won’t be able to get the → ID ← of the current logged-in-member …


…because → .then((member) => { ← do not provide any results after loggin!

!!! AND THIS IS PERHAPS EXACTLYTHE POINT, WHERE THE ISSUE STARTS !!!

!!! And here → onLogin()-function comes into game !!!

import {authentication} from 'wix-members';

authentication.onLogin(async (member) => {
  const loggedInMember = await member.getMember();
  const memberId = loggedInMember._id;
  console.log(`Member ${memberId} logged in:`, loggedInMember);
});

Using the example and log-in with both activated functions, the login-starts to work and gives back USER-ID and all other data as RESULTS…

@Marlowe (Wix)
Perhaps you can connect to the right developement team, to test my example and proove my theoretical thoughts.

My conclusion:
Either the VELO-API-DOCs have to be changed, or the API itself has to be optimized → regarding either the login()-function of the → AUTHENTICATION-API, or regarding the → getMember()-function of the → CurrentMember-API (Members-API).

5 Likes

ADDITIONAL-THEORY/Explanation:
This also explains the → wanted REFRESH-FUNCTION<–, or the mentioned…
“i get my ID only after a page-refresh” -statements…

Hi @russian-dima !

I’m Gal, a product manager for the Wix Velo team; nice to meet you! First, I would like to thank you for your effort in creating this comprehensive demonstration. Your feedback plays a large part in helping our APIs improve and improve. Please keep it coming!

I’ll try to address the points you raised:

1. A call to currentMember.getMember() return undefined even due the user is logged in: you should have an “await” before the loginMember() call to make sure he did logged in, otherwise both calls for login and getting member are being fired in parallel. Let me know if it helped.

2. authentication.login() not returning any ID: in the docs, we declare that the login() function will return void once the login process is done. Note that it’s aligned with the former wix-users login() behavior, which also returned void.
This intentional decision wasn’t made to cause you any frustration :blush: In the time of working on this API, we believed that due to performance considerations, it’d be better to leave the developer the choice on whether he would like to query for the member’s details or not. We’re definitely open to rethinking this design decision, and will do so. Can you please share more details on how the ID (or other member details) may serve you? I would like to understand your use-case better.

3. onLogin and currentMember: again, this is by design and decided based on the same performance considerations that I mentioned in the second bullet. We are still trying the master the tradeoff between creating “catch-all” functions that return/do everything someone may (ever) need and between more granular ones that result in better performance but leave more freedom/decisions/steps to the developer. I would love to hear your opinion about this tradeoff. As I said, we’re open to feedback, and if needed, we will rethink our approach and do the best that we can to provide you with a great API and developer experience.

  1. You mentioned there may be an issue with register(). Can you elaborate on what’s not working as expected there?

I hope it helped you to gain some clarity on why things are as they are (at least for now :wink:).
Waiting to hear back from you!

At first :arrow_right: thanks for reply, very apreciated! Now i know that some kind person did a good job. :sweat_smile:
I will first check all your provided notes and informations and will come back to you as soon as possible, for sure.

Hello Gal, i tried to understand your suggested- checkpoint-1 and also followed your suggestion and made sure, that the USER/MEMBER is first logged-in, before i start to ask for member-data.

…you should have an “await” before the loginMember() call to make sure he did logged in, otherwise both calls for login and getting member are being fired in parallel. Let me know if it helped.

This is the code for it. Just a little bit modofied-version of the same code, like shown in the VELO-API-DOCs… (using the following two APIs)…

1) https://www.wix.com/velo/reference/wix-members/authentication/login
2) https://www.wix.com/velo/reference/wix-members/currentmember/getmember

import { authentication } from 'wix-members';
import { currentMember } from 'wix-members';

$w.onReady(function () {
    $w('#btnLogin').onClick(async () => {
        const email = $w('#inpEmail').value;
        const password = $w('#inpPassword').value;
        try {
            await authentication.login(email, password); console.log('Member is logged in');
            let member = await getMember(); console.log("Member: ",member);
        } 
        catch (error) {console.error(error);}
    });
});



function getMember() {console.log("GetMember-Function started to get the current MEMBER and it's ID...")

let options={fieldsets: [ 'FULL' ]}

currentMember.getMember(options) //options
  .then((member) => {
    const id = member._id;
    const fullName = `${member.contactDetails.firstName} ${member.contactDetails.lastName}`;
    return member;
  })
  .catch((error) => {
    console.error(error);
  });
}

I made sure, that the USER is logged-in first, before the getMember()-function starts to collect/return → MEMBER-DATA.

Here you can see the RESUTL:

As we can clearly see → the login was done first, then the getMember()-function starts to get → MEMBER.

But all you get is → UNDEFINED.

Until here you will agree with me, when i say → i just followed the → EXAMPLE from the VELO-API-DOCs…

  1. STEP1: using → login -->wix-authentication-api, to log in user/member…
import { authentication } from 'wix-members';
2
3// ...
4
5$w('#login').onClick(async () => {
6  const email = $w('#email').value;
7  const password = $w('#password').value;
8
9  try {
10    await authentication.login(email, password);
11    console.log('Member is logged in');
12  } catch (error) {
13    console.error(error);
14  }
15});
  1. STEP2: using–> getMember() → wix-currentMember-api, to get Member-Data.
import { currentMember } from 'wix-members';
2
3// ...
4
5// Sample options value:
6// {
7//   fieldsets: [ 'FULL' ]
8// }
9
10currentMember.getMember(options)
11  .then((member) => {
12    const id = member._id;
13    const fullName = `${member.contactDetails.firstName} ${member.contactDetails.lastName}`;
14    return member;
15  })
16  .catch((error) => {
17    console.error(error);
18  });
19
20/* Returned member object:
21 * {
22 *   "_id": "f32cbc51-a331-442b-86c2-2c664613e8b9",
23 *   "_createdDate": "2021-08-02T23:14:42Z",
24 *   "_updatedDate": "2021-08-02T23:14:58.345Z",
25 *   "lastLoginDate": "2021-08-12T19:46:33Z",
26 *   "loginEmail": "claude.morales@example.com",
27 *   "contactId": "f32cbc51-a331-442b-86c2-2c664613e8b9",
28 *   "status": "APPROVED",
29 *   "privacyStatus": "PRIVATE",
30 *   "activityStatus": "ACTIVE",
31 *   "profile": {
32 *     "nickname": "Claude Morales",
33 *     "slug": "claudemorales"
34 *   },
35 *   "contactDetails": {
36 *     "firstName": "Claude",
37 *     "lastName": "Morales",
38 *     "phones": [
39 *       "0747-769-460"
40 *     ],
41 *     "emails": [
42 *       "claude.morales@example.com"
43 *     ],
44 *     "addresses": [
45 *       {
46 *         "country": "GB"
47 *       },
48 *       {
49 *         "id": "f0f4d905-488d-44db-9080-fc29078cfad5",
50 *         "addressLine": "9373 Park Avenue",
51 *         "addressLine2": "Berkshire",
52 *         "city": "Ely",
53 *         "subdivision": "GB-ENG",
54 *         "country": "GB",
55 *         "postalCode": "PD50 8EU"
56 *       }
57 *     ],
58 *     "customFields": {}
59 *   }
60 * }
61 */

And while i already wanted to give up, because i could not find any solution and always got → UNDEFINED as result (and i really wanted to understand where i have had to put in a further → AWAIT ← like you mentioned it…

…and then…

!!! I GOT IT !!!

:grin::rofl::grin::rofl::grin::rofl::grin::rofl::grin::rofl::grin::rofl::grin::rofl::grin::rofl::grin::rofl::grin::rofl::grin::rofl::grin::rofl::grin::rofl:

But now it’s the question → was it my fault? :thinking::thinking::thinking::thinking::thinking::thinking::thinking::thinking::thinking::thinking::thinking:
I just was following the examples of the provided → currentMember-API

So what is my conclusion now?! ->> The API is wrong?! Or at least the API is for sure → incomplete !!! Why ? → because a → return ← is missing in the provided example, to make all the login-process work well !!!

I will mark the missing code-part in the provided VELO-EXAMPLE…

import { currentMember } from 'wix-members';
2
3// ...
4
5// Sample options value:
6// {
7//   fieldsets: [ 'FULL' ]
8// }
9
10 return currentMember.getMember(options)
11  .then((member) => {
12    const id = member._id;
13    const fullName = `${member.contactDetails.firstName} ${member.contactDetails.lastName}`;
14    return member;
15  })
16  .catch((error) => {
17    console.error(error);
18  });

After adding the return to the (not really working code) → it solved the issue.
So now you don’t need the onLogin-Function anymore, to get it working!

!!! PROBLEM with the missing return-data → SOLVED !!!

And now to you Gal: :grin:

If you ask me, if your suggestion helped me:
Yes indeed, it helped me, even if it was not the → await i was missing, but it let me orverthink the whole situation once again. And the result was about 25-different tries to solve the issue (until it made → boom in my

If you ask me if the provided login-user-interface fits my expectations:

  1. authentication.login() not returning any ID: in the docs, we declare that the login() function will return void once the login process is done. Note that it’s aligned with the former wix-users login() behavior, which also returned void.

Till here yes, everything is ok, with the provided API. And me as → USER<-- am also OK with the fact → that the → login()-function of the → authentication-API, gives me a → VOID ← as RESULT after(or during) login-process.

But in the VELO-API-Docs it perhaps also should be mentioned, that you also will need the following API…

…to get your login working (just as a little helping hint).

I know good experienced coder will find their way to …

…but the unexperienced will have problems to work with the example of the provided API-description and the API itself, to get the RIGHT-RESULT.

This intentional decision wasn’t made to cause you any frustration :blush: In the time of working on this API, we believed that due to performance considerations,…
Frustrating? → Yes, maybe! Especialy as i already mentioned → for the less experienced coders, this will be very frustrating, to not be able to get the right working result. For those like me → i will always find a workaround (ok → ALMOST ALWAYS xDDDDD) :sweat_smile:

it’d be better to leave the developer the choice on whether he would like to query for the member’s details or not
Here you are talking about the → options???
let options={fieldsets: [ ‘FULL’ ]}//options

If so, no i am totaly ok with the new working-style of the API, i see it as an → IMPROVEMENT ←

We’re definitely open to rethinking this design decision, and will do so. Can you please share more details on how the ID (or other member details) may serve you? I would like to understand your use-case better.
Since i could find the right solution for the issue, for me everything now makes sense!

My only wish would be → to UPDATE the VELO-API-DOCs!

So, at the end it was just one little code missing code-part, which was not mentioned in the API-Example, what caused all that trouble ???

About:
4. You mentioned there may be an issue with register(). Can you elaborate on what’s not working as expected there?

Oh, yeah there was a post i have seen once, but don’t know if i can find it again. Will come back to it, when i remember the issue :sweat_smile::sweat_smile::sweat_smile::sweat_smile:

And at last but not least → I also would ask all the other users & Velo-Masters, who probably have read this post for their opinion, or even corrections.

What do they think. All provided material here → is just out of my personal point of view.
Maybe other, see it defferent.

Let’s talk about it :laughing::wink:

Hi @russian-dima , happy new year!

Apologies for the late response, I was/am out of the office for a few days, so do expect a delay in my following response as well :slightly_smiling_face:

I must say that you’re a great storyteller! I’m enjoying your threads :sunglasses:

While I’m glad to hear that you worked it out, you’re right, and it shouldn’t be so hard to follow our docs. I’ll work with the team (and the community) on improving our documentation and optimizing our API.

Whenever you have a new feedback/question/request re. the members API - please tag me, and I’ll do my best to help!

I’m fairly new to the Velo APIs and am probably missing something obvious, but I’m still having the same issue mentioned above. I’m using a backend script, and the users must already be logged in to access the page.

Below is the function in the backend file:


/*********
backend.jsw file


import { currentMember } from ‘wix-members-backend’ ;

export function myBackendFunction ( ){

**return**  currentMember . getMember ({ fieldsets : [ 'FULL' ]}) 
. then (( member ) => { 
     **const**  fullName  =  ` ${ member . contactDetails . firstName } ${ member . contactDetails . lastName }`; 
     console . log ( fullName ) // print to console 
     **const**  userID  =  member . _id ; 
    **return**  member ; 
}) 

}


This should print the user’s name to the console, but when called in the user side, it still outputs the user as undefined. The page is members only, so there’s no chance of the user not being logged in.

I’ve tried implementing the same code without the backend file, and run into the same problem. Does anyone have a suggestion/fix?

@writers04-scoffs By any chance, is it working in production but not in preview? We have a new bug on this issue that the team is currently working to resolve.

If not, you may find some information in this thread helpful in troubleshooting the issue: https://www.wix.com/velo/forum/coding-with-velo/wixmember-not-working-after-initial-login-until-refresh