Hi @MM6th,
While that might work (I have no idea if it really will and would be inclined to think it’s not possible), I’d strongly advise against it. The email is important for users to be able to reset their password or confirm the email in the first place. Thus, changing that would be a bad idea.
But doesn’t the same process apply with a phone number? A message gets sent telling you to click a link (I’ve yet to subscribe any members to my site yet)
Understood. One again thanks a lot!
I installed yarn, and went to code the gotrue-js API but there are soooo many. It’s confusing. I chose the admin method which I’ll paste here:
document.querySelector(“form[name=‘login’]”).addEventListener(“submit”, e => {
e.preventDefault();
const form = e.target;
const { email, password } = form.elements;
auth
.login(email.value, password.value, true)
.then(response => {
const myAuthHeader = “Bearer " + response.token.access_token; //creates the bearer token
fetch(”/.netlify/functions/hello", {
headers: { Authorization: myAuthHeader },
credentials: “include”
})
.then(response => {
console.log({ response });
})
.catch(error => {…});
})
.catch(error => {…});
});
I have this coded below a custom register and flip login card. Will this handle registry and login?
Hi @MM6th,
Yes, this would do fine to login. Here’s a complete code including the import statement:
const loginForm = document.querySelector('form[name="login"]')
loginForm.addEventListener('submit', event => {
event.preventDefault()
const { email, password } = loginForm.elements
auth.login(email.value, password.value, true).then(response => {
fetch('/.netlify/functions/bar', {
headers: {
Authorization: "Bearer " + response.token.access_token
}
}).then(response => {
if (response.ok) {
return response.json()
} else {
throw response.status
}
}).then(data => {
console.log(data)
}).catch(error => {
console.log(error)
})
}).catch(error => {
console.log(error)
})
})
Inside the function, you’d have to set the user roles and return it back to the client.
Additionally, you could also use Netlify Identity Widget to handle a lot of this automatically.
Wow! Thanks! I tried but kept getting an error, so I customized a login and came to this. So , you’re saying assign the role and it will automate right? But I have to go live and do it. I can’t troubleshoot it from local host.
Hi @MM6th,
I’ll explain the flow how Role Based Access Control will work:
A user signs-up → they have no role set → they subscribe to a premium plan → you handle the payment and trigger a serverless function once they’ve successfully paid → upgrade their role in the function → return the user data with the updated role and send a cookie named nf_jwt → RBAC will match this cookie to redirect in the future.
Does this shed some light?
It sounds so encouraging, and I wish it did ring a bell but it doesn’t lol. I do know I can adjust my form for an initial sign up, and I do have a premium page where they have to pay in crypto. When you say return function is that regarding the return function in this code? I’ve coded a mean site but have never gotten this far
Oh, I am talking about the serverless function that you’d write to update the user role, like this one here:
You’d have to set the role in this function using one of the admin methods of GoTrueJS. Once it’s set, you’d have to return the user back to client. Here’s an example:
Taken from:
updatedUser is the object you’d get here:
Ok, so the first piece of code is for when they are first registering, followed by the “fetch”, followed by the code underneath which substantiates them as a payee (and admins too I think I see). Does all of this code get pasted into the initial registry page? Or both registry page and login page? And is there a manual intervention I have to take to verify they paid?
The code I linked to in the other post is all handled in the serverless function. You can’t do this in the client-side code and if you try to do it, it’d be a huge security risk as anyone could do it for themselves.
Basically, this is how you’d go: signup (client-side) → pay (client-side) → update role using serverless function (server side).
So, only this code gets pasted into my login.html page (server side)
return fetch(${identity.url}/admin/users/${payload.netlifyId}, {
method: ‘put’,
body: JSON.stringify({
app_metadata: {
roles: [payload.role]
}
}),
headers: {
Authorization: Bearer ${identity.token}
}
}).then(response => {
return response.json()
}).then(updatedUser => {
return {
statusCode: 200,
body: JSON.stringify(updatedUser)
}
})
?
Bare with me
I’m trying to simplify this as much as I can so I understand
Well, it’s not any page, it’s server side. It goes in your Netlify Functions like explained here:
You can call the function from any page on your website or even externally.
My OS rejected “npm install netlify-cli -g” as suggested in the functions section
It’s a socket issue I have to fix. I’ll catch up with you. Thanks again for pointing me in the right direction.
I need to revive this topic because I have finally done the netlify registration widget
Hi, @MM6th. I’m not sure what you mean by “revive”. You made a post here today so the topic is “revived”.
Did you have a question?
Yes. Hopefully I closed out the old post, and my new question posted. My question is how do I code my redirect file to direct users only to particular page in my website after logging in?