- Website: https://birthday-gated-website.on.fleek.co/
- In order to see the gated part of the website, you need a KYCAgeCredential Verifiable Credential with a birthday after January 1, 2023, held in the Polygon ID Mobile wallet app.
![Screenshot 2023-06-06 at 10 30 51 AM](https://private-user-images.githubusercontent.com/91382964/243779890-53fe84f1-18ae-4050-9517-5e54ec1de982.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MjI0Mjk2ODUsIm5iZiI6MTcyMjQyOTM4NSwicGF0aCI6Ii85MTM4Mjk2NC8yNDM3Nzk4OTAtNTNmZTg0ZjEtMThhZS00MDUwLTk1MTctNWU1NGVjMWRlOTgyLnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNDA3MzElMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjQwNzMxVDEyMzYyNVomWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPTAwNzViN2YzMmRkYTYwNDViYWExZWU2MjJlOWU5ZjQwZjc3Zjg4NTc0OWIwMDdjNTA5MmU3Mjg4YzE4NTQzOTYmWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0JmFjdG9yX2lkPTAma2V5X2lkPTAmcmVwb19pZD0wIn0.kuTOg-adssbiqvhZobR0QzlZYES5jf6-2Ew2lHskb20)
Read through the server readme and follow local server setup instructions: https://github.com/oceans404/vc-verifier#local-server-setup
git clone https://github.com/oceans404/vc-gated-website
cd vc-gated-website
npm i
cp .env.sample .env;
Update the REACT_APP_VERIFICATION_SERVER_URL variable to your hosted server url from step 7: https://github.com/oceans404/vc-verifier#7-hosting-the-server-optional
Or, if you haven't hosted the server using Render, set REACT_APP_VERIFICATION_SERVER_URL="http://localhost:3000" because that's where the you are running the server locally. Don't set REACT_APP_VERIFICATION_SERVER_URL to your ngrok forwarding address or you'll face CORS errors.
npm start
Visit http://localhost:8080/
I've documented a similar hosting process here: https://github.com/oceans404/fullstack-sockets-demo#deploy-your-frontend
This frontend interacts with my verifier server to
- Watch for events emitted by socket for the user's specific sessionId
- frontend: https://github.com/oceans404/vc-gated-website/blob/main/src/PolygonIDVerifier.js#L48
- backend:
- getAuthQr in progress https://github.com/oceans404/vc-verifier/blob/main/index.js#L63
- getAuthQr done: https://github.com/oceans404/vc-verifier/blob/main/index.js#L86
- handleVerification in progress: https://github.com/oceans404/vc-verifier/blob/main/index.js#L100
- handleVerification done: https://github.com/oceans404/vc-verifier/blob/main/index.js#L135
- Request the QR code containing the birthday query (zk request) for display
- frontend fetch: https://github.com/oceans404/vc-gated-website/blob/main/src/PolygonIDVerifier.js#L62
- backend getAuthQr: https://github.com/oceans404/vc-verifier/blob/main/index.js#L37
- backend birthday query: https://github.com/oceans404/vc-verifier/blob/main/proofRequest.js
- Report verification result to the rest of the app: https://github.com/oceans404/vc-gated-website/blob/main/src/App.js#L39