Skip to content

Commit f4f2312

Browse files
spacesailor24spacesailor24
authored
Merge pull request #67 from LIT-Protocol/wyatt/siws-authentication
Init SIWS Authentication within a LA example code
2 parents f27c487 + 7dbd2cb commit f4f2312

30 files changed

+9607
-0
lines changed

‎siws-authentication/browser/.env.example‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
VITE_ETHEREUM_PRIVATE_KEY=
2+
VITE_LIT_CAPACITY_CREDIT_TOKEN_ID=
3+
VITE_LIT_NETWORK=

‎siws-authentication/browser/.eslintrc.cjs‎

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
module.exports = {
2+
root: true,
3+
env: { browser: true, es2020: true },
4+
extends: [
5+
"eslint:recommended",
6+
"plugin:@typescript-eslint/recommended",
7+
"plugin:react-hooks/recommended",
8+
],
9+
ignorePatterns: ["dist", ".eslintrc.cjs"],
10+
parser: "@typescript-eslint/parser",
11+
plugins: ["react-refresh"],
12+
rules: {
13+
"react-refresh/only-export-components": [
14+
"warn",
15+
{ allowConstantExport: true },
16+
],
17+
},
18+
};

‎siws-authentication/browser/.gitignore‎

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
# Logs
2+
logs
3+
*.log
4+
npm-debug.log*
5+
yarn-debug.log*
6+
yarn-error.log*
7+
pnpm-debug.log*
8+
lerna-debug.log*
9+
10+
node_modules
11+
dist
12+
dist-ssr
13+
*.local
14+
15+
# Editor directories and files
16+
.vscode/*
17+
!.vscode/extensions.json
18+
.idea
19+
.DS_Store
20+
*.suo
21+
*.ntvs*
22+
*.njsproj
23+
*.sln
24+
*.sw?

‎siws-authentication/browser/README.md‎

Lines changed: 56 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,56 @@
1+
# Sign-in With Solana Authentication
2+
3+
This code example demonstrates how to authenticate a Sign-in With Solana (SIWS) message using a Lit Action and Phantom's [SIWS specification](https://github.com/phantom/sign-in-with-solana/tree/main?tab=readme-ov-file). With this functionality, you can enforce that only specific Solana public keys (aka. addresses) are able to perform certain actions like decrypting data encrypted using Lit, signing transactions using a specific PKP and more.
4+
5+
This code example has a [corresponding doc page](https://developer.litprotocol.com/sdk/authentication/authenticating-siws) that covers the implementation in more detail, this repository acts as a reference implementation for you to use as a guide for authenticating SIWS messages in your project.
6+
7+
## Prerequisites
8+
9+
- An Ethereum private key
10+
- This private key will be used to:
11+
- Mint a Lit Capacity Credit if none was specific in the project's `.env` file
12+
- In order to pay for this, the corresponding Ethereum account must have Lit Test Tokens. If you do not have any, you can get some from [the faucet](https://chronicle-yellowstone-faucet.getlit.dev/)
13+
- Create a Lit Capacity Credit delegation Auth Sig
14+
- This code example uses Node.js and Yarn, please have these installed before running the example
15+
- The code example also expects the [Phantom wallet browser extension](https://chromewebstore.google.com/detail/phantom/bfnaelmomeimhlpmgjnjophhpkkoljpa?hl=en) to be installed and setup with a Solana wallet
16+
17+
## Installation and Setup
18+
19+
1. Clone the repository
20+
2. `cd` into the code example directory: `cd siws-session-sigs/browser`
21+
3. Install the dependencies: `yarn`
22+
4. Create and fill in the `.env` file: `cp .env.example .env`
23+
- `VITE_ETHEREUM_PRIVATE_KEY`: **Required** This is the Ethereum private key that will be used to mint a Lit Capacity Credit and create Lit Session Signatures
24+
- `VITE_LIT_CAPACITY_CREDIT_TOKEN_ID`: **Optional** This is the ID of the Lit Capacity Credit to use for the PKP delegation Auth Sig
25+
- `VITE_LIT_NETWORK`: **Optional** This is the Lit Network to use for the Lit Contracts and Lit Node Clients
26+
5. Build the Lit Action file: `yarn build:lit-action`
27+
6. Start the development server: `yarn dev`
28+
29+
## Executing the Example
30+
31+
1. Open the app in your browser: http://localhost:5173
32+
2. Open the JavaScript browser console
33+
3. Click the `Select Wallet` button and connect your Phantom wallet
34+
4. Click the `Sign In` button to sign the SIWS message
35+
36+
The following diagram provides an overview of how this code example works:
37+
38+
![Code Example Overview](./src/assets/siws-authentication.png)
39+
40+
### Expected Output
41+
42+
After clicking the `Sign In` button, the code example will submit your signed SIWS message to the Lit network to be authenticated using a Lit Action and will return the authenticated Solana public key.
43+
44+
After successful execution, you should see `✅ Authenticated SIWS message` in the JavaScript console and the authenticated Solana public key on the web page:
45+
46+
![Successful execution](./src/assets/successful-execution.png)
47+
48+
## Specific Files to Reference
49+
50+
- [App.tsx](./src/App.tsx): Contains the frontend code and logic for the example
51+
- [SignInButton.tsx](./src/SignInButton.tsx): Contains the code for the `Sign In` button that creates and submits the SIWS message to the browser wallet extension
52+
- [litSiws.ts](./src/litSiws.ts): Contains the code for:
53+
- Minting a Capacity Credit if none was specified in the `.env` file
54+
- Generating the Capacity Credit delegation Auth Sig
55+
- Executing the Lit Action to authenticate the SIWS message
56+
- [litActionSiwsAuth.ts](./src/litActionSiwsAuth.ts): Contains the Lit Action code that authenticates the SIWS message

‎siws-authentication/browser/deno.jsonc‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
{
2+
"tasks": {
3+
"bundle": "deno run --allow-read --allow-write --allow-env --allow-net --allow-run esbuild.js"
4+
}
5+
}

‎siws-authentication/browser/deno.lock‎

Lines changed: 85 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎siws-authentication/browser/esbuild-shims.js‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
globalThis.process = {
2+
env: {},
3+
};

‎siws-authentication/browser/esbuild.js‎

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
import * as esbuild from "https://deno.land/x/[email protected]/mod.js";
2+
import { denoPlugins } from "jsr:@luca/esbuild-deno-loader@^0.10.3";
3+
4+
esbuild.build({
5+
plugins: [...denoPlugins()],
6+
entryPoints: ["src/litActionSiwsAuth.ts"],
7+
outdir: "src/dist/",
8+
bundle: true,
9+
platform: "browser",
10+
format: "esm",
11+
target: "esnext",
12+
minify: false,
13+
inject: ["./esbuild-shims.js"],
14+
});
15+
await esbuild.stop();

‎siws-authentication/browser/index.html‎

Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8" />
5+
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
6+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
7+
<title>Vite + React + TS</title>
8+
<style>
9+
body,
10+
html {
11+
margin: 0;
12+
height: 100%;
13+
display: flex;
14+
justify-content: center;
15+
align-items: center;
16+
}
17+
#root {
18+
width: 100%;
19+
text-align: center;
20+
}
21+
</style>
22+
</head>
23+
<body>
24+
<div id="root"></div>
25+
<script type="module" src="/src/main.tsx"></script>
26+
</body>
27+
</html>

‎siws-authentication/browser/package.json‎

Lines changed: 50 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,50 @@
1+
{
2+
"name": "siws-authentication",
3+
"private": true,
4+
"version": "0.0.0",
5+
"type": "module",
6+
"scripts": {
7+
"dev": "vite",
8+
"build": "tsc -b && vite build",
9+
"build:lit-action": "deno task bundle",
10+
"lint": "eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0",
11+
"preview": "vite preview"
12+
},
13+
"dependencies": {
14+
"@esbuild-plugins/node-globals-polyfill": "^0.2.3",
15+
"@esbuild-plugins/node-modules-polyfill": "^0.2.2",
16+
"@lit-protocol/auth-browser": "^6.7.0",
17+
"@lit-protocol/auth-helpers": "^6.5.3",
18+
"@lit-protocol/constants": "^6.5.3",
19+
"@lit-protocol/contracts-sdk": "^6.8.1",
20+
"@lit-protocol/lit-node-client": "^6.5.3",
21+
"@simplewebauthn/browser": "^10.0.0",
22+
"@solana/wallet-adapter-base": "^0.9.23",
23+
"@solana/wallet-adapter-react": "^0.15.35",
24+
"@solana/wallet-adapter-react-ui": "^0.9.35",
25+
"@solana/wallet-adapter-wallets": "^0.19.32",
26+
"@solana/wallet-standard-features": "^1.2.0",
27+
"@solana/wallet-standard-util": "^1.1.1",
28+
"@solana/web3.js": "^1.95.3",
29+
"@vitejs/plugin-react-swc": "^3.7.0",
30+
"ethers": "v5",
31+
"ipfs-only-hash": "^4.0.0",
32+
"react": "^18.3.1",
33+
"react-dom": "^18.3.1",
34+
"rollup-plugin-polyfill-node": "^0.13.0",
35+
"vite-plugin-node-polyfills": "^0.22.0"
36+
},
37+
"devDependencies": {
38+
"@lit-protocol/types": "^6.6.0",
39+
"@types/react": "^18.3.3",
40+
"@types/react-dom": "^18.3.0",
41+
"@typescript-eslint/eslint-plugin": "^7.13.1",
42+
"@typescript-eslint/parser": "^7.13.1",
43+
"@vitejs/plugin-react": "^4.3.1",
44+
"eslint": "^8.57.0",
45+
"eslint-plugin-react-hooks": "^4.6.2",
46+
"eslint-plugin-react-refresh": "^0.4.7",
47+
"typescript": "^5.5.3",
48+
"vite": "^5.3.1"
49+
}
50+
}

0 commit comments

Comments
 (0)