Attestation Flow Improvment

[AW-STJ]

@oleggrib - thanks for creating the prototype. Here is what I had tested:
https://www.loom.com/share/878b5348f5354aad8edf7f255ea0a0be

In the flow, when I click verify the below modal opens up:

Can this step be avoided and let the new tab open up automatically.

The best flow I have seen is using OpenAuthentication for Twitter:
https://www.loom.com/share/0ca692eda37f4b62887ecb7adb3c1324

Is this possible? In this flow a new tab is not even opened as the website is directed Twitter's authentication in the same tab.

If not, we can use the current flow but the UI and designed have to updated. cc: @colourfreak

[oleggrib]

let me describe the flow, flow is universal:

• third party website opens token iframe
• all secrets stay secured in the tokenIframe
• tokenIframe request attestation.id . this is where problem appeared - attestation.id + Auth0 doesnt work in iframe :-), so I have to open new tab, but new tab is blocked until user click some button, this is why I have to display button

twitter authorization dont need to be fired in iframe and open new tab(popup) by user click, this is the difference

[micwallace]

@AW-STJ @oleggrib It would be possible to implement a flow using redirects (like a lot of oauth services use). The most time consuming work would be restoring state after the user is redirected back to the third party website, but in most cases that's not much of an issue since TN is no longer required.

This wouldn't be a good UX for token loading but it's fine for the attestation process, and would probably be the most robust solution.

[oleggrib]

@micwallace , I'd like to avoid send sensitive data as URL param, so I am trying to send data with postMessages, because its most secure way. In case of redirects they use params, but params often saved in HTTP server logs, so its additional option to get access to user secrets/email/etc

[micwallace]

@oleggrib You can use document hash (URI fragment) for this purpose. This part of the URL is not sent to the server by the browser. There is still risk in the case of a compromised browser or system but in that case the user is already screwed haha

[AW-STJ]

It would be possible to implement a flow using redirects (like a lot of oauth services use). The most time consuming work would be restoring state after the user is redirected back to the third party website, but in most cases that's not much of an issue since TN is no longer required.

If we can make this work, with a good coverage of devices and platforms, then the better user experience would be worth putting in this effort. Needs to provide standard level of security as well.

@oleggrib - do you think the security would still be compromised

@micwallace - can you describe the user flow, if your proposed solution is implemented. Would it be the same as the Twitter OAuth thats shown in the video attached to this issue.

[colourfreak]

The best flow I have seen is using OpenAuthentication for Twitter:
https://www.loom.com/share/0ca692eda37f4b62887ecb7adb3c1324

This is a very good UX. The user does not need to know or click anything. Just sit and wait.

[colourfreak]

If that opens Attestation iframe in a new tab, it means that I won't be able to complete the process in AlphaWallet browser (no support for multiple tabs)

[oleggrib]

@colourfreak , I have prepeared flow to open attestation.id in same tab, create attestation, then back to Devconnect tab and then read ready attestation through iframe. I will test this flow later, because no time to do it right now.
but I hope it will work good in Alphawallet browser too.

[AW-STJ]

Hey @oleggrib - one small change.

Watch the video from 0:30
https://www.loom.com/share/11b913f3b06747eea9311d2be8ccad7f

If someone navigates back, then it shows the following modal. Does not make sense.

Instead, can you show
Heading 'Email Attestation verification in progress'
Subtext 'Please complete the verification process to continue'

[oleggrib]

@AW-STJ , I fixed auto-fill email , added your text and added attestation tab close detector

[oleggrib]

You can use document hash (URI fragment) for this purpose. This part of the URL is not sent to the server by the browser. There is still risk in the case of a compromised browser or system but in that case the user is already screwed haha

@micwallace
I have bit different idea:

1. open iframe and try to get attestation
2. if no valid attestation then redirect whole page to the attestation. attestation will be saved
3. back to page and try to get attestation with iframe

[micwallace]

@oleggrib This is good but it won't work on Safari because of their iframe origin policy. This could be fixed by returning the attestation in the URL fragment. Safari will always have to redirect but it will work at least.