This package provides capabilities that extend the Avoka Transact platform for users wishing to allow auto-filling the form with data from Facebook account.
This package provides the following components:
Facebook Sign In
A Maestro button to sign in to a Facebook account
A Maestro component that includes the sign in button, use this profile button, change profile button and skip.
The below fields can be fetched from Facebook account
|First Name||Facebook user first name|
|Last Name||User last name|
|Middle Name||User middle name|
|Gender||male or female|
|Email Address||User email address|
|Date Of Birth||Format dd/MM/yyyy|
|Location||For example: Manly NSW Australia|
|Country||Country name, for example: Australia|
|State||State code, for example: NSW|
|Suburb||Suburb name, for example: Manly|
Clients must ensure they are appropriately licenses in order to use this package. Organisations who wish to use this package are required to setup account and create application with Facebook directly.
This package has the following compatibility requirements:
|Transact Manager||5.0.0 or above|
|Transact Maestro||5.0.0 or above|
To install this package please walk through the following procedure:
- Unzip the package to a directory on your computer
- Import each archive found in the libraries folder to Maestro. Importing these into the Organisation level libraries folder is recommended as this will make the components available to all projects, however they can be imported at the Project level if required.
The Content Security Policy (CSP) response header helps you reduce XSS risks on modern browsers by declaring what dynamic resources are allowed to load via a HTTP Header, thereby protecting your solution from a range of vulnerability attacks.
script-src 'self' https://connect.facebook.net/en_US/sdk.js https://graph.facebook.com; object-src 'none';
For more information see CSP on The Avoka Community
Creating your Client Id
To create your Facebook client id you will need to visit the Facebook for developers.
- In order for your applications to access Facebook member data, you would need to create an app in Facebook. If you have an existing application, select it to modify its settings.
- From the 'Product Setup' - add new product called 'Facebook Login'.
- Under 'Client OAuth Setting' set the flag 'Embedded Browser OAuth Login'
- Navigate to Setting -> Basic and under 'Website' section add the base domain for your forms gateway in Transact (e.g. 'https://transact.yourdomain.com')
To configure this component please walk through the following procedure:
- Open your form in Maestro and drag and drop the 'Facebook Auto-Fill' component from the Palette
- Open the properties section of the 'Login with Facebook' button.
- Under 'API Config' section, set your Client Id. See the section below called 'Creating your Client Id'.
- Under 'Prefill Mappings' section, map the field name to the field path. (For example 'First Name' is mapped to field path 'data.firstName')
- Optional, under 'Options' section, uncheck the 'Show Profile Details' flag to auto fill the form automatically after the user signed in to Facebook, without showing the profile.
- Optional, under 'Options' section, check the 'Auto Logout' flag to force logged out from Facebook account after the auto filling the form.
The Maestro widget Facebook Sign In supports 3 states:
- optin - this is the initial state.
- profileRetrieved - this state is set after the user has logged in to Facebook, and his profile is displayed. Then a rule called onProfileRetrieved is triggered to allow adding some custom implementation.
- completed - this state is set after the form fields are filled with Facebook retrieved data. Then a rule called onCompleted is triggered to allow adding some custom implementation.
By default the options available after successfully signing in to Facebook are:
- 'Use This Profile' - Auto fill the form with the displayed profile
- 'Change Profile' - Sign out from the current Facebook account, and sign in with different account
- 'Skip' - Ignore this profile and go back
- Added two new rule templates. The first one called onCompleted which runs after populating the form fields. The second rule called onProfileRetrieved which runs after the profile is retrieved.
- Added rule helpers Is Completed and Is Profile Retrieved.
Facebook Auto-Fill component
|Show Change Profile Button||Options||Show or hide the button 'Change Profile'.||boolean||
|Show Use This Profile Button||Options||Show or hide the button 'Use This Profile'.||boolean||
|Insights Facebook Prefill||Insights Milestone Events||If selected, a milestone event will be sent to Transact Insights when form is filled from Facebook.||boolean||
Facebook sign in widget button
You may add your own logic to handle the following rule types triggered by this component:
- On Completed : a script to run after retrieving the data from Facebook and populating the fields.
- On Profile Retrieved : a script to run after the user has logged in to Facebook and their profile is retrieved.
The following rule helpers can be used when right-clicking on this component in a script editor:
- Is Completed
- Is Profile Retrieved
|Client ID||API Config||Facebook client id||text|
|Show Profile Details||Options||Show Facebook profile details before auto filling the form||boolean||
|Auto Logout||Options||Force logged out from Facebook account, after the auto filling the form||boolean||
|Facebook Login Image||Options||Select from the available images resources, or upload a new one||image||
|Prefill Mappings||Prefill Mappings||Map the field name to the field path. (For example 'First Name' is mapped to field path 'data.firstName')
Facebook actions container Library: exchange.facebook