Sign In

Explains the request data, HTML form structure, and response handling required to implement the sign-in feature.
You can integrate the authentication flow based on the input fields and identifier structure.

Data Identifier

{
  "dataID": "SIGN_IN"
}
KeyDescription
dataIDCheck sign-in status

HTML

<form id="frm_sign_in">
    <input id="return_url" name="return_url" type="hidden" value="/login/success.html">
    <input type="hidden" id="fail_url" name="fail_url" value="http://domain.com/user/sign-in">
    <input name="email" type="text" value="" placeholder="Email">
    <input name="password" type="password" value="" placeholder="Password">
    <input name="remember_me" type="checkbox" id="remember_me" value="Y">
    <label for="remember_me">Remember me</label>
    <button type="submit">Sign in</button>

    <input type="hidden" id="oauth_redirect_uri" name="oauth_redirect_uri" value="https://domain.com/user/oauth-callback">
    <button type="button" class="h-btn-sign-in-google">Continue with Google</button>
</form>
  • form
    <form id="frm_sign_in"></form>

    Form that handles sign-in; the id frm_sign_in is required.

  • return_url
    <input id="return_url" name="return_url" type="hidden" value="/login/success.html">

    Redirect URL after sign-in (defaults to the site index if not provided)

  • fail_url
    <input type="hidden" id="fail_url" name="fail_url" value="http://domain.com/user/sign-in">

    Redirect URL on sign-in failure (optional)

  • email
    <input name="email" type="text" value="" placeholder="Email">

    Email address used as the sign-in ID.

  • password
    <input name="password" type="password" value="" placeholder="Password">

    Sign-in password.

  • remember_me
    <input name="remember_me" type="checkbox" id="remember_me" value="Y">

    Whether to keep the user signed in: 'Y' or 'N'

  • button
    <button type="submit"></button>

    Button that submits the sign-in form

  • oauth_redirect_uri
    <input type="hidden" id="oauth_redirect_uri" name="oauth_redirect_uri" value="https://domain.com/user/oauth-callback">

    Callback page URL that receives the authorization code after Google sign-in. Register this exact URL as an Authorized redirect URI in the Google Cloud console.

  • button
    <button type="button" class="h-btn-sign-in-google"></button>

    Google sign-in button. Add the class h-btn-sign-in-google and user.js redirects to the Google auth page on click. (Requires the Google Client ID/Secret to be set in the console System settings.)

Response Result

  • After signing in, the user is redirected to return_url.
  • The dataID of the OAuth callback page is SIGN_IN, and the page consists of a form with id="frm_sign_in" and a return_url.

Example

<form id="frm_sign_in" class="col-md-7 col-xs-12 my-4 mx-2 mx-sm-4 mx-md-auto" method="post" action="/index">
	<input type="hidden" id="return_url" name="return_url" value="http://domain.com">
    <input type="hidden" id="fail_url" name="fail_url" value="http://domain.com/user/sign-in">
	<div class="my-1"><label class="sr-only">Email</label>
		<input id="email" name="email" class="form-control" data-validation="email" data-validation-type="replace" type="text" placeholder="Email" value="">
	</div>
	<div class="my-1"><label class="sr-only">Password</label><input class="form-control" type="password" id="password" name="password" placeholder="Password" value=""></div>
	<div class="form-check lh-base mt-3">
		<input class="form-check-input" type="checkbox" id="remember_me" name="remember_me" value="Y"><label class="form-check-label" for="remember_me">Keep me signed in</label>
	</div>
	<div class="form-group mt-4">
		<button class="btn btn-outline-dark border-hbnc-primary bg-hanbnc-primary-3 w-100 border border-3" type="submit">Sign in</button>
	</div>
</form>

Related Links