Child pages
  • Registration
Skip to end of metadata
Go to start of metadata

Introduction

The Registration Widget provides user interface functionality to register users under an apstrata account. Once the widget is placed in a web application page, it displays a form where a user can enter his username, password, email and other personal info. The registration process happens in two steps:

  1. An email is sent to the user after he enters his credentials and personal info in order to verify the provided email address
  2. The user needs to confirm his/her registration by clicking on the URL embedded in the email message sent in step 1
For the widget to work properly, some server side scripts need to be installed and configured in the apstrata account under which users will be registered. 

Getting the code for the Apstrata SDK

ApstrataSDK code is available as open source from GitHub at https://github.com/apstrata/SDKs/tree/master/ApstrataSDK.

ApstrataSDK depends on the dojo 1.6 framework, you can download from here: http://download.dojotoolkit.org/release-1.6.1/dojo-release-1.6.1-src.zip

Installing the Apstrata SDK

  1. Unpack the dojo zip file into your web application
  2. Copy the ApstrataSDK into your web application
  3. Define where the ApstrataSDK is located by including the following code in your main web application page

    dojo.registerModulePath("apstrata", "<path to ApstrataSDK/apstrata subfolder>") 

Configuring the Apstrata Connection Parameters

You need to set the apstrata connection parameters in the file ApstrataSDK/apstrata/sdk/ApConfig.js to use you account authentication key and secret.
    "apstrata.sdk": {
        "Connection" : {
            credentials: {
                key: "<the authentication key of your apstrata account>",
                secret: "<the secret of your apstrata account>",
            },
            serviceURL: '<the apstrata base URL, i.e. https://sandbox.apstrata.com/apsdb/rest>',
            timeout: <the connection timeout in milliseconds>
        }
    }

Installing the server side scripts

  1. Using the developer workbench, save each of the following scripts under your apstrata account 
    1. ApstrataSDK/apstrata/ui/widgets/server/widgets.common.js
    2. ApstrataSDK/apstrata/ui/widgets/server/widgets.Registration.registerUser.js
    3. ApstrataSDK/apstrata/ui/widgets/server/widgets.Registration.userExists.js
    4. ApstrataSDK/apstrata/ui/widgets/server/widgets.Registration.verifyAccount.js
NOTE: when saving the scripts, make sure to name the scripts as their corresponding file names but WITHOUT the ".js" extension

Configuring the server side scripts

After installing the server side scripts in your apstrata account, go to the script named "widgets.common" and configure the following parameters:
// The name of the project (or site) the user is subscribing to
var projectName = "";

// The name of the default group to which subscribing users will belong once registered
var defaultUsersGroup = "";

// The store where temporary registration documents will be created on the client application (user registration and/or account provisioning))
var defaultUnconfirmedRegistrationStore = "";    

// The url of the client application (user registration and/or account provisioning)
var apstrataHomeEnvironment = ";

// The auth key of the provisioning account on the client application
var apstrataHomeKey = "";

// The secret of the provisioning account on the client application
var apstrataHomeSecret = "";

// The type of registration that is required ("user" -> for user registration, or "account" -> for account creation)
var registrationType = "";

// Specify if an email should be sent to the user upon successful registration (true/false)
var sendEmailOnceRegistrationConfirmed = ;

// The URL that is sent in the verification e-mail for the subscriber to click on (you normally should not change this)
var verifyUrl = apstrataHomeEnvironment + "/apsdb/rest/" + apstrataHomeKey + "/RunScript?apsws.authMode=simple&apsdb.scriptName=widgets.Registration.verifyAccount&login=$login&d=$confirmation";

// The URL where to redirect the user after he submits his registration form
var registrationRedirectUrl = ""
 
var configuration = {
    projectName: projectName,
    defaultUsersGroup: defaultUsersGroup,
    defaultUnconfirmedRegistrationStore: defaultUnconfirmedRegistrationStore,    
    apstrataHomeEnvironment: apstrataHomeEnvironment,    
    apstrataHomeKey: apstrataHomeKey,
    registrationType: registrationType,
    registrationRedirectUrl: registrationRedirectUrl,
    sendEmailOnceRegistrationConfirmed: sendEmailOnceRegistrationConfirmed,    
    templates: {
        adminEmail: "dude@dude.com",
        subject: "$projectName Registration - Email Verification",
        body: "<div style='font-family:Calibri, font-size:11'>Hello $user,<br/><br/> Thank you for signing up to our $projectName <br/><br/> Please click on the link below to activate your account. If the link doesn't work, copy and paste the link directly into the address bar of your internet browser.<br/><a href='$url'>$url</a><br/><br/>Sincerely<br/><br/>The $projectName Team",        
        verifyUrl: verifyUrl 
    },

    templatesConfirmed: {
        adminEmail: "dude@dude.com",
        subject: "$projectName Registration confirmed",
        body: "<div style='font-family:Calibri, font-size:11'>Hello $user,<br/><br/> Welcome to our $projectName <br/><br/> Your account has been activated.<br/>Sincerely<br/><br/>The $projectName Team",
    }
}

NOTE: The above configuration assumes that the required stores have already been created in the apstrata account.

Embedding the widget in your web application

  1. Make sure to reference the dojo and apstrata core scripts and css files

    <script type="text/javascript" src="<relative path to dojo/dojo.js>" djConfig="parseOnLoad: true"></script>
    <script type="text/javascript" src="<relative path to ApstrataSDK/apstrata/sdk/apstrata.js>"></script>
    
    
    <style>
    	@import "<relative path to dojo/dijit/themes/claro/claro.css>";
    	@import "<relative path to ApstrataSDK/apstrata/ui/themes/apstrata/apstrata.css>";
    	@import "<relative path to ApstrataSDK/apstrata/ui/themes/apstrata/RegistrationWidget.css>";
    </style>
  2. Include the apstrata configuration file and the registration widget file

    dojo.require("apstrata.sdk.ApConfig")
    dojo.require("apstrata.ui.widgets.RegistrationWidget")
  3. Instantiate the registration widget and place it in your web application page

    var rw = new apstrata.ui.widgets.RegistrationWidget()
    dojo.place(rw.domNode, dojo.body())

Example

Please refer to the file "ApstrataSDK/apstrata\ui/widgets/tests/test-Registration.html" for a complete example on how to embed the widget

  • No labels