Versiebeheer voor belscripts

Johan

Een belscript is niet veel meer dan een html pagina die tekst en uitleg geeft over de campagne. Het belscript kan bestaan uit 1 of meerdere pagina’s die samen de callflow bepalen. In het belscript kan vri gebruik worden gemaakt van html, css en javascript. Een belscript kan eenvoudig, en op elk willekeurig moment, worden aangepast. Hoewel deze vrijheid vaak erg handig is kan dit ook problemen geven.

 

Als meerdere medewerkers het belscript kunnen wijzigen wordt soms de vraag gesteld “Wie heeft dit gewijzigd”. Door alleen naar de html pagina’s te kijken kan die vraag niet worden beantwoord.

Een andere vraag die vaker gesteld wordt is “Sinds wanneer is deze wijziging actief”. Hoewel er op bestandsniveau nog te achterhalen is wanneer dit bestand voor het laatst is gewijzigd zegt dat niks over specifieke onderdelen in het bestand.

 

Om deze vragen wel met zkerheid te kunnen beantwoorden moet het bewerken van de belscripts beter worden gevolgd. Een zeer geschikte oplossing hierbij is versiebeheer van de bestanden. In deze blogpost laten we zien hoe met beperkte middelen versiebeheer kan worden geintroduceerd.

 

De belscripts voor CallPro worden bijna altijd geserveerd aan de werkstations door Windows Internet Information Server (IIS). In de praktijk kan elke webserver worden gebruikt maar omdat bijna alle onderdelen van CallPro draaien onder windows is dit de meest voor de hand liggende webserver om te gebruiken. Onze versiebeheer oplossing draait ook op IIS en maakt gebruik van het populaire GIT formaat, we gebruiken Bonobo GIT Server.

Stap 1: Installatie van Bonobo op de webserver

We beginnen met het downloaden van Bonobo van https://bonobogitserver.com/ Download het .zip bestand en plaats deze op de webserver. Maak in de folder C:\DATA\WWW (of de folder die op de webserver is gekozen als locatie voor IIS websites) een folder “Bonobo.Git.Server” aan en pak hier het zip bestand uit.

vmconnect_2017-12-12_16-30-10

Ga vervolgens naar de eigenschappen van de folder “App_Data” en geef de “IIS_USRS” gebruiker Wijzig en Schrijf rechten.

vmconnect_2017-12-12_16-37-26

Maak nu van deze folder een nieuwe website voor de Bonobo GIT Server. In IIS Manager right-click op “Sites” en kies “Add website…”. Vul alles in zoals aangegeven:

vmconnect_2017-12-12_16-42-24

We werken hier met een Host Name die in de bedrijfs interne DNS server moet worden aangemaakt en moet wijzen naar het IP adres van de interne Webserver.

Als dit nog niet standaard aan staat configureer “Anonymous Authentication”. Ga in IIS Manager naar de website en onder de sectie “IIS” dubbelclick op “Authentication” om de eigenschappen van deze feature te openen. Controleer dat “Anonymous Authentication” op “Enabled” staat.

vmconnect_2017-12-12_16-46-58

Open de browser en ga naar https://bonobo/. Je ziet dan de basis pagina van Bonobo and alles werkt correct.

chrome_2017-12-12_16-50-11

Log in met gebruiker admin en wachtwoord admin (en wijzig dit wachtwoord direct).

Stap 2: Maak de gebruikers die toegang krijgen tot Bonobo

In Bonobo ga naar “Users” en maak de benodigde gebruikers aan. Iedereen die met de GIT repository moet werken krijgt een eigen account.

chrome_2017-12-12_16-55-59

Stap 3: Maak een website voor de belscripts

In ons geval maken we een website met dezelfde naam als de repo, dit is geen vereiste maar houdt alles wel overzichtelijk. Ook hier wordt gebruik gemaakt van een hostheader die aanwezig moet zijn in de interne DNS.

vmconnect_2017-12-12_17-04-07

 

Stap 4: Maak een GIT repo voor de belscripts

In ons voorbeeld werken we met 1 repo en 1 website voor belscripts maar dat hoeft niet. Het is ook mogelijk om meerdere repo’s te hebben en de toegang hiermee nog fijnmaziger vast te leggen.

chrome_2017-12-12_16-59-16

Op de server ga naar C:\data\www\Bonobo.Git.Server\App_Data\Repositories\belscript_001\hooks en maak hier een bestand “post-receive” aan. Zet hier de volgende inhoud in:

vmconnect_2017-12-12_17-08-48

