docs: update connection diagram to include user-server authentication and encryption

This commit is contained in:
Evgeny Poberezkin committed 2019-12-21 22:20:56 +00:00
1 parent 1b81010e4a
commit dfa80d6756
2 files changed
+195 -161

No files matched your search

+52 -18
View File
@@ -1,24 +1,58 @@
sequenceDiagram
participant Alice
participant App A
participant Server A
participant Server B
participant App B
participant App A as Alice's app
participant Server A as Alice's server
participant Server B as Bob's server
participant App B as Bob's app
participant Bob
Alice ->> App A: Alice shows <AB public key> as QR code on the screen<br>(Alice's public key for Bob's eyes only)
Bob ->> App B: Bob requests app to add connection
App A ->> App B: Bob's app reads <AB public key> via the camera
App B ->> Server B: Bob's app encrypts "connection request" (including <BA public key> and Bob's profile) and sends it to Bob's servers<br>{from: <BA public key hash>, to: <AB public key hash>, message: <request encrypted with AB public key>}
Server B ->> Server A: Bob's servers use <AB public key hash> to locate Alice's servers<br>and forward encrypted message to all Alice's servers (when they are different from Bob's servers)
Server A ->> App A: Alice's servers send the message to Alice's app
App A ->> Alice: Alice's app matches <AB public key hash> with shown QR code<br>and decrypts Bob's profile with <AB private key> to show it
Alice ->> App A: Alice requests app to initiate adding connection
Note over App A: App generates:<br><AB connection key><br><A_AB server keys>
App A ->> Server A: App registers on Alice's servers <AB public key hash> associated with <A_AB server public keys> (for recepient)
App A ->> Server A: App subsribes to receive messages from anyone sent to <AB public key hash><br>(request is signed with <A_AB server private keys>)
Note over App A: App shows QR code<br>for <AB public key><br>and Alice's servers
App A -->> Bob: Alice shows to Bob <AB public key> and her servers as QR code on the screen<br>(Alice's public key for Bob only and servers she currently uses)
Bob ->> App B: Bob requests app to read connection QR code
App A -->> App B: Bob's app reads QR code with <AB public key> and Alice's current servers via the camera
Note over App B: App generates<br><BA connection key><br><B_BA server keys>
App B ->> Server B: App registers on Bob's server <BA public key hash> associated with <B_BA server public keys> (for recepient)
App B ->> Server B: App subsribes to receive messages from anyone sent to <BA public key hash><br>(request is signed with <B_BA server private key>)
Note over App A, App B: Now both Alice's and Bob's apps are subscribed to receive each other's messages on their servers
Note over App B: App generates<br><B_AB server keys><br>for Alice's servers<br>and creates<br>connection request<br>including:<br>- <BA public key><br>- Bob's profile<br>- Bob's servers<br>- <B_AB public keys>
App B ->> Server A: Bob's app encrypts "connection request" with <AB public key> and sends it to Alice's servers<br>{to: <AB public key hash>, message: <request encrypted with AB public key>}
Server A ->> App A: Alice's servers send "connection request" to Alice's app<br>(as <AB public key hash> allows messages from anyone)
App A ->> Alice: Alice's app matches <AB public key hash> with <AB public key><br>and decrypts Bob's profile with <AB private key> to show it
Alice ->> App A: Alice identifies Bob's profile and accepts the connection<br>(Bob is now added to Alice's list of connections as "pending")
App A ->> Server A: Alice's app creates "connection accepted" message (including Alice's profile) and sends it to Alice's servers<br>{from: <AB public key hash>, to: <BA public key hash>, message: <encrypted with AB public key>}
Server A ->> Server B: Alice's servers use <BA public key hash> to locate Bob's servers<br>and forward encrypted message to all Bob's servers (when they are different from Alice's servers)
App A ->> Server A: App registers on Alice's servers <AB public key hash> associated with <B_AB server public keys> (for sender)
Note over Server A, Bob: Now only Bob's app can send messages for <AB public key hash> to Alice's servers<br>1) signed using <BA private key><br>2) encrypted using <AB public key><br>3) signed/encrypted using <B_AB server private/public keys>
Note over App A: App generates<br><A_BA server keys><br>for Bob's servers<br>and creates<br>"conn. accepted"<br>message including:<br>- Alice's profile<br>- <A_BA public keys>
App A ->> Server B: Alice's app signs "connection accepted" with <AB private key>, encrypts it with <BA public key> and sends it to Bob's servers<br>{to: <BA public key hash>, message: <encrypted with BA public key>}
Server B ->> App B: Bob's servers send the message to Bob's app
App B ->> Bob: Bob's app matches <AB public key hash> with read QR code<br>and decrypts the Alice's profile with Bob's <BA private key>
App B ->> Bob: Bob's app adds Alice to the list of connections
App B ->> Server B: "connection acknowledgement" message
Server B ->> Server A: "connection acknowledgement" message
Server A ->> App A: "connection acknowledgement" message
App B ->> Bob: Bob's app matches <BA public key hash> with <BA public key><br>and decrypts the Alice's profile with Bob's <BA private key>
App B ->> Bob: Bob's app shows Alice's profile and adds it to the connections<br>(as pending)
App B ->> Server B: App registers on Bob's servers <BA public key hash> associated with <A_BA server public keys> (for sender)
Note over Alice, Server B: Now only Alice's app can send messages for <BA public key hash> to Bob's servers<br>1) signed using <AB private key><br>2) encrypted using <BA public key><br>3) signed/encrypted using <A_BA server private/public keys>
Note over App B: App creates<br>"connection<br>acknowledged"
App B ->> Server A: Bob's app signs "connection acknowledged" with <BA private key>, encrypts it with <AB public key> and sends it to Alices's servers<br>{to: <AB public key hash>, message: <encrypted with AB public key>} (also signed/encrypted with B_AB server private/public keys)
Server A ->> App A: Alice's servers send to app "connection acknowledged"
App A ->> Alice: Bob is now in the Alice's list of connections as "established"
Note over App A: App creates<br>"connection<br>acknowledged"
App A ->> Server B: Alice's app signs "connection acknowledged" with <AB private key>, encrypts it with <BA public key> and sends it to Bob's servers<br>{to: <BA public key hash>, message: <encrypted with BA public key>} (also signed/encrypted with A_BA server private/public keys)
Server B ->> App B: Bob's servers send to app "connection acknowledged"
App B ->> Bob: Alice is now in the Bob's list of connections as "established"
Note over Alice, Bob: Now Alice and Bob can exchange messages with each other, including key rotations and changes of servers they use<br>- Alice can send messages to Bob's servers to <BA public key hash> (Bob's servers allow Alice to send messages relying on A_BA keys)<br>- Bob can subscribe to messages on his servers sent to <BA public key hash> (Bob's servers allow Bob to receive messages relying on B_BA keys)<br><br>- Bob can send messages to Alice's servers to <AB public key hash> (Alice's servers allow Bob to send messages relying on B_AB keys)<br>- Alice can subscribe to messages on her servers sent to <AB public key hash> (ALice's servers allow Alice to receive messages relying on A_AB keys)
+143 -143
View File
@@ -1,49 +1,49 @@
<svg id="mermaid-1576941089411" width="100%" xmlns="http://www.w3.org/2000/svg" height="100%" style="max-width:1250px;" viewBox="-50 -10 1250 756"><style>
<svg id="mermaid-1576966509745" width="100%" xmlns="http://www.w3.org/2000/svg" height="100%" style="max-width:1250px;" viewBox="-50 -10 1250 2083"><style>
#mermaid-1576941089411 .label {
#mermaid-1576966509745 .label {
font-family: 'trebuchet ms', verdana, arial;
font-family: var(--mermaid-font-family);
color: #333; }
#mermaid-1576941089411 .label text {
#mermaid-1576966509745 .label text {
fill: #333; }
#mermaid-1576941089411 .node rect,
#mermaid-1576941089411 .node circle,
#mermaid-1576941089411 .node ellipse,
#mermaid-1576941089411 .node polygon {
#mermaid-1576966509745 .node rect,
#mermaid-1576966509745 .node circle,
#mermaid-1576966509745 .node ellipse,
#mermaid-1576966509745 .node polygon {
fill: #ECECFF;
stroke: #9370DB;
stroke-width: 1px; }
#mermaid-1576941089411 .node .label {
#mermaid-1576966509745 .node .label {
text-align: center; }
#mermaid-1576941089411 .node.clickable {
#mermaid-1576966509745 .node.clickable {
cursor: pointer; }
#mermaid-1576941089411 .arrowheadPath {
#mermaid-1576966509745 .arrowheadPath {
fill: #333333; }
#mermaid-1576941089411 .edgePath .path {
#mermaid-1576966509745 .edgePath .path {
stroke: #333333;
stroke-width: 1.5px; }
#mermaid-1576941089411 .edgeLabel {
#mermaid-1576966509745 .edgeLabel {
background-color: #e8e8e8;
text-align: center; }
#mermaid-1576941089411 .cluster rect {
#mermaid-1576966509745 .cluster rect {
fill: #ffffde;
stroke: #aaaa33;
stroke-width: 1px; }
#mermaid-1576941089411 .cluster text {
#mermaid-1576966509745 .cluster text {
fill: #333; }
#mermaid-1576941089411 div.mermaidTooltip {
#mermaid-1576966509745 div.mermaidTooltip {
position: absolute;
text-align: center;
max-width: 200px;
@@ -57,117 +57,117 @@
pointer-events: none;
z-index: 100; }
#mermaid-1576941089411 .actor {
#mermaid-1576966509745 .actor {
stroke: #CCCCFF;
fill: #ECECFF; }
#mermaid-1576941089411 text.actor {
#mermaid-1576966509745 text.actor {
fill: black;
stroke: none; }
#mermaid-1576941089411 .actor-line {
#mermaid-1576966509745 .actor-line {
stroke: grey; }
#mermaid-1576941089411 .messageLine0 {
#mermaid-1576966509745 .messageLine0 {
stroke-width: 1.5;
stroke-dasharray: '2 2';
stroke: #333; }
#mermaid-1576941089411 .messageLine1 {
#mermaid-1576966509745 .messageLine1 {
stroke-width: 1.5;
stroke-dasharray: '2 2';
stroke: #333; }
#mermaid-1576941089411 #arrowhead {
#mermaid-1576966509745 #arrowhead {
fill: #333; }
#mermaid-1576941089411 .sequenceNumber {
#mermaid-1576966509745 .sequenceNumber {
fill: white; }
#mermaid-1576941089411 #sequencenumber {
#mermaid-1576966509745 #sequencenumber {
fill: #333; }
#mermaid-1576941089411 #crosshead path {
#mermaid-1576966509745 #crosshead path {
fill: #333 !important;
stroke: #333 !important; }
#mermaid-1576941089411 .messageText {
#mermaid-1576966509745 .messageText {
fill: #333;
stroke: none; }
#mermaid-1576941089411 .labelBox {
#mermaid-1576966509745 .labelBox {
stroke: #CCCCFF;
fill: #ECECFF; }
#mermaid-1576941089411 .labelText {
#mermaid-1576966509745 .labelText {
fill: black;
stroke: none; }
#mermaid-1576941089411 .loopText {
#mermaid-1576966509745 .loopText {
fill: black;
stroke: none; }
#mermaid-1576941089411 .loopLine {
#mermaid-1576966509745 .loopLine {
stroke-width: 2;
stroke-dasharray: '2 2';
stroke: #CCCCFF; }
#mermaid-1576941089411 .note {
#mermaid-1576966509745 .note {
stroke: #aaaa33;
fill: #fff5ad; }
#mermaid-1576941089411 .noteText {
#mermaid-1576966509745 .noteText {
fill: black;
stroke: none;
font-family: 'trebuchet ms', verdana, arial;
font-family: var(--mermaid-font-family);
font-size: 14px; }
#mermaid-1576941089411 .activation0 {
#mermaid-1576966509745 .activation0 {
fill: #f4f4f4;
stroke: #666; }
#mermaid-1576941089411 .activation1 {
#mermaid-1576966509745 .activation1 {
fill: #f4f4f4;
stroke: #666; }
#mermaid-1576941089411 .activation2 {
#mermaid-1576966509745 .activation2 {
fill: #f4f4f4;
stroke: #666; }
#mermaid-1576941089411 .mermaid-main-font {
#mermaid-1576966509745 .mermaid-main-font {
font-family: "trebuchet ms", verdana, arial;
font-family: var(--mermaid-font-family); }
#mermaid-1576941089411 .section {
#mermaid-1576966509745 .section {
stroke: none;
opacity: 0.2; }
#mermaid-1576941089411 .section0 {
#mermaid-1576966509745 .section0 {
fill: rgba(102, 102, 255, 0.49); }
#mermaid-1576941089411 .section2 {
#mermaid-1576966509745 .section2 {
fill: #fff400; }
#mermaid-1576941089411 .section1,
#mermaid-1576941089411 .section3 {
#mermaid-1576966509745 .section1,
#mermaid-1576966509745 .section3 {
fill: white;
opacity: 0.2; }
#mermaid-1576941089411 .sectionTitle0 {
#mermaid-1576966509745 .sectionTitle0 {
fill: #333; }
#mermaid-1576941089411 .sectionTitle1 {
#mermaid-1576966509745 .sectionTitle1 {
fill: #333; }
#mermaid-1576941089411 .sectionTitle2 {
#mermaid-1576966509745 .sectionTitle2 {
fill: #333; }
#mermaid-1576941089411 .sectionTitle3 {
#mermaid-1576966509745 .sectionTitle3 {
fill: #333; }
#mermaid-1576941089411 .sectionTitle {
#mermaid-1576966509745 .sectionTitle {
text-anchor: start;
font-size: 11px;
text-height: 14px;
@@ -175,313 +175,313 @@
font-family: var(--mermaid-font-family); }
#mermaid-1576941089411 .grid .tick {
#mermaid-1576966509745 .grid .tick {
stroke: lightgrey;
opacity: 0.3;
shape-rendering: crispEdges; }
#mermaid-1576941089411 .grid .tick text {
#mermaid-1576966509745 .grid .tick text {
font-family: 'trebuchet ms', verdana, arial;
font-family: var(--mermaid-font-family); }
#mermaid-1576941089411 .grid path {
#mermaid-1576966509745 .grid path {
stroke-width: 0; }
#mermaid-1576941089411 .today {
#mermaid-1576966509745 .today {
fill: none;
stroke: red;
stroke-width: 2px; }
#mermaid-1576941089411 .task {
#mermaid-1576966509745 .task {
stroke-width: 2; }
#mermaid-1576941089411 .taskText {
#mermaid-1576966509745 .taskText {
text-anchor: middle;
font-family: 'trebuchet ms', verdana, arial;
font-family: var(--mermaid-font-family); }
#mermaid-1576941089411 .taskText:not([font-size]) {
#mermaid-1576966509745 .taskText:not([font-size]) {
font-size: 11px; }
#mermaid-1576941089411 .taskTextOutsideRight {
#mermaid-1576966509745 .taskTextOutsideRight {
fill: black;
text-anchor: start;
font-size: 11px;
font-family: 'trebuchet ms', verdana, arial;
font-family: var(--mermaid-font-family); }
#mermaid-1576941089411 .taskTextOutsideLeft {
#mermaid-1576966509745 .taskTextOutsideLeft {
fill: black;
text-anchor: end;
font-size: 11px; }
#mermaid-1576941089411 .task.clickable {
#mermaid-1576966509745 .task.clickable {
cursor: pointer; }
#mermaid-1576941089411 .taskText.clickable {
#mermaid-1576966509745 .taskText.clickable {
cursor: pointer;
fill: #003163 !important;
font-weight: bold; }
#mermaid-1576941089411 .taskTextOutsideLeft.clickable {
#mermaid-1576966509745 .taskTextOutsideLeft.clickable {
cursor: pointer;
fill: #003163 !important;
font-weight: bold; }
#mermaid-1576941089411 .taskTextOutsideRight.clickable {
#mermaid-1576966509745 .taskTextOutsideRight.clickable {
cursor: pointer;
fill: #003163 !important;
font-weight: bold; }
#mermaid-1576941089411 .taskText0,
#mermaid-1576941089411 .taskText1,
#mermaid-1576941089411 .taskText2,
#mermaid-1576941089411 .taskText3 {
#mermaid-1576966509745 .taskText0,
#mermaid-1576966509745 .taskText1,
#mermaid-1576966509745 .taskText2,
#mermaid-1576966509745 .taskText3 {
fill: white; }
#mermaid-1576941089411 .task0,
#mermaid-1576941089411 .task1,
#mermaid-1576941089411 .task2,
#mermaid-1576941089411 .task3 {
#mermaid-1576966509745 .task0,
#mermaid-1576966509745 .task1,
#mermaid-1576966509745 .task2,
#mermaid-1576966509745 .task3 {
fill: #8a90dd;
stroke: #534fbc; }
#mermaid-1576941089411 .taskTextOutside0,
#mermaid-1576941089411 .taskTextOutside2 {
#mermaid-1576966509745 .taskTextOutside0,
#mermaid-1576966509745 .taskTextOutside2 {
fill: black; }
#mermaid-1576941089411 .taskTextOutside1,
#mermaid-1576941089411 .taskTextOutside3 {
#mermaid-1576966509745 .taskTextOutside1,
#mermaid-1576966509745 .taskTextOutside3 {
fill: black; }
#mermaid-1576941089411 .active0,
#mermaid-1576941089411 .active1,
#mermaid-1576941089411 .active2,
#mermaid-1576941089411 .active3 {
#mermaid-1576966509745 .active0,
#mermaid-1576966509745 .active1,
#mermaid-1576966509745 .active2,
#mermaid-1576966509745 .active3 {
fill: #bfc7ff;
stroke: #534fbc; }
#mermaid-1576941089411 .activeText0,
#mermaid-1576941089411 .activeText1,
#mermaid-1576941089411 .activeText2,
#mermaid-1576941089411 .activeText3 {
#mermaid-1576966509745 .activeText0,
#mermaid-1576966509745 .activeText1,
#mermaid-1576966509745 .activeText2,
#mermaid-1576966509745 .activeText3 {
fill: black !important; }
#mermaid-1576941089411 .done0,
#mermaid-1576941089411 .done1,
#mermaid-1576941089411 .done2,
#mermaid-1576941089411 .done3 {
#mermaid-1576966509745 .done0,
#mermaid-1576966509745 .done1,
#mermaid-1576966509745 .done2,
#mermaid-1576966509745 .done3 {
stroke: grey;
fill: lightgrey;
stroke-width: 2; }
#mermaid-1576941089411 .doneText0,
#mermaid-1576941089411 .doneText1,
#mermaid-1576941089411 .doneText2,
#mermaid-1576941089411 .doneText3 {
#mermaid-1576966509745 .doneText0,
#mermaid-1576966509745 .doneText1,
#mermaid-1576966509745 .doneText2,
#mermaid-1576966509745 .doneText3 {
fill: black !important; }
#mermaid-1576941089411 .crit0,
#mermaid-1576941089411 .crit1,
#mermaid-1576941089411 .crit2,
#mermaid-1576941089411 .crit3 {
#mermaid-1576966509745 .crit0,
#mermaid-1576966509745 .crit1,
#mermaid-1576966509745 .crit2,
#mermaid-1576966509745 .crit3 {
stroke: #ff8888;
fill: red;
stroke-width: 2; }
#mermaid-1576941089411 .activeCrit0,
#mermaid-1576941089411 .activeCrit1,
#mermaid-1576941089411 .activeCrit2,
#mermaid-1576941089411 .activeCrit3 {
#mermaid-1576966509745 .activeCrit0,
#mermaid-1576966509745 .activeCrit1,
#mermaid-1576966509745 .activeCrit2,
#mermaid-1576966509745 .activeCrit3 {
stroke: #ff8888;
fill: #bfc7ff;
stroke-width: 2; }
#mermaid-1576941089411 .doneCrit0,
#mermaid-1576941089411 .doneCrit1,
#mermaid-1576941089411 .doneCrit2,
#mermaid-1576941089411 .doneCrit3 {
#mermaid-1576966509745 .doneCrit0,
#mermaid-1576966509745 .doneCrit1,
#mermaid-1576966509745 .doneCrit2,
#mermaid-1576966509745 .doneCrit3 {
stroke: #ff8888;
fill: lightgrey;
stroke-width: 2;
cursor: pointer;
shape-rendering: crispEdges; }
#mermaid-1576941089411 .milestone {
#mermaid-1576966509745 .milestone {
transform: rotate(45deg) scale(0.8, 0.8); }
#mermaid-1576941089411 .milestoneText {
#mermaid-1576966509745 .milestoneText {
font-style: italic; }
#mermaid-1576941089411 .doneCritText0,
#mermaid-1576941089411 .doneCritText1,
#mermaid-1576941089411 .doneCritText2,
#mermaid-1576941089411 .doneCritText3 {
#mermaid-1576966509745 .doneCritText0,
#mermaid-1576966509745 .doneCritText1,
#mermaid-1576966509745 .doneCritText2,
#mermaid-1576966509745 .doneCritText3 {
fill: black !important; }
#mermaid-1576941089411 .activeCritText0,
#mermaid-1576941089411 .activeCritText1,
#mermaid-1576941089411 .activeCritText2,
#mermaid-1576941089411 .activeCritText3 {
#mermaid-1576966509745 .activeCritText0,
#mermaid-1576966509745 .activeCritText1,
#mermaid-1576966509745 .activeCritText2,
#mermaid-1576966509745 .activeCritText3 {
fill: black !important; }
#mermaid-1576941089411 .titleText {
#mermaid-1576966509745 .titleText {
text-anchor: middle;
font-size: 18px;
fill: black;
font-family: 'trebuchet ms', verdana, arial;
font-family: var(--mermaid-font-family); }
#mermaid-1576941089411 g.classGroup text {
#mermaid-1576966509745 g.classGroup text {
fill: #9370DB;
stroke: none;
font-family: 'trebuchet ms', verdana, arial;
font-family: var(--mermaid-font-family);
font-size: 10px; }
#mermaid-1576941089411 g.classGroup text .title {
#mermaid-1576966509745 g.classGroup text .title {
font-weight: bolder; }
#mermaid-1576941089411 g.classGroup rect {
#mermaid-1576966509745 g.classGroup rect {
fill: #ECECFF;
stroke: #9370DB; }
#mermaid-1576941089411 g.classGroup line {
#mermaid-1576966509745 g.classGroup line {
stroke: #9370DB;
stroke-width: 1; }
#mermaid-1576941089411 .classLabel .box {
#mermaid-1576966509745 .classLabel .box {
stroke: none;
stroke-width: 0;
fill: #ECECFF;
opacity: 0.5; }
#mermaid-1576941089411 .classLabel .label {
#mermaid-1576966509745 .classLabel .label {
fill: #9370DB;
font-size: 10px; }
#mermaid-1576941089411 .relation {
#mermaid-1576966509745 .relation {
stroke: #9370DB;
stroke-width: 1;
fill: none; }
#mermaid-1576941089411 #compositionStart {
#mermaid-1576966509745 #compositionStart {
fill: #9370DB;
stroke: #9370DB;
stroke-width: 1; }
#mermaid-1576941089411 #compositionEnd {
#mermaid-1576966509745 #compositionEnd {
fill: #9370DB;
stroke: #9370DB;
stroke-width: 1; }
#mermaid-1576941089411 #aggregationStart {
#mermaid-1576966509745 #aggregationStart {
fill: #ECECFF;
stroke: #9370DB;
stroke-width: 1; }
#mermaid-1576941089411 #aggregationEnd {
#mermaid-1576966509745 #aggregationEnd {
fill: #ECECFF;
stroke: #9370DB;
stroke-width: 1; }
#mermaid-1576941089411 #dependencyStart {
#mermaid-1576966509745 #dependencyStart {
fill: #9370DB;
stroke: #9370DB;
stroke-width: 1; }
#mermaid-1576941089411 #dependencyEnd {
#mermaid-1576966509745 #dependencyEnd {
fill: #9370DB;
stroke: #9370DB;
stroke-width: 1; }
#mermaid-1576941089411 #extensionStart {
#mermaid-1576966509745 #extensionStart {
fill: #9370DB;
stroke: #9370DB;
stroke-width: 1; }
#mermaid-1576941089411 #extensionEnd {
#mermaid-1576966509745 #extensionEnd {
fill: #9370DB;
stroke: #9370DB;
stroke-width: 1; }
#mermaid-1576941089411 .commit-id,
#mermaid-1576941089411 .commit-msg,
#mermaid-1576941089411 .branch-label {
#mermaid-1576966509745 .commit-id,
#mermaid-1576966509745 .commit-msg,
#mermaid-1576966509745 .branch-label {
fill: lightgrey;
color: lightgrey;
font-family: 'trebuchet ms', verdana, arial;
font-family: var(--mermaid-font-family); }
#mermaid-1576941089411 .pieTitleText {
#mermaid-1576966509745 .pieTitleText {
text-anchor: middle;
font-size: 25px;
fill: black;
font-family: 'trebuchet ms', verdana, arial;
font-family: var(--mermaid-font-family); }
#mermaid-1576941089411 .slice {
#mermaid-1576966509745 .slice {
font-family: 'trebuchet ms', verdana, arial;
font-family: var(--mermaid-font-family); }
#mermaid-1576941089411 g.stateGroup text {
#mermaid-1576966509745 g.stateGroup text {
fill: #9370DB;
stroke: none;
font-size: 10px;
font-family: 'trebuchet ms', verdana, arial;
font-family: var(--mermaid-font-family); }
#mermaid-1576941089411 g.stateGroup text {
#mermaid-1576966509745 g.stateGroup text {
fill: #9370DB;
stroke: none;
font-size: 10px; }
#mermaid-1576941089411 g.stateGroup .state-title {
#mermaid-1576966509745 g.stateGroup .state-title {
font-weight: bolder;
fill: black; }
#mermaid-1576941089411 g.stateGroup rect {
#mermaid-1576966509745 g.stateGroup rect {
fill: #ECECFF;
stroke: #9370DB; }
#mermaid-1576941089411 g.stateGroup line {
#mermaid-1576966509745 g.stateGroup line {
stroke: #9370DB;
stroke-width: 1; }
#mermaid-1576941089411 .transition {
#mermaid-1576966509745 .transition {
stroke: #9370DB;
stroke-width: 1;
fill: none; }
#mermaid-1576941089411 .stateGroup .composit {
#mermaid-1576966509745 .stateGroup .composit {
fill: white;
border-bottom: 1px; }
#mermaid-1576941089411 .stateGroup .alt-composit {
#mermaid-1576966509745 .stateGroup .alt-composit {
fill: #e0e0e0;
border-bottom: 1px; }
#mermaid-1576941089411 .state-note {
#mermaid-1576966509745 .state-note {
stroke: #aaaa33;
fill: #fff5ad; }
#mermaid-1576941089411 .state-note text {
#mermaid-1576966509745 .state-note text {
fill: black;
stroke: none;
font-size: 10px; }
#mermaid-1576941089411 .stateLabel .box {
#mermaid-1576966509745 .stateLabel .box {
stroke: none;
stroke-width: 0;
fill: #ECECFF;
opacity: 0.5; }
#mermaid-1576941089411 .stateLabel text {
#mermaid-1576966509745 .stateLabel text {
fill: black;
font-size: 10px;
font-weight: bold;
@@ -492,7 +492,7 @@
--mermaid-font-family: '"trebuchet ms", verdana, arial';
--mermaid-font-family: "Comic Sans MS", "Comic Sans", cursive; }
:root { --mermaid-font-family: "trebuchet ms", verdana, arial;}</style><style>#mermaid-1576941089411 {
:root { --mermaid-font-family: "trebuchet ms", verdana, arial;}</style><style>#mermaid-1576966509745 {
color: rgb(0, 0, 0);
font: normal normal 400 normal 16px / normal "trebuchet ms", verdana, arial;
}</style><g></g><g><line id="actor19306" x1="75" y1="5" x2="75" y2="745" class="actor-line" stroke-width="0.5px" stroke="#999"></line><rect x="0" y="0" fill="#eaeaea" stroke="#666" width="150" height="65" rx="3" ry="3" class="actor"></rect><text x="75" y="32.5" dominant-baseline="central" alignment-baseline="central" class="actor" style="text-anchor: middle; font-size: 14px;"><tspan x="75" dy="0">Alice</tspan></text></g><g><line id="actor19307" x1="275" y1="5" x2="275" y2="745" class="actor-line" stroke-width="0.5px" stroke="#999"></line><rect x="200" y="0" fill="#eaeaea" stroke="#666" width="150" height="65" rx="3" ry="3" class="actor"></rect><text x="275" y="32.5" dominant-baseline="central" alignment-baseline="central" class="actor" style="text-anchor: middle; font-size: 14px;"><tspan x="275" dy="0">App A</tspan></text></g><g><line id="actor19308" x1="475" y1="5" x2="475" y2="745" class="actor-line" stroke-width="0.5px" stroke="#999"></line><rect x="400" y="0" fill="#eaeaea" stroke="#666" width="150" height="65" rx="3" ry="3" class="actor"></rect><text x="475" y="32.5" dominant-baseline="central" alignment-baseline="central" class="actor" style="text-anchor: middle; font-size: 14px;"><tspan x="475" dy="0">Server A</tspan></text></g><g><line id="actor19309" x1="675" y1="5" x2="675" y2="745" class="actor-line" stroke-width="0.5px" stroke="#999"></line><rect x="600" y="0" fill="#eaeaea" stroke="#666" width="150" height="65" rx="3" ry="3" class="actor"></rect><text x="675" y="32.5" dominant-baseline="central" alignment-baseline="central" class="actor" style="text-anchor: middle; font-size: 14px;"><tspan x="675" dy="0">Server B</tspan></text></g><g><line id="actor19310" x1="875" y1="5" x2="875" y2="745" class="actor-line" stroke-width="0.5px" stroke="#999"></line><rect x="800" y="0" fill="#eaeaea" stroke="#666" width="150" height="65" rx="3" ry="3" class="actor"></rect><text x="875" y="32.5" dominant-baseline="central" alignment-baseline="central" class="actor" style="text-anchor: middle; font-size: 14px;"><tspan x="875" dy="0">App B</tspan></text></g><g><line id="actor19311" x1="1075" y1="5" x2="1075" y2="745" class="actor-line" stroke-width="0.5px" stroke="#999"></line><rect x="1000" y="0" fill="#eaeaea" stroke="#666" width="150" height="65" rx="3" ry="3" class="actor"></rect><text x="1075" y="32.5" dominant-baseline="central" alignment-baseline="central" class="actor" style="text-anchor: middle; font-size: 14px;"><tspan x="1075" dy="0">Bob</tspan></text></g><defs><marker id="arrowhead" refX="5" refY="2" markerWidth="6" markerHeight="4" orient="auto"><path d="M 0,0 V 4 L6,2 Z"></path></marker></defs><defs><marker id="crosshead" markerWidth="15" markerHeight="8" orient="auto" refX="16" refY="4"><path fill="black" stroke="#000000" stroke-width="1px" d="M 9,2 V 6 L16,4 Z" style="stroke-dasharray: 0, 0;"></path><path fill="none" stroke="#000000" stroke-width="1px" d="M 0,1 L 6,7 M 6,1 L 0,7" style="stroke-dasharray: 0, 0;"></path></marker></defs><defs><marker id="sequencenumber" refX="15" refY="15" markerWidth="60" markerHeight="40" orient="auto"><circle cx="15" cy="15" r="6"></circle></marker></defs><g><text x="175" y="93" class="messageText" style="text-anchor: middle;">Alice shows &lt;AB public key&gt; as QR code on the screen</text><text x="175" y="110" class="messageText" style="text-anchor: middle;">(Alice's public key for Bob's eyes only)</text><line x1="75" y1="100" x2="275" y2="100" class="messageLine0" stroke-width="2" stroke="black" marker-end="url(#arrowhead)" style="fill: none;"></line></g><g><text x="975" y="128" class="messageText" style="text-anchor: middle;">Bob requests app to add connection</text><line x1="1075" y1="135" x2="875" y2="135" class="messageLine0" stroke-width="2" stroke="black" marker-end="url(#arrowhead)" style="fill: none;"></line></g><g><text x="575" y="163" class="messageText" style="text-anchor: middle;">Bob's app reads &lt;AB public key&gt; via the camera</text><line x1="275" y1="170" x2="875" y2="170" class="messageLine0" stroke-width="2" stroke="black" marker-end="url(#arrowhead)" style="fill: none;"></line></g><g><text x="775" y="198" class="messageText" style="text-anchor: middle;">Bob's app encrypts "connection request" (including &lt;BA public key&gt; and Bob's profile) and sends it to Bob's servers</text><text x="775" y="215" class="messageText" style="text-anchor: middle;">{from: &lt;BA public key hash&gt;, to: &lt;AB public key hash&gt;, message: &lt;request encrypted with AB public key&gt;}</text><line x1="875" y1="205" x2="675" y2="205" class="messageLine0" stroke-width="2" stroke="black" marker-end="url(#arrowhead)" style="fill: none;"></line></g><g><text x="575" y="233" class="messageText" style="text-anchor: middle;">Bob's servers use &lt;AB public key hash&gt; to locate Alice's servers</text><text x="575" y="250" class="messageText" style="text-anchor: middle;">and forward encrypted message to all Alice's servers (when they are different from Bob's serversLine truncated
}</style><g></g><g><line id="actor59554" x1="75" y1="5" x2="75" y2="2072" class="actor-line" stroke-width="0.5px" stroke="#999"></line><rect x="0" y="0" fill="#eaeaea" stroke="#666" width="150" height="65" rx="3" ry="3" class="actor"></rect><text x="75" y="32.5" dominant-baseline="central" alignment-baseline="central" class="actor" style="text-anchor: middle; font-size: 14px;"><tspan x="75" dy="0">Alice</tspan></text></g><g><line id="actor59555" x1="275" y1="5" x2="275" y2="2072" class="actor-line" stroke-width="0.5px" stroke="#999"></line><rect x="200" y="0" fill="#eaeaea" stroke="#666" width="150" height="65" rx="3" ry="3" class="actor"></rect><text x="275" y="32.5" dominant-baseline="central" alignment-baseline="central" class="actor" style="text-anchor: middle; font-size: 14px;"><tspan x="275" dy="0">Alice's app</tspan></text></g><g><line id="actor59556" x1="475" y1="5" x2="475" y2="2072" class="actor-line" stroke-width="0.5px" stroke="#999"></line><rect x="400" y="0" fill="#eaeaea" stroke="#666" width="150" height="65" rx="3" ry="3" class="actor"></rect><text x="475" y="32.5" dominant-baseline="central" alignment-baseline="central" class="actor" style="text-anchor: middle; font-size: 14px;"><tspan x="475" dy="0">Alice's server</tspan></text></g><g><line id="actor59557" x1="675" y1="5" x2="675" y2="2072" class="actor-line" stroke-width="0.5px" stroke="#999"></line><rect x="600" y="0" fill="#eaeaea" stroke="#666" width="150" height="65" rx="3" ry="3" class="actor"></rect><text x="675" y="32.5" dominant-baseline="central" alignment-baseline="central" class="actor" style="text-anchor: middle; font-size: 14px;"><tspan x="675" dy="0">Bob's server</tspan></text></g><g><line id="actor59558" x1="875" y1="5" x2="875" y2="2072" class="actor-line" stroke-width="0.5px" stroke="#999"></line><rect x="800" y="0" fill="#eaeaea" stroke="#666" width="150" height="65" rx="3" ry="3" class="actor"></rect><text x="875" y="32.5" dominant-baseline="central" alignment-baseline="central" class="actor" style="text-anchor: middle; font-size: 14px;"><tspan x="875" dy="0">Bob's app</tspan></text></g><g><line id="actor59559" x1="1075" y1="5" x2="1075" y2="2072" class="actor-line" stroke-width="0.5px" stroke="#999"></line><rect x="1000" y="0" fill="#eaeaea" stroke="#666" width="150" height="65" rx="3" ry="3" class="actor"></rect><text x="1075" y="32.5" dominant-baseline="central" alignment-baseline="central" class="actor" style="text-anchor: middle; font-size: 14px;"><tspan x="1075" dy="0">Bob</tspan></text></g><defs><marker id="arrowhead" refX="5" refY="2" markerWidth="6" markerHeight="4" orient="auto"><path d="M 0,0 V 4 L6,2 Z"></path></marker></defs><defs><marker id="crosshead" markerWidth="15" markerHeight="8" orient="auto" refX="16" refY="4"><path fill="black" stroke="#000000" stroke-width="1px" d="M 9,2 V 6 L16,4 Z" style="stroke-dasharray: 0, 0;"></path><path fill="none" stroke="#000000" stroke-width="1px" d="M 0,1 L 6,7 M 6,1 L 0,7" style="stroke-dasharray: 0, 0;"></path></marker></defs><defs><marker id="sequencenumber" refX="15" refY="15" markerWidth="60" markerHeight="40" orient="auto"><circle cx="15" cy="15" r="6"></circle></marker></defs><g><text x="175" y="93" class="messageText" style="text-anchor: middle;">Alice requests app to initiate adding connection</text><line x1="75" y1="100" x2="275" y2="100" class="messageLine0" stroke-width="2" stroke="black" marker-end="url(#arrowhead)" style="fill: none;"></line></g><g><rect x="200" y="110" fill="#EDF2AE" stroke="#666" width="150" height="68" rx="0" ry="0" class="note"></rect><text x="196" y="134" class="noteText"><tspan x="216">App generates:</tspan></text><text x="196" y="150" class="noteText"><tspan x="216">&lt;AB connection key&gt;</tspan></text><text x="196" y="166" class="noteText"><tspan x="216">&lt;A_AB server keys&gt;</tspan></text></g><g><text x="375" y="206" class="messageText" style="text-anchor: middle;">App registers on Alice's servers &lt;AB public key hash&gt; associated with &lt;A_AB server public keys&gt; (for recepient)</text><line x1="275" y1="213" x2="475" y2="213" class="messageLine0" stroke-width="2" stroke="black" marker-end="url(#arrowhead)" style="fill: none;"></line></g><g><text x="375" y="241" class="messageText" style="text-anchor: middle;">App subsribes to receive messages from anyone sent to &lt;AB public key hash&gt;</text><text x="375" y="258" class="messageText" style="text-anchor: middle;">(request is signed with &lt;A_AB server private keys&gt;)</text><line x1="275" y1="248" x2="475" y2="248" class="messageLine0" stroke-width="2" stroke="black" marker-end="url(#arrowhead)" style="fill: none;"></line></g><g><rect x="200" y="258" fill="#EDF2AE" stroke="#666" width="150" height="68" rx="0" ry="0" class="note"></rect><text x="196" y="282" class="noteText"><tspan x="216">App shows QR code</tspan></text><text x="196" y="298" class="noteText"><tspan x="216">for &lt;AB public key&gt;</tspan></text><text x="196" y="314" class="noteText"><tspan xLine truncated

Before

Width:  |  Height:  |  Size: 22 KiB

After

Width:  |  Height:  |  Size: 32 KiB