fluro
Version:
Promise based HTTP Fluro client for the browser and node.js
218 lines (155 loc) • 15.7 kB
HTML
<html lang="en">
<head>
<meta charset="utf-8">
<title>Home - Documentation</title>
<script src="scripts/prettify/prettify.js"></script>
<script src="scripts/prettify/lang-css.js"></script>
<!--[if lt IE 9]>
<script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<link type="text/css" rel="stylesheet" href="styles/prettify.css">
<link type="text/css" rel="stylesheet" href="styles/jsdoc.css">
<script src="scripts/nav.js" defer></script>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
<input type="checkbox" id="nav-trigger" class="nav-trigger" />
<label for="nav-trigger" class="navicon-button x">
<div class="navicon"></div>
</label>
<label for="nav-trigger" class="overlay"></label>
<nav >
<h2><a href="index.html">Home</a></h2><h3>Classes</h3><ul><li><a href="access.html">access</a><ul class='methods'><li data-type='method'><a href="access.html#.addEventListener">addEventListener</a></li><li data-type='method'><a href="access.html#.can">can</a></li><li data-type='method'><a href="access.html#.canDeleteItem">canDeleteItem</a></li><li data-type='method'><a href="access.html#.canEditItem">canEditItem</a></li><li data-type='method'><a href="access.html#.canKnowOf">canKnowOf</a></li><li data-type='method'><a href="access.html#.canViewItem">canViewItem</a></li><li data-type='method'><a href="access.html#.has">has</a></li><li data-type='method'><a href="access.html#.isAuthor">isAuthor</a></li><li data-type='method'><a href="access.html#.removeAllListeners">removeAllListeners</a></li><li data-type='method'><a href="access.html#.removeEventListener">removeEventListener</a></li><li data-type='method'><a href="access.html#.retrieveActionableRealms">retrieveActionableRealms</a></li><li data-type='method'><a href="access.html#.retrieveCurrentSession">retrieveCurrentSession</a></li><li data-type='method'><a href="access.html#.setDefaultApplication">setDefaultApplication</a></li></ul></li><li><a href="api.html">api</a><ul class='methods'><li data-type='method'><a href="api.html#.delete">delete</a></li><li data-type='method'><a href="api.html#.generateEndpointURL">generateEndpointURL</a></li><li data-type='method'><a href="api.html#.get">get</a></li><li data-type='method'><a href="api.html#.post">post</a></li><li data-type='method'><a href="api.html#.put">put</a></li></ul></li><li><a href="app.device.html">device</a></li><li><a href="asset.html">asset</a><ul class='methods'><li data-type='method'><a href="asset.html#.avatarUrl">avatarUrl</a></li><li data-type='method'><a href="asset.html#.downloadUrl">downloadUrl</a></li><li data-type='method'><a href="asset.html#.filesize">filesize</a></li><li data-type='method'><a href="asset.html#.getUrl">getUrl</a></li><li data-type='method'><a href="asset.html#.imageUrl">imageUrl</a></li><li data-type='method'><a href="asset.html#.playerUrl">playerUrl</a></li><li data-type='method'><a href="asset.html#.posterUrl">posterUrl</a></li><li data-type='method'><a href="asset.html#.typeFromMime">typeFromMime</a></li></ul></li><li><a href="auth.html">auth</a><ul class='methods'><li data-type='method'><a href="auth.html#.addEventListener">addEventListener</a></li><li data-type='method'><a href="auth.html#.changeAccount">changeAccount</a></li><li data-type='method'><a href="auth.html#.getCurrentToken">getCurrentToken</a></li><li data-type='method'><a href="auth.html#.getCurrentUser">getCurrentUser</a></li><li data-type='method'><a href="auth.html#.impersonate">impersonate</a></li><li data-type='method'><a href="auth.html#.login">login</a></li><li data-type='method'><a href="auth.html#.logout">logout</a></li><li data-type='method'><a href="auth.html#.refreshAccessToken">refreshAccessToken</a></li><li data-type='method'><a href="auth.html#.removeAllListeners">removeAllListeners</a></li><li data-type='method'><a href="auth.html#.removeEventListener">removeEventListener</a></li><li data-type='method'><a href="auth.html#.retrieveUserFromResetToken">retrieveUserFromResetToken</a></li><li data-type='method'><a href="auth.html#.sendResetPasswordRequest">sendResetPasswordRequest</a></li><li data-type='method'><a href="auth.html#.set">set</a></li><li data-type='method'><a href="auth.html#.signup">signup</a></li><li data-type='method'><a href="auth.html#.updateUserWithToken">updateUserWithToken</a></li></ul></li><li><a href="cache.html">cache</a><ul class='methods'><li data-type='method'><a href="cache.html#.get">get</a></li><li data-type='method'><a href="cache.html#.reset">reset</a></li></ul></li><li><a href="components.html">components</a><ul class='methods'><li data-type='method'><a href="components.html#.hydrateModel">hydrateModel</a></li></ul></li><li><a href="content.html">content</a><ul class='methods'><li data-type='method'><a href="content.html#.duplicate">duplicate</a></li><li data-type='method'><a href="content.html#.external">external</a></li><li data-type='method'><a href="content.html#.filter">filter</a></li><li data-type='method'><a href="content.html#.form">form</a></li><li data-type='method'><a href="content.html#.get">get</a></li><li data-type='method'><a href="content.html#.getMultiple">getMultiple</a></li><li data-type='method'><a href="content.html#.keys">keys</a></li><li data-type='method'><a href="content.html#.list">list</a></li><li data-type='method'><a href="content.html#.query">query</a></li><li data-type='method'><a href="content.html#.related">related</a></li><li data-type='method'><a href="content.html#.retrieve">retrieve</a></li><li data-type='method'><a href="content.html#.slug">slug</a></li><li data-type='method'><a href="content.html#.submitInteraction">submitInteraction</a></li><li data-type='method'><a href="content.html#.submitPost">submitPost</a></li><li data-type='method'><a href="content.html#.thread">thread</a></li><li data-type='method'><a href="content.html#.values">values</a></li></ul></li><li><a href="date.html">date</a><ul class='methods'><li data-type='method'><a href="date.html#.countdown">countdown</a></li><li data-type='method'><a href="date.html#.dateFromID">dateFromID</a></li><li data-type='method'><a href="date.html#.formatDate">formatDate</a></li><li data-type='method'><a href="date.html#.getAge">getAge</a></li><li data-type='method'><a href="date.html#.groupEventByDate">groupEventByDate</a></li><li data-type='method'><a href="date.html#.isDifferentTimezoneThanUser">isDifferentTimezoneThanUser</a></li><li data-type='method'><a href="date.html#.isMultiDayEvent">isMultiDayEvent</a></li><li data-type='method'><a href="date.html#.localDate">localDate</a></li><li data-type='method'><a href="date.html#.militaryTimestamp">militaryTimestamp</a></li><li data-type='method'><a href="date.html#.readableEventDate">readableEventDate</a></li><li data-type='method'><a href="date.html#.readableEventTime">readableEventTime</a></li><li data-type='method'><a href="date.html#.timeago">timeago</a></li><li data-type='method'><a href="date.html#.timeline">timeline</a></li><li data-type='method'><a href="date.html#.timestampToAmPm">timestampToAmPm</a></li><li data-type='method'><a href="date.html#.timezones">timezones</a></li></ul></li><li><a href="fluro.html">fluro</a></li><li><a href="types.html">types</a><ul class='methods'><li data-type='method'><a href="types.html#.all">all</a></li><li data-type='method'><a href="types.html#.basicTypes">basicTypes</a></li><li data-type='method'><a href="types.html#.get">get</a></li><li data-type='method'><a href="types.html#.mapDefinitionItems">mapDefinitionItems</a></li><li data-type='method'><a href="types.html#.parentType">parentType</a></li><li data-type='method'><a href="types.html#.postableTypes">postableTypes</a></li><li data-type='method'><a href="types.html#.readable">readable</a></li><li data-type='method'><a href="types.html#.reloadTerminology">reloadTerminology</a></li><li data-type='method'><a href="types.html#.retrieve">retrieve</a></li><li data-type='method'><a href="types.html#.subTypes">subTypes</a></li><li data-type='method'><a href="types.html#.term">term</a></li></ul></li><li><a href="utils.html">utils</a><ul class='methods'><li data-type='method'><a href="utils.html#.arrayIDs">arrayIDs</a></li><li data-type='method'><a href="utils.html#.comma">comma</a></li><li data-type='method'><a href="utils.html#.currencySymbol">currencySymbol</a></li><li data-type='method'><a href="utils.html#.errorMessage">errorMessage</a></li><li data-type='method'><a href="utils.html#.extractFromArray">extractFromArray</a></li><li data-type='method'><a href="utils.html#.formatCurrency">formatCurrency</a></li><li data-type='method'><a href="utils.html#.getDefaultValueForField">getDefaultValueForField</a></li><li data-type='method'><a href="utils.html#.getFlattenedFields">getFlattenedFields</a></li><li data-type='method'><a href="utils.html#.getStringID">getStringID</a></li><li data-type='method'><a href="utils.html#.guid">guid</a></li><li data-type='method'><a href="utils.html#.hash">hash</a></li><li data-type='method'><a href="utils.html#.injectScript">injectScript</a></li><li data-type='method'><a href="utils.html#.machineName">machineName</a></li><li data-type='method'><a href="utils.html#.mapParameters">mapParameters</a></li><li data-type='method'><a href="utils.html#.matchInArray">matchInArray</a></li><li data-type='method'><a href="utils.html#.processCardPrioritySort">processCardPrioritySort</a></li></ul></li><li><a href="video.html">video</a><ul class='methods'><li data-type='method'><a href="video.html#.hhmmss">hhmmss</a></li><li data-type='method'><a href="video.html#.readableMilliseconds">readableMilliseconds</a></li><li data-type='method'><a href="video.html#.readableSeconds">readableSeconds</a></li></ul></li></ul>
</nav>
<div id="main">
<section class="package">
<h3> </h3>
</section>
<section class="readme">
<article><h1>Fluro Javascript API</h1>
<p><a href="https://fluro.io">Site</a> |
<a href="https://fluro-developers.github.io/fluro/">Documentation</a> |
<a href="https://developer.fluro.io">REST API Documentation</a> |
<a href="https://support.fluro.io">Support</a></p>
<h3>Javascript Frameworks</h3>
<p>Frameworks are available for Vue, Angular and React
<a href="https://www.npmjs.com/package/fluro-vue">Vue Plugin</a></p>
<h2>Installation</h2>
<p>Before installing update the <code>.npmrc</code> file with your font-awesome license number</p>
<pre class="prettyprint source lang-bash"><code>npm install fluro --save
</code></pre>
<h2>Getting Started</h2>
<pre class="prettyprint source lang-js"><code>//Import the Fluro module
import Fluro from 'fluro';
/////////////////////////////////////////////
//Set some defaults
const API_URL = 'https://api.fluro.io';
const APPLICATION_TOKEN = '$55fkshadh12425324...';
const APPLICATION_DOMAIN_NAME = 'https://myapplication.com';
/////////////////////////////////////////////
//Create a new Fluro instance
const fluro = new Fluro({
apiURL: API_URL,
applicationToken: APPLICATION_TOKEN,
domain:APPLICATION_DOMAIN_NAME,
});
/////////////////////////////////////////////
//Optionally set a default timezone (otherwise will default to browser clock timezone)
fluro.date.defaultTimezone = 'Australia/Melbourne';
</code></pre>
<h2>Authentication</h2>
<p>The FluroAuth service makes it easy to handle actions and behaviours like login, logout, signup, reset password etc.
It's often a good idea to save the user's session, which contains refresh and access tokens to local storage
Once you have authenticated the fluro module will take care of authenticating your requests, refreshing tokens before they expire and caching data
for more information checkout the <a href="https://fluro-developers.github.io/fluro/FluroAuth.html">FluroAuth module</a></p>
<p>If a static application token has been set then when a user signs out of the app all requests are made as the application instead of the user</p>
<h4>Listening to user session changes</h4>
<p>It's helpful to listen for the 'change' event so that your application can respond to a user logging in/out</p>
<pre class="prettyprint source lang-js"><code>
//Listen for when the user logs in/out
fluro.auth.addEventListener('change', userUpdated);
/////////////////////////////////////////////
//Update whenever the user session changes
function userUpdated(user) {
if(user) {
//The user is logged in and you have their session details
window.localStorage.userSession = user;
} else {
//The user is logged out
}
//Get new information for the user's 'likes', 'plays', 'pins' etc..
fluro.stats.refresh();
}
//Set the user session object if we already have it in localStorage
fluro.auth.set(window.localStorage.userSession);
</code></pre>
<h4>Logging In as a Fluro User</h4>
<p>To login and authenticate using your Fluro username and password
you can use the FluroAuth.login function, upon successfuly login all subsequent requests to the API will
be authenticated with your access token, and your token will be refreshed automatically until you sign out</p>
<pre class="prettyprint source lang-js"><code>
//Login to the server as a general Fluro user
fluro.auth.login({
'username':'you@youremail.com',
'password':'yourpassword',
}).then(function(user) {
//We are now logged in
})
.catch(function(err) {
//Couldn't sign in
console.log(err.message);
});
</code></pre>
<h4>Logging in to an application as a managed persona</h4>
<p>If your application is a public website or a whitelabelled product that you want users to be able to
sign up or log in to, you can allow them to authenticate as a 'managed persona', this allows your users
to authenticate without ever hearing or knowing about Fluro, giving you complete control over their usernames, passwords
permissions and other information. Managed persona's can sign in to your applications resulting in an access/refresh token pair
that grants them both the permissions of the persona AND the permissions of the application.</p>
<pre class="prettyprint source lang-js"><code>
//Login to the server as a persona (whitelabelled user)
//By providing the application:true property
fluro.auth.login({
'username':'you@youremail.com',
'password':'yourpassword',
}, {
application:true
}).then(function(user) {
//We are now logged in
})
.catch(function(err) {
//Couldn't sign in
console.log(err.message);
});
</code></pre>
<h4>Logging Out</h4>
<pre class="prettyprint source lang-js"><code>//Logout and clear all caches
//And revert back to the application if a token has been provided
fluro.auth.logout()
</code></pre>
<h2>Handling Errors</h2>
<p>The FluroUtils service has a handy function for translating an error into a human readable message, this can be
be helpful when needing to show error messages to the user</p>
<pre class="prettyprint source lang-js"><code>
//Get the user session
fluro.api.get('/content/event/5ca3d64dd2bb085eb9d450db')
.then(function(response) {
//Success
})
.catch(function(err) {
var errorMessage = fluro.utils.errorMessage(err);
console.log(errorMessage);
});
</code></pre></article>
</section>
</div>
<br class="clear">
<footer>
Documentation generated by <a href="https://github.com/jsdoc3/jsdoc">JSDoc 3.6.3</a> on Tue Jun 29 2021 08:38:17 GMT+1000 (Australian Eastern Standard Time) using the <a href="https://github.com/clenemt/docdash">docdash</a> theme.
</footer>
<script>prettyPrint();</script>
<script src="scripts/polyfill.js"></script>
<script src="scripts/linenumber.js"></script>
</body>
</html>