Xano Auth
This guide provides step-by-step instructions on integrating Xano into JetAdmin for creating a unified authentication system.
Last updated
This guide provides step-by-step instructions on integrating Xano into JetAdmin for creating a unified authentication system.
Last updated
You may find yourself in a situation where you already have a project with Xano as a backend, and you want to set up a separate customer portal with JetAdmin, so that the users from your existing app may sign in using the same credentials.
Example scenarios:
An e-commerce business using Xano for product and user data wants to integrate with JetAdmin to offer a dedicated vendor portal, where vendors can manage their products and view sales analytics.
A business uses Xano as the backend for their mobile app and JetAdmin for their web-based admin panel. They seek a unified authentication system for both platforms.
A company organizing events uses Xano to handle attendee information and wants to create a JetAdmin portal for event organizers to manage event details and attendee data.
etc.
To successfully integrate this authentication method, you will need a few things:
Xano Account: Ensure you have an active Xano account.
JetAdmin Account: Similarly, a JetAdmin account is required. Register if you haven't already.
User Table in Xano: Set up a user table in your Xano project. This table must include fields for email and password.
Auth API Endpoints: Familiarize yourself with creating and managing API endpoints in Xano, as these will be essential for authentication processes.
Assuming you already have Xano and JetAdmin accounts, your Xano users table should have at least the "email" and "password" columns.
Ensure the "password" column has a "password" type.
You will be using two endpoints:
auth/login to login the user and get the authentication token
auth/me to get the records belonging to the token
Check whether you have those endpoints created. And if you don't, create them.
Please refer to Xano documentation if you have any trouble setting it up.
While in JetAdmin, create a separate resource to host the Base URL.
While in the builder, head over to the "Data" tab on your left panel
Click on "Add Resource"
Select the "Rest API"
Name your resource
Head over to Xano and copy the base URL
Paste the Base URL and save
You will need to create a new custom authentication method.
While in the builder, head over to "Sign In & Sign Up" settings
Go to "Authentication" settings
Add a new external authentication method and select "Custom authentication"
Define the name, icon, and the team that the users will be assigned to
Head over to login workflow creation
Firstly, you need to create a new workflow node that would call the "auth/login" endpoint and pass the "email" and "password" inputs as query parameters.
Create a new node and select the "Xano auth" resource
Create a new HTTP request
Set it to "POST" and fill in the endpoint URL (.../auth/login)
Create "email" and "password" query params to be sent to Xano
Create "email" and "password" inputs to get them from Jet Admin
Pass the values from inputs to query params
Fill in the test values and test the request
Create a new node and select the "Xano auth" resource
Create a new HTTP request
Set it to "GET" and fill in the endpoint URL (.../auth/me)
Create an "Authorization" header to be sent to Xano
Create "authToken" input to get them from Jet Admin
Pass the token from inputs to query headers (input "Bearer" with a spacebar before the token)
Fill in the test value and test the request
Fill in test values for workflow parameters
Link "email" and "password" workflow parameters as inputs in the "auth/login" node
Link the "authToken" workflow parameter as an input in the "auth/me" node
Link workflow parameters from the previous step as workflow output
Test and save the workflow
Publish your changes if you haven't already
Disable/enable those methods that you are planning to use
Check whether the preview is displaying everything correctly
Customize names and icons for your external auth methods
Open up a separate browser instance
Navigate to the sign-in page and try to log in using test credentials
Check whether you are signed and have appropriate access
Get back to your admin panel and check whether the user was created in JetAdmin