For developers: Integrate the login screen with your webpage
If you have a web page that describes your tracking solution and want a login box for direct login to your GpsGate installation, you can do it using the following methods:
Method 1: Javascript AJAX Login
Paramaters to change:
SOMEHOST_WITH_GPSGATESERVER/GpsGateServer - The domain you have installed GpsGate Server on + any sub folder.
appId=1 - Set this to 1 independent on which application the user is member of. The login mechanism will find the right application for the logged in user.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml"> <head> <title>XSS - Login</title> <script type="text/javascript" src="http://SOMEHOST_WITH_GPSGATESERVER/GpsGateServer/Services/Auth.ashx?xssproxy&appId=1&namespace=MyService"></script> <script type="text/javascript"> function login() { var username = document.getElementById('inUsername').value; var password = document.getElementById('inPassword').value; GpsGate.Server.MyService.login(username, password, function(result) { if(result == true) // OK login window.location.href = 'http://SOMEHOST_WITH_GPSGATESERVER/GpsGateServer/AppGateway.aspx'; else alert('Login not ok'); } ); } </script> <style type="text/css"> <!-- .text { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px; color: #000000; } .blue-link { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px; color: #466f93; text-decoration:none; } --> </style> </head> <body> <table> <tr> <td> <input type="text" id="inUsername" /> </td> <td> <input type="password" id="inPassword" /> </td> <td> <input type="button" id="btnLogin" value="Login" onclick="login()"/> </td> </tr> </table> <a href="http://gpsgate.com/" id="gpsgate" alt="gpsgate tracking" class="blue-link" target="_blank"> <img src="http://apps.gpsgate.com/images/ggc_small.gif" hspace="0" vspace="0" align="texttop" class="blue-link" style="border:none;" /> <span class="blue-link"> GPS Tracking</span></a> </body> </html>
Method 2: Traditional HTML form posting
Sample page that does a HTML form post login.
Error handling: Wrong logins using a custom HTML post form will be redirected to the same custom login page with a error query string.
Paramaters to change:
SOMEHOST_WITH_GPSGATESERVER/GpsGateServer - The domain you have installed GpsGate Server on + any sub folder.
Note:
The name of the username textfield have to be set to "inUsername" and the password field to "inPassword". (see example code)
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml"> <head> <title>Form Login</title> </head> <body> <form action="http://SOMEHOST_WITH_GPSGATESERVER/GpsGateServer/Login.aspx" method="post"> <table> <tr> <td> <input type="text" name="inUsername" /> </td> <td> <input type="password" name="inPassword" /> </td> <td> <input type="submit" value="Login" /> </td> </tr> </table> </form> <div id="error" style="color: red;"></div> </body> <script> function getParameterByName(name) { var regex = new RegExp("[\\?&]" + name + "=([^#]*)"); var results = regex.exec(location.search); return results === null ? null : decodeURIComponent(results[1].replace(/\+/g, " ")); } var error = getParameterByName('error'); if(error){ document.getElementById('error').innerHTML = "YOUR CUSTOM ERROR MESSAGE"; } </script> </html>
Troubleshooting
I would like to enable a client to log into the mobile app by just clicking a link in my WEB page, without having to input the user name and password
Use this format for the link:
http:\\hostname\index.aspx?username=kalle&password=VerySecretAndSecure
Where "hostname" is the domain name of your server.
Where "kalle" is the username.
Where "VerySecretAndSecure" is the password.