Changes for page Community App Developer Guide

Last modified by bougault on 2022/03/02 11:58

From 4.1 to 3.2 From 28.1 to 27.1

From version 27.1

edited by villemai
on 2020/05/04 16:16

Change comment: There is no comment for this version

To version 4.1

edited by allan
on 2019/09/19 11:40

Change comment: Modifying your client

Raw
Rendered

Summary

Page properties (3 modified, 0 added, 0 removed)
Objects (0 modified, 0 added, 2 removed)
- XWiki.DocumentSheetBinding[0]
- XWiki.DocumentSheetBinding[1]

Details

Page properties

Parent

@@ -1,1 +1,1 @@
--Collabs.collaboratory-community-apps.WebHome
++Collabs.collab-devs.RFC.WebHome

Author

@@ -1,1 +1,1 @@
--XWiki.villemai
++XWiki.allan

Content

@@ -1,86 +1,189 @@
--Developers can extend the Collaboratory capabilities by providing applications to its community of users.
++The Collaboratory is designed to be extended with applications provided by its community of users.
--This guide describes the steps to make this possible.
++This guide describes how developers can contribute by creating and registering applications within the Collaboratory.
++{{toc numbered="true" start="2"/}}
++
  == Becoming a contributor ==
--The first step is for you to **get the developer accreditation**. Contributors can register and manage applications within the Community Apps Catalogue.
++The first step is for you to be **recognised as a contributor**. Contributors can register and manage applications within the Community Apps Catalogue.
--Send an email to [[support@ebrains.eu>>mailto:support@ebrains.eu]] with a short summary of your intentions.
++To become a contributor, send an email to [[support@humanbrainproject.eu>>mailto:support@humanbrainproject.eu]] with a short summary of your intentions.
--The support team will apply the permissions to your user: your account will be [[upgraded with developers privileges>>doc:Collabs.collab-devs.collaboratory-v2.keycloak.user administration.WebHome]] the next time you will login.
++The support team will apply the permissions to your user and the next time you will login, your account will be upgraded with developers privileges.
  (% class="box infomessage" %)
  (((
--Only SGA2 accredited users will be automatically granted the developer accreditation.
++Please note that, currently, only SGA2 accredited users will be automatically granted the contributor level.
  )))
