Authentication
Authentication is a crucial aspect of modern application development that involves the process of verifying and validating the identity of users or services accessing an application. It ensures that only authenticated users gain access to protected resources and features, safeguarding sensitive data and maintaining system security.
Traditionally implementing authentication can be a complex and time-consuming task. Developers often have to deal with several challenges, including integration with different Oauth providers, security concerns and more.
Gadget simplifies this process by providing a seamless integration with various OAuth providers (like Google, Shopify), eliminating the need for developers to handle the intricacies of different authentication mechanisms.
Quickstart
Authentication in Gadget is powered through the @gadgetinc/auth
package.
In your Gadget app within the routes folder is the +auth.js
file, which is a built-in registered plugin for supporting authentication out-of-the-box in your app.
routes/+auth.jsJavaScript1import { Auth } from "@gadgetinc/auth";2import { api } from "gadget-server";34export default function (server) {5 server.register(Auth, {6 gadgetManagedCredentials: true,7 api,8 providers: [9 {10 type: "google",11 clientId: process.env.GOOGLE_CLIENT_ID ?? "",12 clientSecret: process.env.GOOGLE_CLIENT_SECRET ?? "",13 scopes: ["email", "profile"],14 callbackPath: "/auth/google/callback",15 redirectTo: "/",16 },17 ],18 signInPath: "/",19 redirectToSignIn: true,20 });21}
Plugin configuration
All fields except callbackPath
are required within the file. However you have various options to configure certain fields to your apps authentication flow preferences.
gadgetManagedCredentials
- Gadget will manage your OAuth credentials to avoid you needing to set up initially. Defaults totrue
, in production it should be set tofalse
api
- your Gadget api clientredirectToSignIn
- if a user is not signed in using thepreValidation
check, then it redirects the user to the path specified bysignInPath
. Defaults tofalse
callbackPath
- this path should not be changed and will be relative to your application's environment. If you are not using Gadget-managed credentials this path, relative to your environment's domain, will need to be configured in your Google OAuth client allowed redirect URIs.signInPath
- the path to your login page. This is where users will be redirected to ifredirectToSignIn
is set totrue
. Defaults to/signin
providers
- an array of authentication providerstype
- currently the only available type is"google"
clientId
- Google OAuth client idclientSecret
- Google OAuth client secretscopes
- optional OAuth scopes to request from the user. Defaults to["email", "profile"]
for Google
Helpers
The process of building and managing authentication flows can be intricate and time-consuming, diverting developers attention from core functionalities. To address this challenge, Gadget offers a comprehensive set of authentication helpers, including hooks, components, and custom actions, specifically designed to streamline the authentication process. These authentication helpers encapsulate complex authentication logic, simplify user authentication, and ensure a smooth and secure user experience.
For more information, see the authentication helpers guide.
Auth workflows
Developers often need to build around the various pathways through which users are verified and granted access to your application, within Gadget this can be easily done using our custom hooks and components.
For more information, see the auth workflows guide
Providers
Currently, Gadget supports 2 providers (Google and Shopify) at the moment, with more to come in the future.
Google OAuth
Gadget provides OAuth integration directly with Google, allowing you to authenticate users using their Google accounts for your application. By default, new Gadget apps include Google OAuth that makes use of the gadgetManagedCredentials
. In production, you have to get your own credentials from the Google Cloud Console and set them up in Gadget.
For more information, see the building with Google OAuth guide.
Shopify OAuth
Gadget handles the OAuth process for merchants installing your application out of the box. To use the supported Shopify OAuth you must connect your Gadget app to Shopify.
For more information, see the Shopify OAuth guide.