Skip to content
Torgeir Holen edited this page Jan 16, 2024 · 147 revisions

Velkommen til Authentication Frontend prosjektet

Et mål med denne wikien er å prøve følge prosjektutviklingen
og linke sammen ulik type informasjon, gammel og ny.

Foreløpig er endel uklart, inkludert hovedplanene (issue 221 per 11.09.23).
Se også egen side for Planskisser, Brukerbehov og Relevante lenker til sentrale issues.

"Behov for en løsning som gjør det mulig å opprette en "bruker" som gjør det mulig å delegere rettigheter fra en virksomhet til en annen. Brukeren skal rendyrkes for bruk mot API (Maskin-maskin) og skal ikke være mulig å logge på med via portal. Denne er noe uklar foreløpig da det ikke er 100% avklart hvor ting skal løses."


Vi ønsker, i første omgang, å bygge en Frontend, med tilhørende BFF (backend-for-frontend), for Autentisering sin "ekte" backend (se eget repo altinn-authentication : https://github.com/Altinn/altinn-authentication).

Vårt oppsett skal reflektere altinn-access-management-frontend.

Vi legger ut regelmessige oppdateringer om arbeidet her.

Vår app kan nås her: http://local.altinn.cloud/
(gitt du har det rette "lokale" oppsettet, se under her,
men da er også Swagger API oversikt fra BFF tilgjengelig her:
http://localhost:5006/swagger/index.html).


Oppdateringer om arbeidet:

16.01.24: Rettigheter i OverviewPage kan nå åpnes,
og konkrete handlinger ("actions", som Lese, Skrive, Signere etc) er listet
med Designsystemets Tags (blå for autorisert, rødt for ikke-autorisert).
https://authenticationfrontend.mangoflower-96d0829d.norwayeast.azurecontainerapps.io/authfront/ui/auth/overview

12.01.24: Det nye rights-API muliggjorde å fylle rettigheters-array inn i SystemBruker-array (se OverviewPage).
CreationPage har nå også HelpText på korrekt sted i mobil-view.
For det tredje, DirectConsentPage oppretter nå en SystemBruker i OverviewPage etter at godkjenn knapp trykket.
Disse tre nye tingene kan sees i vår Azure app:
https://authenticationfrontend.mangoflower-96d0829d.norwayeast.azurecontainerapps.io/authfront/ui/auth/overview

11.01.24: Vårt nye API returnerer nå en liste med inkluderte rettigheter,
som muliggjorde en ny RightsIncludedPage, som kan sees vår Azure app:
https://authenticationfrontend.mangoflower-96d0829d.norwayeast.azurecontainerapps.io/authfront/ui/auth/overview

10.01.24: Et nytt og forenklet API for CreationPage som fungerer med det nye designet av 24.11.23, er nå bygget både i frontend og backend, og kan sees i vår Azure app:
https://authenticationfrontend.mangoflower-96d0829d.norwayeast.azurecontainerapps.io/authfront/ui/auth/overview

03.01.24: En ny iterasjon av DirectConsent siden ("Flyt-2") er nå ute i vår Azure app:
https://authenticationfrontend.mangoflower-96d0829d.norwayeast.azurecontainerapps.io/authfront/ui/auth/directconsent

07.12.23: En ny ConfirmationPage side er nå satt opp, og nå
inkorporert i brukerflyten funksjonelt. Siden kan nås i vår live Azure app:
https://authenticationfrontend.mangoflower-96d0829d.norwayeast.azurecontainerapps.io/authfront/ui/auth/confirmation

06.12.23: Vår SystemBruker app har også fått oppdatert CreationPage
etter det Nye Designet av 24.11.23. De to nye sidene er tilgjengelig
i vår Azure app i vår første Nynorsk-versjon.

05.12.23: Vår SystemBruker app har fått oppdatert OverviewPage
etter det Nye Designet av 24.11.23. Ny side er tilgjengelig i Azure app,
se lenke under, men merk at nettleser Edge (men ikke Safari og Chrome) måtte erstatte
språkfiler liggende i Cookie manuelt ("clear cookies" etc).

23.11.23: Vår SystemBruker app er nå tilgjengelig på internett,
etter hardt arbeid fra Simen og Dhana.

Intensjonen er at denne web-appen skal være et møtested.
Alle i teamet kan her se hva som skjer, hva vi bygger sammen,
iterasjon på iterasjon.

Spesielt for designere, og produkteier, så er nok slik praktisk tilgang
til produktet vi bygger, verdifullt. Vi bygger en app, men også eierskap, sammen.

Her er lenkene til de (foreløpig, men alt er foreløpig) tre brukerflytene:

Brukerflyt #1: https://authenticationfrontend.mangoflower-96d0829d.norwayeast.azurecontainerapps.io/authfront/ui/auth/overview

Brukerflyt #2: https://authenticationfrontend.mangoflower-96d0829d.norwayeast.azurecontainerapps.io/authfront/ui/auth/directconsent

Brukerflyt #3: https://authenticationfrontend.mangoflower-96d0829d.norwayeast.azurecontainerapps.io/authfront/ui/auth/maskinportenadm

Merk at vi (foreløpig) bruker en billigløsning på Azure, så sideinnlasting er litt treg.
Men dette er jo dine og mine skattekroner, så det er for en god sak.

Her er en forenklet (og annotert) skisse av vår Azure Container App, og relasjoner med Digdir Kubernetes cluster m.m.m.

AuthFront_AzureContainerApp_i_DigdirClusterContext_screenshot_edit1_110124

17.11.23: Designskisser, og en egen wiki-side for sentral informasjon
angående design, brukerflyt etc ligger nå her:
https://github.com/Altinn/altinn-authentication-frontend/wiki/Figma-og-skisser-og-design-og-sånt

16.11.23: Når man nå lager en ny SystemBruker så blir det vist en bekreftelse på opprettelse, som stammer fra ny POST API (se issue #8). Når man så trykker OK så blir man fraktet tilbake til Oversiktssiden der SystemBruker-listen er oppdatert.

10.11.23: Vårt første utkast til CI pipeline viser at Github Runner
som bruker Ubuntu-22.04, kan bygge vår Frontend bundle. Dette er et nødvendig steg for
en fullstendig CI/CD pipeline til testmiljø. I tillegg var kjøring av Cypress komponent-tester vellykket.
Se Issue #1 for screenshots av byggeprosess og Cypress kjøring.
https://github.com/Altinn/altinn-authentication-frontend/issues/1#issuecomment-1805778370

Kjørelogg kan også sees under Actions tab:
https://github.com/Altinn/altinn-authentication-frontend/actions/workflows/frontend_build_and_cypress.yaml
Workflow er foreløpig begrenset til å bli startet av push til branch cypress8 for å begrense støy.

02.11.23: Andre iterasjon av Cypress E2E tester innførte config og yarn scripts,
slik at slipper å bruke npx, og kan kjøre i interaktiv eller headless modus.

cd cypress
yarn
yarn cy_open

30.10.23: Den første Cypress Ende-til-ende (E2E) testen er satt opp i rot /cypress/. Kjøring av Cypress tester forutsetter at man har Docker og de 3 appene kjørende. Så må man ha Cypress versjon v13.3.3 installert. En How-to beskrivelse skal lages i README i /cypress/ katalogen, men kort fortalt:

cd cypress
npx cypress open

Et Cypress vindu vil åpnes, og der skal man velge E2E Testing.
Så velger man Electron browser, og kjører første test ved å klikke på
test1.cy.js

Da skal Cypress kunne logge inn via http://local.altinn.cloud/,
og gå til http://local.altinn.cloud/authfront/ui/auth/overview

Dersom dette ikke virker, skal kontroll test-filen
spec.cy.js
kunne kjøres som kontroll for Cypress runner (går til https://exampl.cypres.io )

26.10.23: CreationPage sender nå Integrasjonsnavn, beskrivelse og selectedSystemType
til BFF, slik at man kan se den nye SystemBrukeren i oversikten på hovedsiden.

25.10.23: Simen har oppdatert BFF mock data DTO igjen, i tråd med diskusjoner på Refinement møte.
Se Swagger for form på nytt objekt. Issue-8 er også under oppdatering av detaljer, men det er ennå diskrepans mellom de ulike objektene: se issue-8 DTO vs. issue 23.

Frontend app har fått oppdatert Redux State og OverviewPage liste av SystemBrukere
for å reflektere endring i BFFs informasjonsflyt.

24.10.23: Simen har oppdatert BFF mock data DTO, så SystemBrukerObjekter
reflekterer ny standard. Disse objektene blir nå lastet ned fra BFF til Redux State
og blir presentert i OverviewPage listen av SystemBrukere. Men det begynner å bli trangt der.

23.10.23: Sjefsarkitekt Rune har oppdatert ekstern dokumentasjon om SystemBruker-prosjektet. https://docs.altinn.studio/authentication/systemauthentication/

Det er også oppdateringer i SystemUserObject i issue 232:

{
"id" : "37ce1792-3b35-4d50-a07d-636017aa7dbd",
"title": "Nytt regnskapsystem",
"description": "Systemet som vi har kjøpt hos Visma. Kai og Guri vet alt om dette systemet.",
"systemType": "Visma Skatt",
"ownedBy": "orgno:91235123"
"controlledBy": "orgno:92432454"
"created": "2023-01-01"
}

20.10.23: Sertifikatet, med Navn og Beskrivelse, pakket i et Form-objekt,
kan nå lastes opp til endepunktet /uploadjwk
Filen blir så tilgjengelig i BFF sub-repo under /wwwroot katalogen.

18.10.23: Siden fredag 13.10.23 har vi hatt et fungerende POST API kall som laster opp et JWK sertifikat.
Sertifikatfilen blir etter mottak i BFF, så langt, lagret i /wwwroot/ i BFF sub-repo.

I dag har vi planlagt en utviding av POST kall til å legge ved ekstra informasjon,
dvs. feltene Navn og Beskrivelse fra MaskinportenPage siden:
http://local.altinn.cloud/authfront/ui/auth/maskinportenadm


12.10.23: For å få kjørt våre apper lokalt ( http://local.altinn.cloud/ ), trenger man nå to ekstra
prosesser, en Docker NginX container, og en LocalTest dotnet app, kjørende fra
nedlastet Altinn repo /app-localtest/

For å sette opp LocalTest Docker må repo app-localtest lastes ned med git.

Man henter branch AuthFrontLokalTest og kjører derfra

docker-compose up -d --build

Dette forutsetter at man har Docker Desktop installert.

I Docker kan man nå se 4 containere kjøre, inkludert en kalt "localtest".
Denne skal stoppes i Docker, men startes opp i et shell vindu.
Så gå til repo katalog /app-localtest/src/ (skal ha LocalTest.csproj) og kjør med

dotnet run

Det er Docker container "localtest-loadbalancer" som er sentral, og
som er en NginX server som skal kommunisere mellom vår BFF dotnet app
og LocalTest dotnet app.

Dersom man nå har disse 4 prosessene kjørende, Vite server, BFF dotnet app, LocalTest dotnet app, og NginX "loadbalancer" Docker container, så vil man ennå få feilmeldinger fordi man må opprette en katalog AltinnPlatformLocal på den datamaskinen man arbeider på.

PC Eksempel: For en bruker, torhol, som ligger på en Digdir PC på:

/c/Users/torhol

Så kan man gå til /c/ og opprette katalogen med:

mkdir AltinnPlatformLocal

Eventuelt (se Mac eksempel under) kan man
sette en annen path til AltinnPlatformLocal i

/app-localtest/src/appsettings.json

I appsettings.json, i "LocalPlatformSettings" objektet,
må man også sette følgende 2 paths:

"AppRepositoryBasePath": "C:/Users/torhol/repos/digdir"
"LocalTestingStaticTestDataPath": "C:/Users/torhol/repos/digdir/app-localtest/testdata"

Et annet fungerende eksempel, fra Mac er:

 "LocalPlatformSettings": {
    "LocalAppMode": "file",
    "LocalAppUrl": "http://localhost:5006",
    "LocalTestingStorageBasePath": "/Users/torgeirholen/Projects/AltinnPlatformLocal/",
    "AppRepositoryBasePath": "/Users/torgeirholen/repos/digdir",
    "LocalTestingStaticTestDataPath": "/Users/torgeirholen/repos/digdir/app-localtest/testdata"
  }

Om man nå i en browser går til http://local.altinn.cloud/
så skulle man nå få tilgang til en webside der man kan
klikke på "Proceed to app"

Man vil da bli møtt med en blank, blå side, under URL http://local.altinn.cloud/authfront/ui/

Om man så utvider URL til

http://local.altinn.cloud/authfront/ui/auth/overview
skulle vår frontend apps hovedside dukke opp.



10.10.23: BFF Dotnet app, nå støttet av LokalTest Docker container, og Lokaltest dotnet app, skal nå snart være tilgjengelig for ny integrasjon opp mot Frontend React App. Dette krever da at man har 4 systemer kjørende samtidig: BFF dotnet app, LokalHost dotnet app, LokalHost Docker, og Frontend Vite server React app.

React app har blitt oppdatert med ny Redux global State funksjonalitet. Informasjon gitt i CreationPage vil nå bli brukt til å lage en ny systemUser i listen i OverviewPage. Linkene direkte til React app er de samme (se oppdatering av 09.10.23 under her).


09.10:23: Dotnet app er nå under oppgradering (Cookie etc), så kjøringer p.t.
bør gå via React app på port 5173, altså de 5 sidene er:

  1. En Oversiktsside: http://localhost:5173/authfront/ui/auth/overview
  2. Opprettelse av systembruker fra Liste over Leverandører: http://localhost:5173/authfront/ui/auth/creation
  3. Opprett integrasjon selv i Maskinporten: http://localhost:5173/authfront/ui/auth/maskinportenadm

I tillegg har vi:
4) DirekteGodkjennelse (fra epost o.l.): http://localhost:5173/authfront/ui/auth/directconsent
5) Den femte siden er ikke lenger i brukerflyt: http://localhost:5173/authfront/ui/auth/customcreation


06.10.23: Det er nå snakk om 3 ulike bruker-flyter.
Her er et forsøk på oppsummering med dummy-sider:

  1. DirekteGodkjennelse (fra epost o.l.): http://localhost:5191/authfront/ui/auth/directconsent
  2. Opprettelse av systembruker fra FORHÅNDSGODKJENT leverandør: http://localhost:5191/authfront/ui/auth/creation
  3. Opprettelse av systembruker fra SELV-VALGT leverandør: http://localhost:5191/authfront/ui/auth/customcreation

I tillegg har vi:
4) En Oversiktsside: http://localhost:5191/authfront/ui/auth/overview
5) En Maskinporten Int og Adm side: http://localhost:5191/authfront/ui/auth/maskinportenadm

05.10.23: Det er nå mulig å kjøre API kall fra React app
til Dotnet app, og resultatene går inn i Redux Store, og fra der
til skjerm. UserInfoBar øverst har nå Testur Testursson, for TestParty
http://localhost:5191/authfront/ui/auth/overview

29.09:23: Det er nå kontakt mellom frontend og bff. Om en kjører opp frontend med Vite server (se README i /frontend/ sub-repo), og kjører opp bff med Kestrel server (se README i /bff/ sub-repo, men kort sagt, kjør dotnet run der .csproj filen er), så er SWAGGER oversikt over API tilgjengelig på http://localhost:5191/swagger/index.html og vår frontend Overview side tilgjengelig på http://localhost:5191/authfront/ui/auth/overview Dette fungerer nå både på Mac og på PC.

22.09.23: En DirectConsentPage (issue #17) er satt opp, og kan nås på
http://localhost:5191/authfront/ui/auth/directconsent
SinglePageApp --> ThreePageApp.

22.09.23: Simens BFF kjører nå på PC, og får kontakt React Vite server.
BFF kan også kjøre på Mac, men får foreløpig ikke kontakt med Vite server.
OverviewPage er nå linket til den nye CreationPage. SinglePageApp --> TwoPageApp.

21.09.23: Skissen til OverviewPage i Issue #2, er nå ferdig (visuelt sett), og
tilgjengelig (om app kjører) på : http://localhost:5173/authfront/ui/auth/overview

20.09.23: Simen har nå satt opp vår BFF som /backend/ i repo root.

20.09.23: Frontend Overview page er tilgjengelig på
http://localhost:5173/authfront/ui/offered-api-delegations/overview,
gitt at man har frontend app kjørende: se README her:
https://github.com/Altinn/altinn-authentication-frontend/blob/main/frontend/README.md

18.09.23: Backend issue 200 : https://github.com/Altinn/altinn-authentication/issues/200
Dette er et sentralt dokument som beskriver SystemBruker-konseptet fra bunnen av, med definisjoner av
endel andre begrep, og (tildels) diskusjon med store, ytre aktører som Skatt og NAV.

18.09.23: Vi har nå beskrivelse av brukerproblemer, i et Word-dokument fra
Post Nord Straalfors (kommer her). Tilsvarende problemer er beskrevet fra Visma og Fiken. Oppdatering: Rune opplyser om at det skal finnes en YouTube video om Altinn fra Visma (se link under her nå).

15.09.23: En skjell-app ligger nå i repo under /frontend/.
App kan kjøres, men viser så langt bare en feilmeldings-side.


Pre 15.09.23: Endel diskusjoner med Rune & Torgeir angående repo oppsett, og Wiki tilgang.

Skisse til plan

Ligger nå i egen Wiki side (se høyre meny).

Brukerbehov

Ligger nå i egen Wiki side (se høyre meny).

Noen relevante linker til sentrale issues

Ligger nå i egen Wiki side (se høyre meny).