positive_intentions

im working on a javascript UI framework for personal projects and im trying to create something like a React-hook that handles "encrypted at rest".

the react-hook is described in more detail here. id like to extend its functionality to have encrypted persistant data. my approach is the following and it would be great if you could follow along and let me know if im doing something wrong. all advice is apprciated.

im using indexedDB to store the data. i created some basic functionality to automatically persist and rehydrate data. im now investigating password-encrypting the data with javascript using the browser cryptography api.

i have a PR here you can test out on codespaces or clone, but tldr: i encrypt before saving and decrypt when loading. this seems to be working as expected. i will also encrypt/decrypt the event listeners im using and this should keep it safe from anything like browser extensions from listening to events.

the password is something the user will have to put in themselves at part of some init() process. i havent created an input for this yet, so its hardcoded. this is then used to encrypt/decrypt the data.

i would persist the unencrypted salt to indexedDB because this is then used to generate the key.

i think i am almost done with this functionality, but id like advice on anything ive overlooked or things too keep-in-mind. id like to make the storage as secure as possible.

https://positive-intentions.com/blog/qr-codes-as-a%20data-channel

QR Codes as a Data Channel

the demo in the blog article is a bit cluncky. here is a better link for it: https://chat.positive-intentions.com/#/qr

Functional Web Components

https://positive-intentions.com/blog/dim-todo-list

Github: https://github.com/positive-intentions/dim

Demo: https://dim.positive-intentions.com

https://positive-intentions.com/blog/dim-functional-webcomponents/

im investigating an idea i have about functional webcomponents after some experience with Lit.

Lit is a nice lightweight UI framework, but i didnt like that it was using class-based components.

Vue has a nice approach but i like working with the syntax that React used and i wondered if with webcomponents i could create a functional UI framework that didnt need to be transpiled.

i think the article is already quite long, so i think i will create a separate one as a tutorial for it.

note: im not trying to push "yet another ui framework", this is an investigation to see what is possible. this article is intended as educational.

im aiming to make a chat app secure as theorhetically possible as a webapp. for transparency its open source. id like the experience to be as close to possible to a regular chat app. its important to note; there are limitation with p2p and webapps such that messages cant be sent if the peer isnt connected.

to keep this post brief, please take a look at the readme. it has all the information and links.

i dont think its ready to replace any app or service, but id love to get feedback on what you think would make it so you would use it more than once.

im aiming to make a chat app secure as theorhetically possible as a webapp. for transparency its open source. id like the user experience to be as close to possible to a regular chat app. its important to note; there are limitation with p2p and webapps such that messages cant be sent if the peer isnt connected.

to keep this post brief, please take a look at the readme. it has all the information and links.

i dont think its ready to replace any app or service, but id love to get feedback on what you think would make it so you would use it more than once.

https://github.com/positive-intentions/chat

Is this a secure messaging app? probably not... but id like to share some details about how my app works so you can tell me what im missing. id like to have wording in my app to say something like "most secure chat app in the world"... i probably cant do that because it doesnt qualify... but i want to understand why?

im not an expert on cyber security or cryptography. im sure there are many gaps in my knowlege in this domain.

using javascript, i created a chat app. it is using peerjs-server to create an encrypted webrtc connection. this is then used to exchange additional encryption keys from cryptography functions built into browsers to add a redundent layer of encryption. the key exchange is done like diffie-helman over webrtc (which can be considered secure when exchanged over public channels). the algorithms are fairly easy to use and interchangable as described here.

• i sometimes recieve feedback like "javascript is inherently insecure". i disagree with this and have opened sourced my cryptography module. its basically a thin wrapper around vanilla crypto functions of a browser. a prev post on the matter.
• another concern for my kind of app (PWA) is that the developer may introduce malicious code. this is an important point for which i open sourced the project and give instructions for selfhosting. selhosting this app has some unique features. unlike many other selfhosted projects, this app can be hosted on github-pages for free (instructions are provided in the readme). im also working on introducing a way that users can selfhost federated modules. a prev post on the matter.
• to prevent things like browser extensions, the app uses strict CSP headers to prevent unauthorised code from running. selfhosting users should take note of this when setting up their own instance.
• i received feedback the Signal/Simplex protocol is great, etc. id like to compare that opinion to the observation in how my todo app demo works. (the work is all experimental work-in-progress and far from finished). the demo shows a simple functionality for a basic decentralized todo list. this should already be reasonably secure. i could add handlers for exchanging keys diffie-helman style. which at this point is relatively trivial to implement. I think it's simplicity could be a security feature.
• the key detail that makes this approach unique, is because as a webapp, unlike other solutions, users have a choice of using any device/os/browser.

i think if i stick to the principle of avoiding using any kind of "required" service provider (myself included) and allowing the frontend and the backend to be hosted independently, im on track for creating a chat system with the "fewest moving parts". im hope you will agree this is true p2p and i hope i can use this as a step towards true privacy and security. security might be further improved by using a trusted VPN.

