How do I create a members only site for specific pre-approved emails?

Ask the community
, , ,
1

I need to create sites that only pre-approved email addresses can sign up to. I have all the emails in a CSV file and need to make sure that no other email addresses can be used to sign in to this site.

If anyone has any idea on how to do this using Velo I would be so grateful!

I would imagine I would create a data collection containing all the email addresses that are approved. I would then prompt the “email input text field” to query the collection above and if the the email address is not found then the sign-up button would be disabled.

Can anyone offer advice on how to achieve that?

2

Please take custom registration:

https://www.wix.com/velo/reference/wix-users-backend/register

Please see: Register a user using a 3rd party for approval

Add your own step to “verify” the user and get approved if exists in your list, else, keep it “PENDING”

3

The “3rd party” is your database check

4

Thank you so much for your response.

5

How to restrict member logins to a set list of “Whitelisted Emails”

With a lot of help and the amazing support of my account manger I now have this working on my site. The steps used are not quite what was suggested by the Velo expert above. This is the way I have it working, though I’m sure there are several ways to achieve this.

Here is the code for you:

Backend Code
import wixData from ‘wix-data’; export async function isApproved(email) { const result = await wixData.query(‘Approved’).eq(‘title’, email).find(); return result.items.length; }

Page Code (Custom Sign Up Form)

import { isApproved } from ‘backend/verify.jsw’; $w.onReady( function () { $w(‘#verifyButton’).onClick(() => checkIfApproved()); $w(‘#editButton’).onClick(() => allowEdit()); }); function allowEdit() { $w(‘#emailInput’).enable(); $w(‘#signupButton’).disable(); $w(‘#editButton’).collapse(); } async function checkIfApproved() { const email = $w(‘#emailInput’).value; const approveStatus = await isApproved(email); if (approveStatus) { $w(‘#emailInput’).disable(); $w(‘#signupButton’).enable(); $w(‘#editButton’).expand(); $w(‘#notListedText’).collapse(); } else { $w(‘#notListedText’).expand(); } }

Steps to follow:

  1. Create a collection with the whitelisted email addresses
  2. Add Members Area to the site
  3. Use “Custom Form” as the Member Signup Form’s type
  4. Add to the form the needed functionality via the Editor’s elements and a bit of code - the general idea would be to force the user to go through a validation process prior to the process of completing and registration.

You will need to add a button to the form called verifyButton.

Happy coding!