signWithRedirect
Redirect to JoyID app to sign a message, this function needs to work with signCallback
to complete the signing.
Types
function signWithRedirect (request: SignRequest): void
interface SignRequest {
/**
* The URL of your app that JoyID app should redirect to after authentication
*/
redirectURL: string
/**
* name of your app
*/
name?: string
/**
* logo of your app
*/
logo?: string
/**
* The challenge that was requested to be signed
*/
challenge: string
/**
* sign the challenge as a hex data
*/
isData?: boolean
/**
* Custom state that will be returned to your app after signing
*/
state?: any
}
Example
In order to redirect to JoyID app to sign message, We can start by declaring a sign component, which specify redirectURL
to /sign
path of the app.
import { signWithRedirect } from '@joyid/core'
const MyLoginComponent = () => {
function onClick() {
const request = {
// redirect to /sign
redirectURL: 'https://example.com/sign',
title: 'Example App',
logo: 'https://example.com/logo.png',
challenge: 'Sign this message',
}
signWithRedirect(request)
}
return (
<button onClick={onClick}>
Sign with JoyID
</button>
)
}
When the component with the /login
path loads, we can call signCallback
to get the redirected data from the JoyID App.
import { useEffect } from 'react'
import { signCallback } from '@joyid/core'
/* `/sign` page component */
const SignPageComponent = () => {
const isRedirectFromJoyID = new URL(location.href).searchParams.has('joyid-redirect')
useEffect(() => {
if (isRedirectFromJoyID) {
const res = signCallback()
if (res.error != null) {
console.error(res.error)
} else {
// the user has authenticated,
// do something with res.data, it's type safe!
}
}
}, [])
return <MySignPageComponent />
}
Details
- See also: API - signCallback
- See also: Guide - Sign with Redirect with a live demo