--== Making your app available to users ==
++== Registering an application in the Catalogue ==
--In order for you application to be installable by users, it needs to be registered within the [[Community Apps Catalogue>>doc:Apps.WebHome]].
++The Community Apps Catalogue is the place where collab authors look for applications to add to their collabs.
--Once this simple step is complete, users will be able to install your app within their collabs.
++{{error}}
++TODO: describe the steps to register an app in the Catalogue
++{{/error}}
--=== Registering an application in the Catalogue ===
++== Creating your OpenID Connect client ==
--Navigate to the catalogue and click on **+Create App** in the top right corner. Enter a name for your app and click on **Create**.
++The steps to create an OpenID Connect client are the following:
--Fill the form with the following information:
++1. get an access token from the `developer` client
++1. use the token to call the create endpoint
++1. save your registration access token for further modifications of your client
--* **main URL**: the URL of the homepage of your app. This is where user will be directed when then open your app in a collab.
--* **settings URL**: the URL of the your settings management page if you have one.
--* **description**: a description of what your app does to help users select it.
--* **under development?**: should be checked if you don't want your app to be available by default by other users.
--* **category**: a category to help structuring the applications.
--* **maintainers**: a list of users who maintain the app. The users need to have logged in the wiki at least once to be found. Maintainers are granted the right to modify an app registration.
--* **documentation URL**: if your app has online user documentation, a link will be provided to users when they use your app.
--* **repository**: a URL to a public repository so users can check the sources of your app.
++=== Fetching your developer access token ===
--Click on **Save**. Your app is now registered and waiting for users to install it!
++In order to get your developer token, you need to authenticate against the developer client with the password grant.
--=== Installing your app in a collab ===
++This can be achieved with this sample shell script:
--1. In order to install your app, you need to navigate to a collab where you have either the **editor** or **administrator** role.
--1. Click on **Create**. Enter a title for this instance of your app and select **Community App** in the right selector.
--1. Click on **Create**. You will be presented with the Community App Catalogue. The app you will see are the public apps and the ones your a maintainer of.
--1. Select your app and click on **Save and View**.
++{{code language="bash"}}
++# Gather username and password from user
++echo '\nEnter your username' && read clb_dev_username &&
++echo '\nEnter your password' && read -s clb_dev_pwd &&
--You should now see how your app looks like within a collab.
++# Fetch the token
++curl -X POST https://iam.humanbrainproject.eu/auth/realms/hbp/protocol/openid-connect/token \
++  -u developer: \
++  -d 'grant_type=password' \
++  -d "username=${clb_dev_username}" \
++  -d "password=${clb_dev_pwd}" |
++
++# Prettify the JSON response
++json_pp;
--== Getting your app instance context ==
++# Erase the credentials from local variables
++clb_dev_pwd='';clb_dev_username=''
++{{/code}}
--Instances of your applications will be installed by collab authors in many different collabs. In order to let you customise the user experience based on its context, the Collaboratory will automatically pass query parameters to your app:
++The response will be similar to:
--* **##clb-collab-id##**: the unique, human-readable identifier of the collab.
--* ##**clb-doc-path**##: the path of your app instance within the collab. If your app is at the root of a collab, this value will be empty.
--* ##**clb-doc-name**##: the name of the document where your app instance is installed.
--* ##**clb-drive-id**##: the unique identifier of the drive of the collab. This id is required if you want to fetch or store documents within the drive of the collab.
++{{code language="json"}}
++{
++    "access_token": "eyJhbGci...",
++    "expires_in": 108000,
++    "refresh_expires_in": 14400,
++    "refresh_token": "eyJhbGci...",
++    "token_type": "bearer",
++    "not-before-policy": 1563261088,
++    "session_state": "0ac3dfcd-aa5e-42eb-b333-2f73496b81f8",
++    "scope": ""
++}
++{{/code}}
--== App settings ==
++Copy the "access_token" value, it is the one that will be needed for the next step.
--The app settings are the values the collab author can modify to change the behaviour of your application within her collab.
++=== Creating the client ===
--=== Writing settings ===
++With your developer token, you can now create clients by sending a JSON representation to a specific endpoint:
--The Collaboratory comes with a mechanism to let your app store these settings directly in the Collaboratory.
++{{code language="bash"}}
++# Set your developer token
++clb_dev_token=...
--In order to do that, your app needs to use the [[postMessage javascript API>>https://developer.mozilla.org/en-US/docs/Web/API/Window/postMessage]] to send the settings to store to the Collaboratory:
++# Send the creation request
++curl -X POST https://iam.humanbrainproject.eu/auth/realms/hbp/clients-registrations/default/ \
++  -H "Authorization: Bearer ${clb_dev_token}" \
++  -H 'Content-Type: application/json' \
++  -d '{
++        "clientId": "my-awesome-client",
++        "name": "My Awesome App",
++        "description": "This describes what my app is for end users",
++        "rootUrl": "https://root.url.of.my.app",
++        "baseUrl": "/relative/path/to/its/frontpage.html",
++        "redirectUris": [
++            "/relative/redirect/path",
++            "/these/can/use/wildcards/*"
++        ],
++        "webOrigins": ["+"],
++        "bearerOnly": false,
++        "consentRequired": true,
++        "standardFlowEnabled": true,
++        "implicitFlowEnabled": true,
++        "directAccessGrantsEnabled": false,
++        "attributes": {
++            "contacts": "first.contact@example.com; second.contact@example.com"
++        }
++    }' |
--{{code language="javascript"}}
--window.parent.postMessage({
--    topic: '/clb/community-app/settings',
--    data: {
--        setting1: 'setting 1 value',
--        setting2: 'setting 2 value',
--        // ...
--        // reload: false // avoid page reload on settings change
--    }}, 'https://wiki.ebrains.eu');
++# Prettify the JSON response
++json_pp;
  {{/code}}
--=== Fetching settings ===
++In case of success, the endpoint will return its representation of your client:
--The Collaboratory will get the settings from its key/value store and pass them to your app through query parameters.
++{{code language="json"}}
++{
++   "defaultClientScopes" : [
++      "web-origins",
++      "roles"
++   ],
++   "redirectUris" : [
++      "/relative/redirect/path",
++      "/these/can/use/wildcards/*"
++   ],
++   "nodeReRegistrationTimeout" : -1,
++   "rootUrl" : "https://root.url.of.my.app",
++   "webOrigins" : [
++      "+"
++   ],
++   "authenticationFlowBindingOverrides" : {},
++   "baseUrl" : "/relative/path/to/its/frontpage.html",
++   "description" : "This describes what my app is for end users",
++   "notBefore" : 0,
++   "frontchannelLogout" : false,
++   "enabled" : true,
++   "registrationAccessToken" : "eyJhbGciOi...",
++   "consentRequired" : true,
++   "fullScopeAllowed" : false,
++   "clientAuthenticatorType" : "client-secret",
++   "surrogateAuthRequired" : false,
++   "directAccessGrantsEnabled" : false,
++   "standardFlowEnabled" : true,
++   "id" : "551b49a0-ec69-41af-9461-6c10fbc79a35",
++   "attributes" : {
++      "contacts" : "first.contact@example.com; second.contact@example.com"
++   },
++   "name" : "My Awesome App",
++   "secret" : "your-client-secret",
++   "publicClient" : false,
++   "clientId" : "my-awesome-client",
++   "optionalClientScopes" : [],
++   "implicitFlowEnabled" : true,
++   "protocol" : "openid-connect",
++   "bearerOnly" : false,
++   "serviceAccountsEnabled" : false
++}
++{{/code}}
--== Creating your OpenID Connect client ==
++Among all the attributes, you should securely save:
--See the instructions [[here>>doc:.Registering an OIDC client.WebHome]].
++* your client **secret** ("secret" attribute) which is needed by your application to **authenticate to the IAM server** when making backend calls
++* your client **registration access token** ("registrationAccessToken")  which is the token you will need to authenticate when **modifying your client in the future**
++
++=== Modifying your client ===
++
++Updating a client is done with a PUT request:
++
++{{code language="bash"}}
++# Set your registration token and client id
++clb_reg_token=...
++
++# Update the client
++curl -X PUT https://iam.humanbrainproject.eu/auth/realms/hbp/clients-registrations/default/my-awesome-client \
++  -H "Authorization: Bearer ${clb_reg_token}" \
++  -H 'Content-Type: application/json' \
++  -d '{
++        "clientId": "my-awesome-client",
++        "redirectUris": [
++            "/relative/redirect/path",
++            "/these/can/use/wildcards/*",
++            "/a/new/redirect/uri"
++        ]
++    }' |
++
++# Prettify the JSON response
++json_pp;
++{{/code}}