How to add ZKPS to your app (with Zupass)
EthPrague 2024 · 31 May 2024 · 21:12
At EthPrague 2024, Richard Liu of the 0xPARC community explains how to add zero-knowledge proofs to an app with Zupass. The talk gives an overview of Zupass and shows how the event's own items, such as tickets and food vouchers, offer a glimpse of a permissionless, ZK-enabled future.
Speakers
Topics
From EthPrague 2024, hosted by ETHPrague.
Holešovice Market
Transcript
hello uh next speaker Richard all good ready yes let's talk about TK pass yes we'll talk about ZK and zoo pass so uh good afternoon everyone I'm Richard this is Ivan we contribute to the zoo pass project which is an open source ZK experimental Tech um if you've noticed your ticket has been in zoo pass when you checked in and and here we'll go a bit more over how do you actually use this Tech techology to build your own apps right and here we'll learn a bit about how to uh create ZK proofs with under 20 lines of code um even if you don't have too much ZK specific background so without further Ado we'll we'll begin and actually I'll hand it
off to Ivan to do a bit of intro as well hello um I'm not going to be doing the workshop I'm just sort of here to introduce myself if you need help with any of the stuff we're going to present or Richard's going to present I will be in the back after the workshop and available on the internet as well cool thanks Ian so again uh these are your tickets um they contain the tickets you need for registration but what can they do beyond that right well I think some 200 or so folks have joined the telegram and in the telegram what you need to do is uh talk to a telegram bot this bot zookat it's a friendly bot that manages zero knowledge proofs and
and you in here you have a screen where you have to prove that you own a eth Prague ticket in order to join so for folks that are somewhat familiar with that flow you've already used a ZK proof um in addition and this was announced at the opening ceremony and the hacker manual but the zoo poll or Anonymous vote the uh hackers and audience vote on Sunday so after everyone submits everyone's going to vote for projects that will also be through um making a ZK proof your zoo pass and that essentially is sort of so we can have Anonymous voting um so you know have people sort of like bribing each other to see you know who voted on which so these are two sort of examples of uh
ways within the conference how zup pass and ZK authentication is used so we have this common kind of screen here right of some kind of okay I'm I have a piece of data in this case my eth Prague ticket and I'm making a ZK proof out of it right um this is sort of you can think of it roughly analogous to a metamask confirmation screen right you're you're signing a transaction in this case you're making a ZK proof um and in this ZK proof I'm revealing two things in my ticket I'm revealing my email and my name um in other ZK proofs I'm revealing other things for example in zoole I'm not revealing my email or my name I'm revealing a specific you know ID or
nullifier that indicates that I'm part of this uh sort of Merkel group of the event so I can go more into the details of that later but just know that this screen represents different kinds of proofs and you can see sort of within the screen what exactly you are revealing in each of these proofs so you might be thinking well okay this ZK stuff is cool and all but isn't it super hard isn't it like Moon math um you know don't I need to be some kind of like academic to get started um so this is here is a language called C it's pretty complicated um it's actually like one of the easier of the ZK languages that people use and essentially it consists of um you know
writing code AS math problems right so this is like a pretty fun interesting challenge but it's not really convenient when you have like two or three days to hack on something useful right or if you just want to U you know get started on ZK for the first time so although we you know love circom we think that circom is probably too inaccessible to to most developers um so we developed this Library this open source Library called zo off and everything you need to request a ZK proof is contained within the lines here right so there's this one function await zooo popup um in here you request okay I want to I want you know
the user to reveal their email their name and the event ID you know the fact that it's eth Prague I can option submit some kind of Watermark um to commit to some sort of message and I'm saying that I'm using the eth Prague tickets configuration right so this is like less than 10 lines of code to request a ZK proof okay so that's a bit of a preview of what's going on again we have zoo pass during the event we have a bunch of different you know apps that request ZK proofs creating your own ZK app can be super super simple doesn't require any knowledge of math or you know deep ZK expertise so going to do a bit of a briefing of what is you know zass what
is the sort of actual architecture of it so one decision for for zass is that data is held locally on the device so rather than it being stored um you know in plain text on a centralized server which is typical of you know things like Facebook or like large uh you know companies that have these apps data is held locally in your device and we store an uh ENT encrypted copy um so that you can you know log into your zoo pass on different devices on your laptop and your phone um the data that's being exchanged is you know client to client right so if you remember in those examples you had zup pass talking to the telegram bot right or you had zup pass talking to
zole or zup pass talking to some ZK app of your choice that you hack on in eth Prague the data is being exchanged between you know the zup pass client and and that app's client there's no sort of like big server doing all that computation and because of this uh ZK proofs ensure privacy and data Integrity right um there's no need to trust the centralized server uh there's you know the clients can just verify that the proofs are valid um so you can you can kind of see that this is very analogous to what like some of these ideas are pretty related to you know what working on ethereum enables right except uh to work on this you actually don't need to like hook onto hook on chain you don't
need to set up like an RPC to inere or anything right you can just get started with those 10 lines of code and that's kind of what uh you know like is is the Breakthrough here right like we can start hacking on ZK proofs without needing to do all this setup um we do have some exciting like onchain Integrations though for folks that want to get more into it towards the end uh specifically like how do you verify ZK proof on chain cool so okay that was a text Heavy slide just to give another sort of analogy of what's going on here um this was the setup we had like one setup we had a Dev connect so we had a developer from the ethereum foundation Philip who built this um holis guy holis sky is also the
the name of the city um right but holis guy is a test net as well and that uh they have a fet that issues test net eth for developers um so if you uh if you approved ownership of a Dev connect ticket right there's that proved screen over there you can you're revealing your event um your sort of zup pass specific public key then you can log in with zup pass um the faucet will authenticate you and then it will um after you're authenticated after you're validated it will send you that 500 whole Le so essentially you had an app that was gated to having like bin to Dev connect right um You can imagine like adding complexity into this right like for
example oh you this app is you have uh you know prove that you have a Dev connect ticket and get some e you could add on like oh prove that you had a Dev connect ticket and you checked in right and then get something else or prove that you have a Dev connect ticket and you have an eth Prague ticket right and maybe get like you know 700 whole eth or sort of arbitrary predicates um can be expressed through many of these like proof screens um so what actually happens during this process of authentication so uh the first thing that happens is well you request a certain kind of proof so
that's the different you know parameters on the screen here right you request what in this in this case this specific proof ZK EDSA event ticket PCD it's kind of a mouthful but it's requesting uh these two fields from you email and name um and then after this proof is um after the user clicks proof that proof is then sent to you know another client or server really anywhere that you you want and uh that ZK proof is verified um so essentially what's what's going on is you have an app that's again requesting a proof from your zoo pass and that the proof is being sent to a different app which is verifying that ZK proof um maybe I'll go to the following slide
yeah so verification again proofs are verifiable uh you don't need to trust any sort of third party API um and it's cryptographic verification uh so you can check the content of the actual data itself cool I'll just probably stay here actually um so there's one other thing if you remember on that first screen of uh the 10 lines of code which is the watermark so some proofs can contain an arbitrary Watermark which is kind of a similar ilar to you know like a challenge um in in the web 2 world right which is or like a not in ethereum right where you uh let's say you want to avoid
mandal attacks you can have the client sign a certain Watermark you can have like client number two or a server check that same Watermark and that way you can prevent somebody from sort of like you know uh who might intercept that request um from you know uh interfering with this authentication yeah and it also allows for credential replay attacks so one thing you can do is put a time stamp in the watermark cool so going back to the screen again we have um the process of requesting a ZK proof through zup pass and the verification is actually even simpler um you just need to call this authenticate function and in here you
post the actual you know PCD string PCD Str which is the uh which is the which is in this result here um towards the bottom and then you uh place your watermark and then finally the configuration so again having that Watermark be the same that Watermark needs to match the watermark that you request in the client um in order for this authenticate function to to verify properly otherwise it'll throw an error okay so um we're moving pretty fast here but uh one extension of this again here we're mostly talking about this is all typescript again um so you can run in the front end run it in a
node server in the back end but what if we want to do something on chain right um you know I for example there might be smart contracts that have uh that want to sort of verify ZK proofs of you know anything anything from as from as small as eth prog attendant to in the future right um verifying you know government IDs right or like Financial records so I think getting ZK verification on chain is a pretty exciting primitive and here's this QR code for a library that um you know Austin Griffith from Bill Guild hacked on which is uh essentially you can kind of see in this diagram here um what this uh process is maybe I'll actually show the video first that'll
give a better idea cool so I'm going to full screen this so we have a zup pass scaffold eth2 starter kit um and one note is that I think this is yeah e Berlin tickets but the principles are mostly the same besides that so the first step is we request the ZK proof right so in this case it opens a popup um requesting from our zoo pass in E Berlin ticket in this case I I have an eth Berlin hacker ticket um and it's requesting you know my email the event and the product IDs so I go ahead and click prove or I have
two tickets actually I can choose the hacker ticket I click prove and then I can um just so we we're going a bit fast here uh I can verify first on the front end because there's that you know node uh J typescript Library I can verify within this react app here um I then verify in the back end and then after this back after this or I send this to a server and then I verify that within a server using that same authenticate function um and then I send one eth to the address I'm connected to and then finally the step four is sending the proof to a Smart contract and this smart contract uh takes that proof and you know verifies verifies the proof on
Chain by doing some like math operations essentially um specifically it's like a sem it's a uh or it's it's a Groth 16 verification but it verifies this and after doing so U Min the mint an nft for the user so if we go ahead and click on the sample block Explorer we'll see that the latest transaction is like a mint item uh to the account we're connected to and um if you're curious The Watermark we mentioned from earlier was used to encode the address that I wanted to Mint that nf2 and that way that prevents you know it's like I'm committing to okay I want this person to be min nft um to prevent sort of you
know fraudulent transactions okay so just to go over this again we have the sca to front end which is uh you know everything you saw um you know on the web page the first step is requesting a proof from zup pass your your data is stored locally in zup pass it sends the data back to the scaffold e front end where it's verified that's the step two here um step three it sends the PCD the the PCD is sort of the name for the ZK proof sends the PCD to the back end of scaffold eth where it verifies the proof and sends the eth um returns a 200 response and finally it sends the proof on chain where it's verified in this
kind of big smart contract um where it calls broth 16 verifier do verify proof and finally minc the nft so three different or one one way to or yeah one way to request approve from zoo pass and three different ways to verify it on the front end on a server and on chain and yeah all the code here uh you can look through some of the examples to get a sense of um what's going on here and Ivan and I are also happy to help walk through any of the details okay so that mostly concludes the workshop again um the kind of key
thing here is zass is software for creating for easily requesting and verifying ZK proofs um you can request you you can create a ZK proof by writing these 10 lines of Code by using this Zoo popup on the client and you can verify with an authenticate request we also have some libraries for onchain verification um and we have a sort of complete list of documentation for developers at this QR code here if you're if you're more curious curious um we also lastly have a telegram group where you can ask questions to some of the other zup pass contributors um you know from around the world and they can help out and debugging any issues uh helping you guys create a great hack um
but yeah that's that's mostly it um yeah thank you all and we'll take any questions thank you Richard any questions um thanks I love it um I think e prag last year we gave out some sbts on like a QR code it was really rudimentary and I hated it at the time and it's wonderful to see this this year it runs really smooth um yeah in fact it's my there's so many more applications for this right it's uh much more General products than just authentication for
for getting into spaces for example um could you explore that a little bit and like what are you thinking in mind in on the more generalized set of use cases in this yeah great question um so there's uh there's actually a lot of Prior talks about the more kind of like expansive Direction this is um so I work for this organization called xerx Park that focuses a lot on this field called programmable crypto cryptography which is essentially what are the new sort of uh possib abilities that this essentially really powerful technology brings us right and zass is just really the tip of the iceberg um you know authenticating tickets is just really the tip of the iceberg right uh so to go
into that a bit um I think that you have maybe I'll just sort of give a bit of a Prelude and and direct folks to watch um some videos afterwards but uh we have this world where you know we're moving from first generation cryptography which is things like signatures encryption um to second second generation cryptography which is ZK proofs and even more complex cryptography such as multiparty computation fully homomorphic encryption a lot of these like buzzword that you might have heard of and the powerful thing about this is that well one a lot of these you know protocols that were in first generation cryptography right um were mostly about
like defense right it's like I want to secure my data so that hackers can't exploit it right I want to keep certain things private I want to communicate only with certain trusted parties or I want to verify or I want to show that this piece of data is signed by me right nobody else can claim that um this category of second generation cryptography actually allows for a lot more like kind of offensive like new things to be created uh as a virtue of things being like hard right so I think blockchains are really the first like a good example of this right where you have um you know some ecosystem like def emerging because all these contracts are composable right and like the sort of you know like
coefficient of creating a new application is super super low right I think with ZK proofs we're seeing a similar sort of uh thing happening for like existing data right so a lot of data exists out there in financial records governments right that uh can be you know sort of signed and then created you know shared between different entities right like the world that one could imagine is one where you you store all your data locally and you generate proofs of that data to uh certain you know like consumers of that data so like I don't need to sort of have an Equifax score I just store all those that data locally in you know something like probably a lot more complex than zup
pass right and then anybody can sort of request some sort of part of that data um it's almost like a global API right without needing to conform to all these like very specific specs that we have in the current world um so I kind of close off with directing folks if they're curious to see um gub sheep's talk at Prague crypto about programmable cryptography uh so you can search this on Google and that will give like a much broader View and more detailed view into what this world leads to any other questions no silence thank you cool
[Music]