Dit zorgt ervoor dat telkens als in deze repo een checkin wordt gedaan in de publish branch (die we nog niet hebben gemaakt) dat de inhoud wordt uitgescheckt naar de root-folder van de website die we in stap 3 hebben gemaakt.

Stap 5: Installeer een Git client

Alle medewerkers die belscripts maken moeten beschikken over een Git client. Wij gebruiken hier Visual Studio 2017 maar er zijn diverse andere clients waaronder git-scm de Github desktop client  en GitKraken.

Haal eerst de url naar de zojuist gemaakte repo op. Omdat we weten op welke server deze staat en ook hoe de repo heet kun je de url ook makkelijk zelf samenstellen. Hier: https://bonobo/belscript_001.git

Open nu Visual Studio en ga naar de Team Explorer. Onder “Local Git Repositories” klik op “Clone” In het venster dat wordt weergegeven vul je nu de url in en kies je waar deze repo lokaal op de computer moet worden opgeslagen.

devenv_2017-12-12_17-26-23

Druk op Clone. Voordat de clone gemaakt wordt moet eerst nog een geldig account worden opgegeven die we eerder hebben gemaakt.

devenv_2017-12-12_17-27-54

We hebben nog geen content en missen ook nog de publish branche. Als eerste maken we de “publish” branch die we hebben ingesteld in de post-receive. Kies Branches in de team explorer. In de repo is nu alleen de master branch zichtbaar. Right-click deze en kiez “New local branch from…” Kies als naam “publish” en druk op “Create branch”.

devenv_2017-12-12_17-32-55

Nadat de branch is gemaakt zijn er nu 2 branches. Dubbel klik de publish branch om deze te activeren.

devenv_2017-12-12_17-33-56

Als voorbeeld plaatsen we nu een bestand en pushen die naar de Bonobo GIT server. Klik op het huisje in de Team Explorer en kies vervolgens voor “Show Folder View”. Right-clock op de lege root-folder (belscript_001”) en kies “Add New Item…” Visual studio open nu een venster met een keuze voor het soort bestand. Kies voor “HTML Page” De editor opent en de cursor staat op de bestandnaam, noem dit bestand “index.html”. Plaats enige content in de pagina en bewaar het bestand.

devenv_2017-12-12_17-41-23

Het enige dat nu nog ontbreekt is dat we deze eerste pagina inchecken naar onze repo. Omdat we direct in de publish branch werken (iets wat alleen voor deze test de bedoeling is) zal elke checkin direct naar de website worden gepublished. Ga naar de Team Explorer en klik op “Changes”.

devenv_2017-12-12_17-44-41

Open de dropdown bij “Commit all” en kies voor “Commit All en Push” Om de wijzigingen in te checken in de local repo en daarna direct te pushen naar de Bonobo server. Als alles goed gaat volgt de melding:

devenv_2017-12-12_17-46-40

Navigeer nu naar https://belscript_001 en zie het resultaat

chrome_2017-12-12_17-47-23

Afsluitende opmerkingen

We hebben laten zien hoe eenvoudig het is om een GIT server te installeren en een configuratie te maken om automatscih vanuit versiebeheer wijzigingen in belscript te publishen naar de website die in CallPro gebruikt wordt voor de belscripts. Welke stappen moeten nu nog worden gezet.

1. Gebruikers moeten geen toegang hebben tot de live website (in dit geval https://belscript_001) zodat alleen via een push naar de publish branche belscript wijzigingen kunen nworden gedaan.

2. Belscripts moeten worden gemaakt en bewerkt in de master branche. Na controle worden de wijzigingen dan overgenomen naar de publish branch en via een push (en ons post-receive script) naar de live website gepublished.

3. Doordat elke wijziging nu via source-control loopt is te zien wie,  wanneer, welke wijziging heeft gedaan. Ook is het mogelijk om een verkeerde wijziging vanuit source-control terug te draaien en naar de publish branch over te zetten. Hiermee wordt de live website ook weer bijgewerkt.

More great articles

Het instellen van html document compatibiliteit

Met document compatibility wordt bepaald hoe Internet Explorer een web pagina afbeeld. De document mode van een web pagina wordt…

Read Story

In vijf minuten een Q&A toevoegen aan een belscript

Met de toename van AI en deep learning worden ook eenvoudige toepassingen zoals een Q&A (FAQ) steeds eenvoudiger om zelf…

Read Story

CallPro in de cloud

Sinds kort bieden wij CallPro ook aan als hosted netwerk omgeving in Microsoft Azure. De CallPro omgeving wordt via een…

Read Story
Arrow-up