Elektronisk signering med Scrive integration

2023-04-27

Website for crowdfunding

Vi på WILL & SKILL har hjälpt en kund inom fastighetsbranschen med förvaltning och vidareutveckling av ett system för crowdfunding av fastigheter. Ett Next.js projekt som utvecklats med elektronisk signering.

En investeringsplattform för crowdfunding av fastigheter.

Plattformen är uppdelad i tre delar:

  • Webbplats - SEO-optimerad webbplats

  • Portal - Autentiserat system för investering i aktuella fastighetskampanjer

  • Självbetjäningssystem - för att hantera användare, investeringar och kampanjer

  • Back-End

Processen

  1. Användaren börjar med att landa på webbplatsen.

  2. Efter en första granskning av webbplatsen hittar användaren en intressant kampanj.

  3. Efter att ha läst kampanjinformationen väljer användaren att läsa mer och uppmanas att logga in eller skapa ett konto.

  4. Användaren skapar ett konto med e-post eller någon populär social medietjänst.

  5. När användaren är inloggad får hen tillgång till mer information om kampanjen och väljer att investera.

  6. Om användaren är ny, uppmanas hen att fylla i KYC-formuläret.

  7. När KYC-formuläret är slutfört kan användaren ange sitt investeringsbelopp och signera det dynamiskt skapade avtalet (Scrive).

  8. När avtalet är signerat uppmanas användaren att överföra pengarna.

  9. Administratören kan nu markera investeringen som betald och hålla användaren uppdaterad om projektet.

Webbplats

En webbplats byggd med en Headless-plattform för att optimera för hastighet och hög ranking på sökmotorer. Byggd med komponenter och är lätt att anpassa.

Website for crowdfundingPortal

Portalen är byggd med React och Next.js och kommunicerar med Back-End via REST API

och JWT (för autentisering). Portalen används av inloggade användare för att hitta en intressant kampanj och investera pengar.

Crowdfunding login

Självbetjäning

Självbetjäningssystemet är byggt med React och Next.js och kommunicerar med Back-End via REST API

och JWT (för autentisering). Självbetjäningssystemet används av administratörer för att administrera kampanjer, användare och investeringar.

Dashboard for crowdfunding

Back-End

Back-End är byggd med Python/Django. Back-End exponerar API

som de andra applikationerna kan ansluta till för att konsumera data. Back-End tillhandahåller både offentliga och privata API

Infrastruktur

Infrastrukturen använder Kubernetes och Docker för att containerisera infrastrukturen och ger flexibilitet när det gäller skalbarhet. Infrastrukturen är uppdelad i följande delar:

  • Back-End

    • Multi Cluster Database

    • Load Balancer

    • Kubernetes Orchestrator

    • Webbtjänster

  • Front-End

    • Generering av statiska sidor för statiska sidor

    • Server Side Rendering för dynamiska sidor

    • Global CDN (den närmaste servern används för varje specifik användare)

Så här implementerade vi Scrive

Som en del av vidareutvecklingen fick vi i uppdrag att implementera ett system för att skapa och signera kotrakt med BankID. Vi bestämde oss för att integrera med Scrive och nu skall vi gå igenom hur man får allt att fungera.

Konto och api-inställningar

Steg ett är att skapa ett Scrive-konto, vilket man gör via https://www.scrive.com/sv/. När kontot är skapat börjar man med att titta på API-inställningarna som ligger under fliken konto.

Scrive api-inställningarVi skapar en Personlig åtkomstbevis och sparar ner de fyra nycklarna:

  • Client credentials identifier

  • Client credentials secret

  • Token credentials identifier

  • Token credentials secret

Skapa en mall

Nästa steg är att skapa en mall som alla kontrakt ska skapas från. Klicka in dig på Mallar och skapa en ny mall. Man kan ändra mallens namn under Dokumenttitel.

Scrive mallarDet finns tre flikar Parter, Dokument och Inställningar, de två viktiga som vi ska gå igenom är parter och dokument.
Dokument är där man väldigt enkelt laddar upp en PDF av kontraktet.

Scrive dokumentvyNästa viktiga flik, parter, är där man fyller i vilka delar som de olika parterna ska fylla i för att skriva under kontraktet. Kontot som skapar mallen presenteras alltid i mallen, men det finns två fält som man kan ändra på, vilken roll och inbjudningsordning. Det finns två roller Granskare och Signerare. Inbjudningsordning är i vilken ordning man skickar ut och signerar avtalen om man har fler än en part som ska signera. I vårt fall så skulle skaparen bara behöva granska kontraktet och det ska bara finnas en part som signerar kontraktet. Den andra parten har alltså signerar rollen och får en inbjudan med endast länk. Vi skickar dem från vårt system till kontraktet för att signera och därefter skickas en e-postbekräftelsen till signeraren, innehållande en länk till kontraktet.

Ett viktigt fält som vi måste lägga till för att vi ska kunna använda BankID för att signera kontraktet är personnummer. Det här är det enda vi behöver göra med mallen, resten kommer vi programmatiskt att fylla in och se till att man ska använda BankID.

Scrive, parter inställningar

Programmer kontraktet och skicka användaren till kontraktet

Vi ska nu använda oss av Scrive API:et för att skapa ett kontrakt utifrån den mallen vi skapade. Vi kommer använda oss av personlig åtkomstbevis nycklar som vi skapade i början och sen behöver vi mall id som finns i URL.

Scrive - parterVi använder axios för att göra en post till Scrive api:et och använder oss av nycklarna för att skapa en oauth sträng för autentiseringe