By using the Identity platform, sign in a user with an email
Learn how to sign a user in using their email address and password using Identity Platform. You will be guided through each step in the sections that follow.
Before you begin
- Create an account if you're new to Google Cloud to see how well our products work in practical situations. Additionally, new users receive $300 in complimentary credits to run, test, and deploy workloads.
- Choose or create a Google Cloud project from the project selector page in the Google Cloud dashboard.
- Make sure your Cloud project's billing is enabled. Find out how to determine whether billing is enabled for a project.
Enable Identity Platform
- Navigate to the Identity Platform page in the Cloud Marketplace from the console.
- Enable Identity Platform by clicking.
Configure an email sign-in
- Check out the Identity Providers page.
- Click Add a provider on the Identity Providers page.
- Choose Email/Password from the list of providers under Select, a provider.
- Toggle Enabled to on by clicking.
- Click Save to save the provider settings.
Create a user
- Navigate to the Users page in the console.
- Visit Users
- Then select User.
- Enter your email address and password in the Email form. Both of these values should be noted because you'll need them later.
- Click Add to include the user. On the Users page, the new user is listed.
Create a web page
- Make a new file on your local computer called index.html.
- Include two fundamental HTML containers in the HTML file:
<div>Identity Platform Quickstart</div>
<div id="message">Loading...</div>
Initializing the Identity Platform Client SDK with your API key
- Navigate to the Identity Providers page in the console.
- Click Details about the application setup.
- Enter index.html with the initialization code copied. It resembles what is shown below:
<script src="https://www.gstatic.com/firebasejs/9.9.1/firebase.js"></script>
<script>
// Initialize Identity Platform
var config = {
apiKey: "abcdefg123456",
authDomain: "myproject.firebaseapp.com"
};
firebase.initializeApp(config);
</script>
Sign in the user (v9 SDK)
Step 1: First install the SDK and initialize Firebase
For version 9 of the Firebase JS SDK, which uses the JavaScript Module format, this page provides setup instructions.
The v9 SDK is optimized to work with module bundlers to remove unused code (tree-shaking) and reduce SDK size. Hence this workflow leverages npm and calls for module bundlers or JavaScript framework tooling.
- With npm, install Firebase:
- Create a Firebase App object and start Firebase up in your app.
Step 2: Accessing the Identity Platform in your Javascript
You can utilize the Firebase SDK anywhere in your app now that you've initialized it. Here is a basic app that tries to sign in to a user who has been hard-coded and displays the outcome on a web page as an example.
import { initializeApp } from 'firebase/app';
import {
onAuthStateChanged,
signInWithEmailAndPassword,
getAuth
} from 'firebase/auth';
const firebaseConfig = {/** Your app config */ };
const app = initializeApp(firebaseConfig);
const auth = getAuth(app, {/* extra options */ });
document.addEventListener("DOMContentLoaded", () => {
onAuthStateChanged(auth, (user) => {
if (user) {
document.getElementById("message").innerHTML = "Welcome, " + user.email;
}
else {
document.getElementById("message").innerHTML = "No user signed in.";
}
});
signIn();
});
function signIn() {
const email = "example@gmail.com";
const password = "hunter2";
signInWithEmailAndPassword(auth, email, password)
.catch((error) => {
document.getElementById("message").innerHTML = error.message;
});
}
Step 3: By using a module bundler for size reduction
To eliminate any unnecessary code, the Firebase Web SDK is made to cooperate with module bundlers (tree-shaking). This strategy is one that we highly advise for production apps. Module bundling for libraries installed through npm and imported into your codebase is automatically handled by tools like the Angular CLI, Next.js, Vue CLI, or Create React App.
For additional information, refer to our guide on using module bundlers with Firebase.
Step 4: Import the Javascript into your page
- Make a new document called index.html.
- Add two fundamental HTML containers, then import Step 3's bundled js: Utilize a module bundler to reduce size.
<script defer src="js/bundled.js"></script>
<div>Identity Platform Quickstart</div>
<div id="message">Loading...</div>
- Start your web browser and navigate to index.html. Your user's email is displayed in a welcome message.
Sign in the user (v8 SDK)
- You need to copy the following code into the index.html file to log the user in:
<script>
var email = "EMAIL_ID";
var password = "PASSWORD";
firebase.auth().onAuthStateChanged(function(user) {
if (user) {
document.getElementById("message").innerHTML = "Welcome, " + user.email;
} else {
document.getElementById("message").innerHTML = "No user signed in.";
}
});
firebase.auth().signInWithEmailAndPassword(email,password).catch(function(error) {
document.getElementById("message").innerHTML = error.message;
});
</script>
- Substitute the following:
EMAIL ID: The email address for the user you previously created.
PASSWORD: The user's password that you previously created
In your web browser, open index.html. Your user's email is displayed in a welcome message.
- In your web browser, open index.html. Your user's email is displayed in a welcome message.
You've used Identity Platform to log in to your first user.
Clean up
Please follow these instructions to prevent your Google Cloud account from being charged for the resources used on this page.
Delete the provider and user
To prevent charges to your account, delete the provider and user you created if you used an already-existing Google Cloud project:
- Navigate to the Identity Providers page in the console.
- Click delete next to the provider's name to remove the provider. Simply click Delete to confirm.
- Navigate to the Users page in the console.
- Visit Users
- Click delete next to the user's name to remove the one you made. Simply click Delete to confirm.
Delete the project
Deleting the project you made for the instruction is the simplest approach to stop billing.
Getting rid of the project
- Navigate to the Manage resources page in the console.
- Select the project you wish to delete from the project list, and then click Delete.
- Enter the project ID in the dialogue box, then click Shut down to destroy the project.
Enabling multi-tenancy
- Launch the console and go to the Identity Platform Settings tab.
- On the Security tab, click.
- At the bottom of the page, click Allow tenants.
This button opens the Tenants page and enables multi-tenancy.
Create your first renter at this time.
Creating a tenant
- In the console, access the Identity Platform Tenants page.
- Choose Tenant Add.
- Give the tenant a name. This doesn't have to be one of a kind; the Identity Platform will give it a distinctive ID on its own.
- Press Save.
Congratulations! An Identity Platform tenancy has been created.
Installing the Admin SDK
Node.js
You can find the Node.js Admin SDK on npm. Use npm init to create a package.json file if you don't already have one. The npm package should then be installed and saved to your package. JSON:
npm install firebase-admin --save
Require the module from any JavaScript file in your app to use it:
var admin = require('firebase-admin');
Instead, you can import the module if you're using ES2015:
import * as admin from 'firebase-admin';
Initializing the SDK using default credentials
In order to initialize the Admin SDK using the default credentials, add the following code to your server app:
Node.js
// Initialize the default app
var admin = require('firebase-admin');
var app = admin.initializeApp({
credential: admin.credential.applicationDefault()
});
Initializing the SDK with a service account key file
A service account key file may also be manually specified:
Node.js
// Initialize the default app
var admin = require('firebase-admin');
var app = admin.initializeApp({
credential: admin.credential.cert('/path/to/serviceAccountKey.json')
});
Frequently Asked Questions
What are Google Cloud Labs?
The Google Cloud Self-Paced Labs are interactive labs that take place online. These laboratories include a series of guidelines that lead through a real-world, scenario-based use case in real-time.
What is the use of Qwiklabs?
To provide you the opportunity to work on several cloud platforms and gain practical experience, Qwiklabs offers temporary credentials to both Google Cloud Platform and Amazon Web Services.
What is the full form of GCP?
The Google Cloud Platform (GCP) is a collection of cloud computing services that Google offers. It employs the same internal Infrastructure as Google for its consumer products, including Google Search, Gmail, Drive, and YouTube.
Is GCP PaaS or IaaS?
Despite starting only with PaaS, GCP now offers IaaS. The Infrastructure as a Service (IaaS) product Google Compute Engine (GCE) enables users to run workloads on Google's actual Infrastructure.
Conclusion
We covered the Identity platform in this article. We hope this article helps you to learn something new. And if you're interested in learning more, see our posts on AWS vs. Azure and Google Cloud, Google BigQuery, AWS Vs Azure Vs Google Cloud: The Platform of Your Choice?, Java knowledge for your first coding job.
Visit our practice platform Coding Ninjas Studio to practice top problems, attempt mock tests, read interview experiences, and much more.! Feel free to upvote and share this article if it has been helpful for you.
