IDKit

IDKit

The IDKit Javascript widget is the simplest way to start using World ID. The JS package currently supports web applications and requires only a few lines of code.

Check out the JS Reference for full details on how to configure and use IDKit.

Installation

The JS package can be included in your project either as a module (which supports tree shaking to reduce bundle size) or you can add the script directly to your website.

npm install @worldcoin/idkit

Usage in React apps

If your app is built on React, using the React widget is by far the easiest approach.

import { IDKitWidget } from '@worldcoin/idkit'

return (
	<IDKitWidget
		app_id="app_BPZsRJANxct2cZxVRyh80SFG" // obtain this from developer.worldcoin.org
		action="my_action"
		enableTelemetry
		onSuccess={result => console.log(result)} // pass the proof to the API or your smart contract
	/>
)

Usage in Next.js apps

If your app is built on Next.js, you should use the React widget, but it's critical to disable SSR.

const IDKitWidget = dynamic(() => import('@worldcoin/idkit').then(mod => mod.IDKitWidget), { ssr: false })

return (
	<IDKitWidget
		action="my_signal"
		onSuccess={result => console.log(result)}
		app_id="app_BPZsRJANxct2cZxVRyh80SFG" // obtain this from developer.worldcoin.org
	/>
)

Usage in vanilla JS apps

1. Add a div to mount World ID, and later initialize. You'll want to do this on the screen where the user executes the protected action (e.g. before they click "Claim airdrop" or "Create account").

   <div id="idkit-container"></div>
   

   CopyCopied!

1. Initialize the widget.

   import * as idkit from '@worldcoin/idkit' // If you installed the JS package as a module
   
   idkit.init('idkit-container', {
   	enable_telemetry: true,
   	app_id: 'app_BPZsRJANxct2cZxVRyh80SFG', // obtain this from developer.worldcoin.org
   	action: 'your_signal',
   	onSuccess: result => console.log(result),
   })
   
   document.getElementById('trigger-button').addEventListener('click', () => {
   	idkit.open()
   })
   

   CopyCopied!