Announcing ic-siwe: Use Ethereum wallets to login to IC

Showcase
21

I figured it out, i needed to trigger the login like this after the eth wallet authentictation
(note that i created aliasses for isConnected and identity)

useEffect(() => {
	if (isWagmiConnected && prepareLoginStatus === 'success' && !siweIdentity) {
		login();
	}
}, [isWagmiConnected, prepareLoginStatus]);

Now i only get the following error

Body: Failed to authenticate request 0xe8e61072aef5a719597f716ac0d01b7537d5263a58133cb8b73c77b01fb64a13 due to: Canister SOME_CANISTER_ID is not one of the delegation targets

how do i set these delegation targets?

1 Like
22

Oh it’s on the init on the backend, posted the above question a bit to fast :sweat_smile:

23

Great to hear! All good then?

The SIWE provider canister needs to be configured with info about for which canisters the delegate identity is valid.

From the Makefile:

deploy-provider:
	dfx deploy ic_siwe_provider --argument "( \
	    record { \
	        domain = \"127.0.0.1\"; \
	        uri = \"http://127.0.0.1:5173\"; \
	        salt = \"salt\"; \
	        chain_id = opt 1; \
	        scheme = opt \"http\"; \
	        statement = opt \"Login to the SIWE/IC demo app\"; \
	        sign_in_expires_in = opt 300000000000; /* 5 minutes */ \
	        session_expires_in = opt 604800000000000; /* 1 week */ \
	        targets = opt vec { \
	            \"$$(dfx canister id ic_siwe_provider)\"; \
	            \"$$(dfx canister id backend)\"; \
	        }; \
	    } \
	)"

targets can also be an empty vec, in that case identity is valid for any canister.

1 Like
24

For the login part everything is good, now i only need to find i a nice way to make it work with our existing setup, but i’m sure i can make it work.

The empty targets is a nice one to keep in mind!

Appreciate the help

1 Like
25

Yes, you need to trigger the signature request from the frontend domain listed in the SIWE message. Otherwise warning. Not all wallets do this unfortunately so there still remains a phishing risk with SIWE login in combination with wallets that do not fully support the SIWE protocol.

1 Like
26

Why do you need a salt to build the ic-siwe-provider?

27

The salt is used during the creation of user seeds, together with the ethereum address of calling user and (possibly) the frontend url. Internet Identity uses it the same way.

1 Like
28

Is there anything additional that you have to do to be able to make authenticated calls?

I implemented an app similar to the ic-siwe-react-demo-ts except for using ic-use-actor. I do receive a delegated identity when calling the hooks provided in the ic-use-siwe-identity package:

const { identity } = useSiweIdentity();

However, when I run ic.caller() in the backend, I still get returned an anonymous principal.

1 Like
29

If you are not using ic-use-actor then you need to create an authenticated actor yourself. Have you done that?

From the ic-use-actor code:

const agent = new HttpAgent({ identity, ...httpAgentOptions });

if (process.env.DFX_NETWORK !== "ic") {
  agent.fetchRootKey().catch((err) => {
    console.warn(
      "Unable to fetch root key. Check to ensure that your local replica is running"
    );
    console.error(err);
  });
}

const actor = Actor.createActor<typeof context>(idlFactory, {
  agent,
  canisterId,
  ...actorOptions,
});
1 Like
30

When I put the line const { isConnected } = useAccount(); in my app i just got planck page can’t even see an error in my console log

31

To be honest now I start hating ICP for this
every time I want to implement something it is just a huge pain in the ass
I worked with more complex things but this

  • No docs
  • Not much examples
  • and when I do exactly like the available example still getting more errors

ic-use-siwe-identity.js?v=23e6d2d1:254 Uncaught (in promise) Error: No Ethereum address available. Call login after the user has connected their wallet.
at loginWithMetaMask (BackendContext.tsx:149:23)
at handleMetaMaskLogin (loginButton.tsx:72:11)

login status always "idle"

32

Can I see your login button code snippet

33

Error message explains quite clearly what is the issue here. You need to connect an Ethereum wallet before initiating the login.

:backhand_index_pointing_up:This is not the best way to get help. IC-SIWE is a community developed project, not a project actively supported by Dfinity.

2 Likes
34

How to “connect an Ethereum wallet before initiating the login.”?

35
36

I think you mean

const { identity: siweIdentity, login: MetaMaskLogin, loginStatus: prepareLoginStatus } = useSiweIdentity();
const agent = new HttpAgent({
    identity:siweIdentity,
    host,
  });
37

Errors are gone after using the rainbow way, but Still getting more issues
it is asking to Sign Messages
const { openConnectModal } = useConnectModal();

Screenshot 2025-04-14 at 10.06.47 AM
Screenshot 2025-04-14 at 10.06.47 AM1458×1408 156 KB

Screenshot 2025-04-14 at 10.07.53 AM
Screenshot 2025-04-14 at 10.07.53 AM702×448 55.4 KB

40

You would have to use dfx deploy frontend --ic when deploying to IC. When running locally, omitting it is ok, running instead using yarn like you describe.

This thread is moving very far away from its original topic. Please start a new thread focused on your particular issues.