Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: Share form secret keys across browser tabs using BroadcastChannel #203

Merged
merged 2 commits into from
Aug 26, 2020

Conversation

frankchn
Copy link
Contributor

@frankchn frankchn commented Aug 25, 2020

Problem

Users have to repeatedly enter their form secret key if they open multiple tabs with the same form. This hinders future bulk downloading of attachments (Issue #16) because there are multiple clicks involved in unlocking a response from a tab.

Solution

We utilize BroadcastChannel to request and broadcast the form secret key to other tabs.

Tests

  • Open two tabs and navigate to the View Responses page of a storage mode form. Upload a secret key to one form to unlock. The other tab should be unlocked automatically.
  • Unlock responses on one form. Open a second tab and go to view responses. The tab should already be unlocked.

Security

BroadcastChannel will only broadcast the message to scripts from the same origin (i.e. https://form.gov.sg in practice) so all data should be controlled by scripts originating from FormSG. This does not store any data in browser-based storage (e.g. cookies or localStorage) so secrets would not be retained past the user closing all FormSG tabs containing the form.

We do not use polyfills for BroadcastChannel as they usually involve localStorage, which is not safe for secret key handling.

Browser Compatibility

BroadcastChannel is not available on Safari and IE 11, so this feature is not available on those two browsers. Current behavior where users have to upload the secret key on each tab will continue for users on those two browsers.

Copy link
Contributor

@liangyuanruo liangyuanruo left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Awesome feature for not a lot of code! Could I trouble you to document both the security and the browser compatibility considerations?

@frankchn
Copy link
Contributor Author

@liangyuanruo Added to pull request :)

vm.privateKeyChannel = new BroadcastChannel('formsg_private_key_sharing')
vm.privateKeyChannel.onmessage = function (e) {
if (e.data.action === 'broadcastKey') {
if (vm.encryptionKey === null && vm.myform._id === e.data.formId) {
Copy link
Contributor

@liangyuanruo liangyuanruo Aug 25, 2020

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

thinking through this bit of logic again - the user needs to already have the 2nd tab open prior to entering the key? so BroadcastChannel on its own wouldn't be able to help with opening a link from the CSV, unless we used LocalStorage?

Copy link
Contributor Author

@frankchn frankchn Aug 25, 2020

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

No, the user doesn’t. When the 2nd tab loads, it will send a requestKey message (line 70) and any already opened tab should respond with another broadcastKey message.

@frankchn frankchn merged commit 695fbf2 into develop Aug 26, 2020
@frankchn frankchn deleted the frank-broadcast-channel branch August 26, 2020 01:25
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

2 participants