Free Stuff


Download details

AngularJS authentication example AngularJS authentication example HOT

# Requires Jomres 9.9.6

# AngularJS authentication example using Implicit Grant Type

## Introduction

This is an example of how to get access to the Jomres REST API using the Implicit Grant Type.

Most Jomres example code uses the Client Credentials grant type, where both the client ID and Secret are passed by the client that's calling the Jomres API.

This approach, however, isn't ideal if you're building a web app in a javascript framework, such as AngularJS, because at all times the Secret should remain just that, a secret, and that's not possible in a javascript application.


To get around that, you need the Implicit grant type, which works slightly differently to Client Credentials.


In Client Credentials flow you send both the ID and the secret and an access token is returned. Once you have that access token, you can call the REST API.

In Implicit flow you call the Jomres server using a special url which you can find on your Client page when you create an API key pair.

Once you're logged into Jomres, you can then choose to grant access to the client ( represented by the Client ID ). Once you have granted access then the system will call the API, passing the Client ID and the secret internally, and return to you the Access Token. From this point your Javascript App would store the access token locally and then proceed to use that token to do whatever it needs to.

## Using the example code

### Install the API Core to your Jomres installation

1. First things first, if you haven't already install the API Core plugin into your Jomres installation via the Jomres Plugin Manager. You may need to visit Site Configuration : Misc tab and set the "Show API client configuration options in Jomres main menu?" option to Yes.

   Once you have done that, you will be able to create REST API clients by visiting your property manager pages > Account Details > App Key Management.

2. Click New to create a new Client ID / Secret pair. The Client ID and Secret are created for you, so give the pair an identifier, such as "Test" or "My first key". It doesn't matter what the identifier is called, it's there so that you can easily identify pairs, as you might use one pair for creating Client Credential services, and another for a javascript app.

   Don't make any other changes to that page just yet, but keep it open in your browser as you'll refer back to it in a minute.

3. Next download the angularjs_authentication_example zip file from Jomres.net.

   Unzip it to your desktop's local server. I.E. if you're using WAMP then that would typically be c:wamp64wwwangularjs_authentication_example.

   You will need to modify one, perhaps two files.

   Open up oauth_callback.html.  The line that says

   `var local_secure_page`

   might need to be changed if you have the files in a different directory to c:wamp64wwwangularjs_authentication_example

   Copy this url ( E.G. http://localhost/angularjs_authentication_example/oauth_callback.html ) to your clipboard and back in your browser change the Redirect URI in the REST API Client Details page to this uri.

   Save the file.


4. Open up app.js in the "js" directory. In the line that says

   `var jomres_authorisation_url`

   Change the URL to the Authorisation URL that's displayed in your browser. It looks something like this

   `http://localhost/joomla_portal/index.php?option=com_jomres&no_html=1&jrajax=1&Itemid=103&lang=en&task=oauth_isauthorised&response_type=token&client_id=xxxxxxxx`
   
   Save the file.

6. Save the REST API client in your Jomres browser.

7. You're now ready to test the installation. In a new tab visit http://localhost/angularjs_authentication_example/ You should see a button "login to Jomres". Click on it and you will be taken to the authorisation page on your Jomres installation. If you haven't already logged in with your property manager's username and password you will need to do that.

   Next you will see a message saying "Do You Authorize xxxxxxxx" where xxxxxxxx represents your client id that you just created. Click Yes.
   
   You should now see a message like
   
   `Secure Web Page
   Access Token: 3d9ec21300333e71bcdd58b608a0feee0b5e8898`


That's it! You're done as you've tested and confirmed that you are able to implicitly authorise a javascript appliction to work with your Jomres installation. You will now be able to create web apps that can talk to the Jomres REST API.


   

Information
Created 2017-07-02
Changed
Version
Size 4.45 KB
Rating
(0 votes)
Created by Vince Wooll
Changed by Vince Wooll
Downloads 141
License GNU/GPL external
Price

ABOUT US

vince picDeveloped and maintained by Vince Wooll, Jomres was initially conceived in early 2005 as a Mambo based solution to a client’s hotel management needs. While it wasn't originally expected to be an online booking system it quickly morphed into one as users requested more and more features.

As the number of feature requests grew Vince knew that he would need to dedicate more time to the project and in July 2005 Jomres was formally released as a commercial project. Since then, Jomres has become one of Mambo’s, and now Joomla’s, longest running projects. It has survived various versions of Mambo, then Joomla 1.0, 1.5, 1.6, 1.7, 2.5 and 3.

Aladar joined the project in 2010 after using Jomres for his own projects. He was active on the forum, helping other members of the community and eventually Vince invited him to join the team. Between 2010 and 2018 he was an integral part of the project and made many significant contributions.

Whilst not formally part of the Jomres project, Rodrigo Rocco and Vince have become firm friends. Rod is a freelancer who specialises in doing custom work for Jomres users and developing custom plugins for the system that take advantage of it's modular design. He has built many useful extensions including his fabulous Valentina Template Override Package.

Jomres and the Jomres Logo is trademarked and can't be used without written consent from the owner.

www.jomres.net is not affiliated with or endorsed by the Joomla! Project, Open Source Matters or the WordPress project. The Joomla! & WordPress names and logos are used under a limited license granted by Open Source Matters and the WordPress Projects.

© Copyright 2005 - 2020 Woollyinwales IT.