i created a threat-model for the app in hopes that i could get a pro-bono security assessment, but understandable the project is too complicated for pro-bono work. i contacted "Trail of bits" because of their work on SimpleX and they have quoted me $50,000. the best i can offer is "open-source and communicating on reddit". (note: i asked them if i can share those details... summarized response: the SOW is confidential, but i can share the quote.)

while there are several similar apps out there like mine. i think mine is distinctly a different approach. so its hard to find best practices for the functionalities i want to achieve. in particular security practices to use when using p2p technology.

(note: this app is an unstable, experiment, proof of concept and not ready to replace any other app or service. It's far from finished and provided for testing and demo purposes only.)

• Github: positive-intentions/chat
• More information about the app: positive-intentions.com
• Follow the subreddit: r/positive_intentions

https://youtu.be/2gTTu4OqoiM

https://github.com/positive-intentions/chat

the code related to the video is a faily basic implementation using BabylonJS. it can be found here.

id like to see if i can get handpose-estimation to work well enough to be able to add to the BabylonJS render engine.

im working on something i hope will work like the 8thwall demo here. i couldnt find an open-source alternative to this. my progress so far is as described here. i dont have much experience in creating games or graphics, so any guidance/help/advice is appriciated.

disclaimer: its a proof-of-concept app. for testing and demo purposes only. maybe this article helps clarify some details.

https://github.com/positive-intentions/chat

probably not... Because I'm comparing it to everything... but id like to share some details about how my app works so you can tell me what im missing. id like to have wording in my app to say something like "most secure chat app in the world"... i probably cant do that because it doesnt qualify... but i want to understand why?

im not an expert on cyber security. im sure there are many gaps in my knowlege in this domain.

using javascript, i created a chat app. it is using peerjs-server to create an encrypted webrtc connection. this is then used to exchange additional encryption keys from cryptography functions built into browsers to add a redundent layer of encryption. the key exchange is done like diffie-helman over webrtc (which can be considered secure when exchanged over public channels)

• i sometimes recieve feedback like "javascript is inherently insecure". i disagree with this and have opened sourced my cryptography module. its basically a thin wrapper around vanilla crypto functions of a browser. a prev post on the matter.

• another concern for my kind of app (PWA) is that the developer may introduce malicious code. this is an important point for which i open sourced the project and give instructions for selfhosting. selhosting this app has some unique features. unlike many other selfhosted projects, this app can be hosted on github-pages for free (instructions are provided in the readme). im also working on introducing a way that users can selfhost federated modules. a prev post on the matter.

• to prevent things like browser extensions, the app uses strict CSP headers to prevent unauthorised code from running. selfhosting users should take note of this when setting up their own instance.

• i received feedback the Signal/Simplex protocol is great, etc. id like to compare that opinion to the observation in how my todo app demo works. (the work is all experimental work-in-progress and far from finished). the demo shows a simple functionality for a basic decentralized todo list. this should already be reasonably secure. i could add a few extra endpoints for exchanging keys diffie-helman style. which at this point is relatively trivial to implement. I think it's simplicity could be a security feature.

• the key detail that makes this approach unique, is because as a webapp, unlike other solutions, users have a choice of using any device/os/browser.

i think if i stick to the principle of avoiding using any kind of "required" service provider (myself included) and allowing the frontend and the peerjs-server to be hosted independently, im on track for creating a chat system with the "fewest moving parts". im hope you will agree this is true p2p and i hope i can use this as a step towards true privacy and security. security might be further improved by using a trusted VPN.

i created a threat-model for the app in hopes that i could get a pro-bono security assessment, but understandable the project is too complicated for pro-bono work.

while there are several similar apps out there like mine. i think mine is distinctly a different approach. so its hard to find best practices for the functionalities i want to achieve. in particular security practices to use when using p2p technology.

(note: this app is an unstable, experiment, proof of concept and not ready to replace any other app or service. It's far from finished and provided for testing and demo purposes only. This post is to get feedback on the app to determine if i'm going in the right direction for a secure chat app)

i want to understand more about WebRTC security when using vpn. id like to know if it is more secure with VPN than without… or even if its recommended to use WebRTC with VPN.

i created a webrtc demo: https://chat.positive-intentions.com/#/webrtc (the corresponding code its created with: https://github.com/positive-intentions/chat/blob/staging/src/components/pages/webrtc/WebRTC.jsx)

if i generate a “WebRTC offer” then i see a bunch of information including my IP address.

if i do the same with VPN, i see that my ip address isnt in that payload.

following the information here: https://thehackernews.com/2015/02/webrtc-leaks-vpn-ip-address.html?m=1

and using the demo here: https://ipleak.net/

it seems even with vpn, the local ISP ip seems detected.

a recurring concern ive had on reddit about the security of my app is that webrtc exposes ip addresses. im investigating using the app with vpn. it seems to work like normal.

in the example details given above, i see while the local ISP IP is exposed, the personal ip address is still hidden. im sure what is exposed there is not worthless, but it could help users with privacy and security.

on the back of this investigation id like to see if i can add something like a toggle in my app called “enforce VPN” which will first check to see if you are on a vpn, and if you are, open the rest of the app.

my app is using peerjs-server as the connection broker. this is a third party i have no contractual agreement to provide me with a service. it could help to hide your IP from this service.