How does user login to specific identity?

Hi folks! New comer here, just start learning to build dfinity app! I need some help regarding user identity.

For the record, I’m using the dfx (v0.7.0-beta4) cli tool. And I’ve read the access control tutorial.

So, I know I can create identity with dfx identity new bob. This will generate a .pem file in ~/.config/dfx/identity/bob/identity.pem. And I have no problem calling canister with specific identity from command line, it’s in the tutorial.

My question is, how do I do the same from a web frontend interface? I had a hard time finding useful info on this topic.

After some digging I learn that the frontend served from an asset canister, built with default setup, include the @dfinity/agent lib, and it will generate an Anonymous identity (using ED25519 I guess)?

How does the .pem file relate to the ED25519 key pair generated in browser? Can I import this .pem secretKey to be used in browser (convert it into a Ed25519KeyIdentity) , or vice versa?

Somebody unstuck me please! Thanks in advance.

4 Likes

How does the .pem file relate to the ED25519 key pair generated in browser?

I think the correct answer is: Not at all.

The identity management in the browser is undergoing some important and presumably innovative changes, but I am not sure how much I should spoil. Expect some interesting demos at next week’s event!

6 Likes

Hi, where can I find info about setting up a ED25519 key pair in my browser? thank u

I have an example of generating new identity and cache it in the browser: reversi/index.js at master · ninegua/reversi · GitHub

Note that this has nothing to do with the Internet Identity service on IC.

2 Likes

Wow thank you so much!

I’m a huge noob so forgive me for asking:
What language is this? (is it motoko?)
When try importing, my terminal doesn’t recognize the code. I assume I need to install some package before I can enter this?

Lastly, to me it seems the following code is the meat of creating the key. Should I also focus on the code that comes after as well?

Thank you again for your help!

import { Ed25519KeyIdentity } from "@dfinity/authentication";
import { Actor, HttpAgent } from "@dfinity/agent";
import {
  idlFactory as reversi_idl,
  canisterId as reversi_id
} from "dfx-generated/reversi";
import {
  idlFactory as reversi_assets_idl,
  canisterId as reversi_assets_id
} from "dfx-generated/reversi_assets";

function newIdentity() {
  const entropy = crypto.getRandomValues(new Uint8Array(32));
  const identity = Ed25519KeyIdentity.generate(entropy);
  localStorage.setItem("reversi_id", JSON.stringify(identity));
  return identity;
}

function readIdentity() {
  const stored = localStorage.getItem("reversi_id");
  if (!stored) {
    return newIdentity();
  }
  try {
    return Ed25519KeyIdentity.fromJSON(stored);
  } catch (error) {
    console.log(error);
    return newIdentity();
  }
}

It is frontend javascript

1 Like

If you have followed the hello world tutorial, you have created a hello repository, and there is javascript file in src/hello_assets/src/index.js. You can modify it to use your own frontend code.

1 Like

Thank you so much! Appreciate all the help! :relaxed:

1 Like