Skip to content

Commit 4ebaf98

Browse files
rompemoldesrompemoldes
authored
feat: mermaid-diagram for login-sequence of Readme (#91)
## fixes KILTProtocol/ticket#NoTicket
1 parent 3565063 commit 4ebaf98

File tree

2 files changed

+32
-135
lines changed

2 files changed

+32
-135
lines changed

‎README.md

+32-105
Original file line numberDiff line numberDiff line change
@@ -207,111 +207,38 @@ On this example project, several (2-3) interactions are need because it is broke
207207
We encourage you to open and read the browser's and backend's consoles.
208208
This should help you understand what is happening on each step, which function is responsible for what, how did the cookies changed.
209209

210-
```
211-
+-----------+ +---------+ +---------+
212-
| Extension | | Browser | | Server |
213-
+-----------+ +---------+ +---------+
214-
| | ------------------------\ |
215-
| |-| User visits web3login | |
216-
| | |-----------------------| |
217-
| | --------------------------------------\ |
218-
| |-| User chooses an Extension X | |
219-
| | | and clicks on the "Connect" button. | |
220-
| | |-------------------------------------| |
221-
| | |
222-
| please allow use on this page | |
223-
|<-------------------------------------------------------------| |
224-
| -------------------------------------------------------\ | |
225-
|-| Only the "Extension X" pops up, only the first time. | | |
226-
| |------------------------------------------------------| | |
227-
| ---------------------------------------\ | |
228-
|-| The Domain Linkage Credentials under | | |
229-
| | .well-known/did-configuration.json | | |
230-
| | is verified. | | |
231-
| |--------------------------------------| | |
232-
| | |
233-
| User granted access | |
234-
|------------------------------------------------------------->| |
235-
| | |
236-
| | GET /api/session/start |
237-
| |-------------------------------------------------------------------------->|
238-
| | |
239-
| | 200 OK |
240-
| | set-cookie: sessionJWT={dAppName, dAppEncryptionKeyUri, challenge} |
241-
| | {dAppName, dAppEncryptionKeyUri, challenge} |
242-
| |<--------------------------------------------------------------------------|
243-
| | |
244-
| startSession(dAppName, dAppEncryptionKeyUri, challenge) | |
245-
|<-------------------------------------------------------------| |
246-
| | |
247-
| {encryptionKeyId, encryptedChallenge, nonce} | |
248-
|------------------------------------------------------------->| |
249-
| | |
250-
| | POST /api/session/verify |
251-
| | Cookie: sessionJWT={dAppName, dAppEncryptionKeyUri, challenge} |
252-
| | {encryptionKeyId, encryptedChallenge, nonce} |
253-
| |-------------------------------------------------------------------------->|
254-
| | ----------------------------------------------------\ |
255-
| | | Verify sessionJWT. |-|
256-
| | | Decrypt challenge using nonce and encryptionKeyId | |
257-
| | | Verify Extension Session: | |
258-
| | | Assert that jwt-challenge (our) | |
259-
| | | and decrypted-challenge (theirs) match. | |
260-
| | |---------------------------------------------------| |
261-
| | |
262-
| | 200 OK |
263-
| | set-cookie: sessionJWT={{dAppName, dAppEncryptionKeyUri, challenge}, |
264-
| | {encryptionKeyId, encryptedChallenge, nonce}} |
265-
| |<--------------------------------------------------------------------------|
266-
| ---------------------------------------------\ | |
267-
| | Server-Extension-Session established ✉️ ⛓️ |-| |
268-
| |--------------------------------------------| | |
269-
| | -----------------------\ |
270-
| |-| User clicks on Login | |
271-
| | |----------------------| |
272-
| | |
273-
| | GET /api/credential/login/request |
274-
| | Cookie: sessionJWT |
275-
| |-------------------------------------------------------------------------->|
276-
| | ------------------------------------------------------------------\ |
277-
| | | The Server is asking for a Credential of a cType from the User. |-|
278-
| | |-----------------------------------------------------------------| |
279-
| | |
280-
| | 200 OK |
281-
| | set-cookie: credentialJWT={challengeOnRequest} |
282-
| | KiltMsg{request-credential} |
283-
| |<--------------------------------------------------------------------------|
284-
| | |
285-
| send(KiltMsg{request-credential}) | |
286-
|<-------------------------------------------------------------| |
287-
| -----------------------------------\ | |
288-
|-| User approves the request | | |
289-
| | and selects credential to share. | | |
290-
| |----------------------------------| | |
291-
| | |
292-
| KiltMsg{submit-credential} | |
293-
|------------------------------------------------------------->| |
294-
| | |
295-
| | Post /api/credential/login/submit |
296-
| | Cookie: credentialJWT |
297-
| | KiltMsg{submit-credential} |
298-
| |-------------------------------------------------------------------------->|
299-
| | ---------------------------------------------------\ |
300-
| | | Verify the credential. |-|
301-
| | | Note the DID inside the credential. | |
302-
| | | If verification was successful, | |
303-
| | | DID was authenticated with provided credentials. | |
304-
| | |--------------------------------------------------| |
305-
| | ---------------------------------------------------\ |
306-
| | | The login with credential process was completed. |-|
307-
| | | An authentication token is given to the user. | |
308-
| | | It's all like web2 from here on. | |
309-
| | |--------------------------------------------------| |
310-
| | |
311-
| | 200 OK |
312-
| | set-cookie: accessJWT{authenticationToken} |
313-
| |<--------------------------------------------------------------------------|
314-
| | |
210+
```mermaid
211+
%%{init: {'themeVariables': {'noteBkgColor': '#b3d9ff', 'noteBorderColor': '#8ca5bf'}}}%%
212+
sequenceDiagram
213+
participant Extension
214+
participant Browser
215+
participant Server
216+
217+
Note right of Browser: User visits web3login
218+
Note right of Browser: User chooses an Extension X <br/>and clicks on the "Connect" button.
219+
Browser->>Extension: please allow use on this page
220+
Note right of Extension: Only the "Extension X" pops up, only the first time.
221+
Note right of Extension: The Domain Linkage Credentials under<br/>.well-known/did-configuration.json<br/>is verified.
222+
Extension->>Browser: User granted access
223+
Browser->>Server: GET /api/session/start
224+
Server->>Browser: 200 OK<br/>set-cookie: sessionJWT={dAppName, dAppEncryptionKeyUri, challenge}<br/>{dAppName, dAppEncryptionKeyUri, challenge}
225+
Browser->>Extension: startSession(dAppName, dAppEncryptionKeyUri, challenge)
226+
Extension->>Browser: {encryptionKeyId, encryptedChallenge, nonce}
227+
Browser->>Server: POST /api/session/verify<br/>Cookie: sessionJWT={dAppName, dAppEncryptionKeyUri, challenge}<br/>{encryptionKeyId, encryptedChallenge, nonce}
228+
Note left of Server: Verify sessionJWT.<br/>Decrypt challenge using nonce and encryptionKeyId<br/>Verify Extension Session: <br/> Assert that jwt-challenge (our)<br/>and decrypted-challenge (theirs) match.
229+
Server->>Browser: 200 OK<br/>set-cookie: sessionJWT={{dAppName, dAppEncryptionKeyUri, challenge},<br/>{encryptionKeyId, encryptedChallenge, nonce}}
230+
Note left of Browser: Server-Extension-Session established ✉️ ⛓️
231+
Note right of Browser: User clicks on Login
232+
Browser->>Server: GET /api/credential/login/request<br/>Cookie: sessionJWT
233+
Note left of Server: The Server is asking for a Credential of a cType from the User.
234+
Server->>Browser: 200 OK<br/>set-cookie: credentialJWT={challengeOnRequest}<br/>KiltMsg{request-credential}
235+
Browser->>Extension: send(KiltMsg{request-credential})
236+
Note right of Extension: User approves the request<br/>and selects credential to share.
237+
Extension->>Browser: KiltMsg{submit-credential}
238+
Browser->>Server: Post /api/credential/login/submit<br/>Cookie: credentialJWT<br/>KiltMsg{submit-credential}
239+
Note left of Server: Verify the credential.<br/>Note the DID inside the credential.<br/>If verification was successful,<br/>DID was authenticated with provided credentials.
240+
Note left of Server: The login with credential process was completed.<br/>An authentication token is given to the user.<br/> It's all like web2 from here on.
241+
Server->>Browser: 200 OK<br/>set-cookie: accessJWT{authenticationToken}
315242
```
316243

317244
## Deployed Version

0 commit comments

Comments
 (0)