Permistory

A dashboard to make permission (camera, microphone, and location) usage data accessible to the user!

Comment 3

Inspiration

Have you ever wondered which websites have used your camera, microphone, and location at certain times throughout the day? Why do some advertisements on the internet seem too targeted towards your needs? In reality, blindly granting web pages access to these devices and personal information is frequent and can lead to a breach of privacy and vulnerable victims. Digital privacy is a modern-day necessity, and we aimed to make it more accessible to the public by providing a light snapshot of browser device usage by domain through our chrome extension Permistory.

What it does

Permistory allows you to see just how long websites have been using your camera, microphone, and which websites fired intents to retrieve your location in a digestible bite.

How we built it

To build the dashboard, we used React, Typescript, and visx (a low-level visualization library from Airbnb). In order to retrieve device usage information, we created a content script that injected another script that can intercept the native API requests the webpage makes to connect or disconnect to these devices. Essentially, we decorate methods like Navigator.getUserMedia and Navigator.geolocation with Permistory's logic from the injected script. For example, once the injected script intercepts these requests, the injected script can message the content script about these events and the content script can store these events in Chrome storage. From there, our dashboard can query this data and build the durations at which the camera or microphone was used on a webpage and display it. For location, its a lot simpler, we send a message from the injected script to the content script when the webpage calls the geolocation APIs. The content script would increment the count of the host the geolocation API call happened under.

Challenges we ran into

Knowing whether a camera or microphone was connected and used by the website was one of the biggest challenges of this project. Hence, we resorted to techniques like patching in order to "listen" to when device connections or disconnections occur. When patching, it is critical ensure the patched APIs still have the same behavior as the unpatched APIs.

Moreover, we had to leverage content scripts and injected scripts and implement communication between the injected script and the content script in order to actually receive device lifecycle events.

Finally, we wanted to use react to develop the UI of the chrome extension. This involved tinkering around with the built index.html file with a python script since chrome extensions have multiple different interfaces.

Accomplishments that we're proud of

We are proud to take the idea from scratch to fully functional in less than 24 hours. Before we started working on this idea, many of our team members were not familiar with the technologies to build a chrome extension. We are also proud of being resilient throughout the entire weekend despite many challenges as stated in the last section. Lastly, we are proud to come up with an idea that actually brings awareness to digital privacy and increases a users' accessibility to their own digital privacy while they surf the web. The beauty of this solution is that all this data will live on the user's browser itself.

What we learned

We learned a lot about JavaScript, TypeScript, React, and a ton more about chrome extensions. Chrome extensions are very powerful and can allow a developer to completely transform the experience of a user.

What's next for Permistory

Currently, we only show usage statistics for the camera, microphone, and location. However, we want to expand this to more features. We would like to summarize information about website cookies, local cache, and local storage into a digestible bite for our users. Moreover, we would also like to expand to other browsers as well. We also want to see if we can create a mechanism that revokes permissions after a certain duration. Overall, we definitely want to continue working on this app after this hackathon and build a tool that gives the users the power to take control of their digital privacy.

The biggest goal for Permistory is to empower users to care for their privacy.

How to install it:

The extension has some mock data so you can view the dashboard without having to generate your own. The extension still works correctly, and will create new data when websites try to access your permissions.

Built With

+ 15 more
Share this project:

Updates