BaaS User Accounts and Password Management
Today, I thought I would expand on the User Account Creation and Authentication topic I previously covered by showing you how to allow the user to change their password within your BaaS enabled application.
In this app, I am using Kinvey as my BaaS Provider but the UI and code are the same if you are using Parse.
The app consists of 3 Edit controls: One for Username, one for Password and one for the Session ID.
There are also 4 TButtons on the form: One for Sign Up, one for Login, one for Logout, and one for Change Password.
I parented the input controls to TListbox items and added ListBoxItemGroupHeaders to divide up the UI.
Screenshot: iOS UI at design time; Windows app at runtime with Mobile Preview style
Below is the Object Pascal code for my application:
unit Unit7;
interface
uses
System.SysUtils, System.Types, System.UITypes, System.Classes, System.Variants,
FMX.Types, FMX.Controls, FMX.Forms, FMX.Graphics, FMX.Dialogs, IPPeerClient,
REST.OpenSSL, REST.Backend.ServiceTypes, REST.Backend.MetaTypes, System.JSON,
REST.Backend.KinveyServices, FMX.Edit, FMX.StdCtrls, REST.Backend.Providers,
REST.Backend.ServiceComponents, REST.Backend.KinveyProvider, FMX.ListBox,
FMX.Layouts;
type
TForm7 = class(TForm)
KinveyProvider1: TKinveyProvider;
BackendUsers1: TBackendUsers;
ButtonChangePassword: TButton;
ButtonLogin: TButton;
ButtonLogout: TButton;
ButtonSignup: TButton;
EditPassword: TEdit;
EditSessionID: TEdit;
EditUserName: TEdit;
ListBox1: TListBox;
ListBoxItem1: TListBoxItem;
ListBoxItem2: TListBoxItem;
ListBoxItem3: TListBoxItem;
ListBoxGroupHeader1: TListBoxGroupHeader;
ListBoxGroupHeader2: TListBoxGroupHeader;
ToolBar1: TToolBar;
Label1: TLabel;
procedure ButtonSignupClick(Sender: TObject);
procedure ButtonLoginClick(Sender: TObject);
procedure ButtonLogoutClick(Sender: TObject);
procedure ButtonChangePasswordClick(Sender: TObject);
private
{ Private declarations }
FLogin: TBackendEntityValue;
procedure Login;
procedure Signup;
public
{ Public declarations }
end;
var
Form7: TForm7;
implementation
{$R *.fmx}
procedure TForm7.ButtonChangePasswordClick(Sender: TObject);
var
LPassword: TJSONObject;
LUpdatedAt: TBackendEntityValue;
begin
LPassword := TJSONObject.Create;
try
LPassword.AddPair('password', EditPassword.Text);
BackendUsers1.Users.UpdateUser(FLogin, LPassword, LUpdatedAt);
Login;
finally
LPassword.Free;
end;
end;
procedure TForm7.ButtonLoginClick(Sender: TObject);
begin
Login;
end;
procedure TForm7.ButtonLogoutClick(Sender: TObject);
begin
BackendUsers1.Users.Logout;
EditSessionID.Text := '';
EditUsername.Text := '';
EditPassword.Text := '';
end;
procedure TForm7.Signup;
begin
BackendUsers1.Users.SignupUser(EditUserName.Text, EditPassword.Text, nil, FLogin);
BackendUsers1.Users.Login(FLogin);
EditSessionID.Text := FLogin.AuthToken;
end;
procedure TForm7.Login;
begin
BackendUsers1.Users.LoginUser(EditUserName.Text, EditPassword.Text, FLogin);
BackendUsers1.Users.Login(FLogin);
EditSessionID.Text := FLogin.AuthToken;
end;
procedure TForm7.ButtonSignupClick(Sender: TObject);
begin
Signup;
end;
end.
Comments
-
Saturday, 19 July 2014Hello Sarina,
Thanks for the great tutorials about using the BaaS.
But I'm missing the possibility to reset the user password.
On Parse there is a REST API command which can be used to send the Password reset request as an email.
Can this be done in Delphi XE6 too?
Regards,
Mickey -
Tuesday, 22 July 2014
Very nice, clean form design.
Any chance you'd be willing to share the Align, Anchor, etc. settings along with what the form looks like rotated landscape?
Thanks! -
Tuesday, 22 July 2014
Hi Mickey,
Thanks, I am happy to hear you find the tutorials useful.
There is no password reset function exposed on the component for initiating a password reset email. However, you should be able to set up a custom endpoint for that. For custom endpoints, please see this blog post:
http://blogs.embarcadero.com/sarinadupont/2014/04/17/sending-notifications-from-baas-enabled-desktop-apps-to-your-mobile-clients/
The other option is to add password reset functionality to your app as I outlined in this blog post.
Regards,
Sarina -
Wednesday, 23 July 2014
[...] couple of days ago, I covered how to add password reset functionality to your application for resetting the password inside your a.... A common question I got was how to leverage the cloud based password reset email functionality [...]
-
Wednesday, 23 July 2014
Hi Mickey,
I just did a blog post on how to trigger email notifications from your BaaS enabled Delphi app:
http://blogs.embarcadero.com/sarinadupont/2014/07/23/adding-new-baas-method-for-executing-a-password-reset-email-notification/
Regards,
Sarina -
Wednesday, 23 July 2014
[...] User Account Password Management [...]
-
Thursday, 24 July 2014
Hi John,
Thanks, glad you liked the tutorial. Here are some details on the UI for both portrait and landscape mode:
Toolbar : aligned to top. Toolbar label: aligned to contents, Text VertAlign: center, StyleLookUp: toollabel
TVertScrollBox: Aligned to the client
Parent the following controls to the VertScrollBox component:
- TListBox, 3 items. TListBox aligned to the top; GroupingKind: Grouped, StyleLookUp: transparentlistboxstyle
Right-click on TListBox and add a group header. Use the Items Editor to define the order of the items and group header
- Parent one TEdit to each TListBoxItem; Align each TEdit to the Right, with a Right Margin of 5 px
For both of the buttons, set Align to Top
Top Button: Margins Left: 100, Right: 30
Next Buttons: Margins Left: 100, Right: 30, Top: 30
Regards,
Sarina -
Monday, 11 August 2014
[...] User Account Password Management [...]
-
Please login first in order for you to submit comments
- Page :
- 1
Hi Sarina,
Thanks for the article, I am new to FMX and tried this example. Can login and logout to Kinvey. However I get a bad request Http 400 when trying to change the password. When looking at the documentation the backenduser.users.updateuser expects a string, but you use FLogin a backendentityvalue. Trying a string returns an error that it does not understand the request.
What am I missing? I am using Delphi Enterprise 10.1 Berlin.
Regards,
Berend