Technische documentatie Widget-platform

Documentatie voor partners van Digitaal Vlaanderen - bouwstenen digitale loketten


Technische documentatie Widget-platform

Ā 

Over deze documentatieĀ 

Deze technische documentatie is bestemd voor de afnemers van het Widget-platform.

Disclaimer: Deze pagina’s worden regelmatig aangepast zodat ze altijd de meeste recente informatie bevatten. Aarzel niet om feedback te geven mochten er aanpassingen nodig zijn.

Over het Widget-platform

Digitaal Vlaanderen voorziet een aantal manieren om herbruikbare UI-componenten aan te bieden op een gedeeld platform.Ā De Global Header/Footer-widget is zo eenĀ herbruikbareĀ component die naast een UI ook ingebouwde functionaliteit aanbiedtĀ zonder tussenkomst van de afnemende website. Met dit type herbruikbare UI-componenten kan de integratie van extra functionaliteit op een (gast)website ook via een Javascript API gebeuren.

Een widget is een ā€œembed-bareā€-plug-in. Het widget-platform bestaat uit:

  • een front-end applicatieserver, aangesproken door de embedcode

  • een configuratieservice

Het Widget-platform is een REST-API die endpoints voorziet om widgets toe te voegen aan een webpagina. Hiervoor zijn standaard een test- en een productie-omgeving beschikbaar:

Digitaal Vlaanderen biedt momenteel 2 widgets: de global header en de global footer. Beide widgets worden beschouwd als 1 functionaliteit. De code om deze widgets te integreren (widget IDs en embedcodes) wordt standaard geleverd via mail.

3 hoofdstappen om de global header- en footer-widgets correct toe te voegen aan uw URL’s

  1. Definieer de libraries

<head>
Ā Ā  ...
Ā Ā  <script src="https://tni.widgets.burgerprofiel.dev-vlaanderen.be/api/v1/node_modules/%40govflanders/vl-widget-polyfill/dist/index.js"></script>
Ā Ā  <script src="https://tni.widgets.burgerprofiel.dev-vlaanderen.be/api/v1/node_modules/%40govflanders/vl-widget-client/dist/index.js"></script>
Ā Ā  ...
</head>

  1. Voeg de widgets toe aan de <body> van de pagina - u ontvangt de widget-ID’s per mail tijdens de aansluitingsflow.
    <body>
    ...
    <script src=https://tni.widgets.burgerprofiel.dev-vlaanderen.be/api/v1/widget/000000-0000-0000-0000-00000/embed></script>
    <script src=https://tni.widgets.burgerprofiel.dev-vlaanderen.be/api/v1/widget/000000-0000-0000-0000-00000/embed></script>
    ...
    </body

  1. Zorg voor een correcte rapportering van de gebruikerssessie
    Zie: Aanmelden met eenvoudig of gekoppeld toegangsbeheer | De status van de sessie rapporteren

Dit is een officiƫle website van de Vlaamse overheid - Uitgegeven door Digitaal Vlaanderen: https://www.vlaanderen.be/digitaal-vlaanderen

DISCLAIMER: http://www.vlaanderen.be/nl/disclaimer
TOEGANKELIJKHEID: http://www.vlaanderen.be/nl/toegankelijkheid