# How to get the Internet Identity ID dynamically?

**URL:** <https://forum.dfinity.org/t/how-to-get-the-internet-identity-id-dynamically/17649>\
**Category:** Developers\
**Tags:** Functional-Programming, Discussing\
**Created:** [December 26, 2022, 6:35am UTC](https://forum.dfinity.org/t/how-to-get-the-internet-identity-id-dynamically/17649 "2022-12-26T06:35:54Z")\
**Posts on this page:** 13\
**Page:** 1

<div class="post-metadata">

**Author:** ![rncrmn](https://avatars.discourse-cdn.com/v4/letter/r/e480ec/32.png) [@rncrmn](https://forum.dfinity.org/u/rncrmn)\
**Post date:** [December 26, 2022, 6:35am UTC](https://forum.dfinity.org/t/how-to-get-the-internet-identity-id-dynamically/17649/1 "2022-12-26T06:35:54Z")

</div>

Hello Everyone,

Is there a way to get the Internet Identity ID dynamically in the webpack.config.js?

Below is my current code.

```auto
new webpack.EnvironmentPlugin({
      NODE_ENV: "development",
      II_URL: isDevelopment
        ? "http://localhost:4943/?canisterId=" +
          process.env.INTERNET_IDENTITY_CANISTER_ID +
          "#authorize"
        : "https://identity.ic0.app/#authorize",
      ...canisterEnvVariables,
    }),

```

The “process.env.INTERNET\_IDENTITY\_CANISTER\_ID” seems not to work, it gives me undefined output in URL.

![image](https://us1.discourse-cdn.com/flex023/uploads/dfn/original/2X/2/29a2b746b40ce119196571aa7cf49840537893a4.png)

Thank you.

---

<div class="post-metadata">

**Author:** ![mystical](https://avatars.discourse-cdn.com/v4/letter/m/3ec8ea/32.png) [@mystical](https://forum.dfinity.org/u/mystical)\
**Post date:** [December 27, 2022, 10:31am UTC](https://forum.dfinity.org/t/how-to-get-the-internet-identity-id-dynamically/17649/2 "2022-12-27T10:31:39Z")

</div>

> [@rncrmn](#):
>
> The “process.env.INTERNET\_IDENTITY\_CANISTER\_ID” seems not to work, it gives me undefined output in URL.

You can use ChatGPT for these types of questions, and also drill down into details after it answers your initial one, for example ask it for alternative solutions and so on 🙂 .  
Below its answer to your question:

In order to get the `INTERNET_IDENTITY_CANISTER_ID` dynamically in your `webpack.config.js` file, you can try using the `dotenv` library to load environment variables from a `.env` file.

To use the `dotenv` library, you will first need to install it as a dependency:

Copy code

```auto
npm install dotenv

```

Then, create a `.env` file in the root of your project and add the `INTERNET_IDENTITY_CANISTER_ID` variable to it:

Copy code

```auto
INTERNET_IDENTITY_CANISTER_ID=your_internet_identity_canister_id

```

Next, you can use the `dotenv` library to load the variables from the `.env` file into your Node.js application’s environment by requiring it at the top of your `webpack.config.js` file:

Copy code

```auto
require('dotenv').config();

```

This will allow you to access the `INTERNET_IDENTITY_CANISTER_ID` variable using `process.env.INTERNET_IDENTITY_CANISTER_ID`.

Your `webpack.config.js` file should then look something like this:

Copy code

```auto
const webpack = require('webpack');

require('dotenv').config();

module.exports = {
  // your webpack config here
  plugins: [
    new webpack.EnvironmentPlugin({
      NODE_ENV: "development",
      II_URL: isDevelopment
        ? "http://localhost:4943/?canisterId=" + process.env.INTERNET_IDENTITY_CANISTER_ID + "#authorize"
        : "https://identity.ic0.app/#authorize",
      ...canisterEnvVariables,
    })
  ]
};

```

This should allow you to access the `INTERNET_IDENTITY_CANISTER_ID` variable dynamically in your `webpack.config.js` file.

---

<div class="post-metadata">

**Author:** ![mystical](https://avatars.discourse-cdn.com/v4/letter/m/3ec8ea/32.png) [@mystical](https://forum.dfinity.org/u/mystical)\
**Post date:** [December 27, 2022, 10:36am UTC](https://forum.dfinity.org/t/how-to-get-the-internet-identity-id-dynamically/17649/3 "2022-12-27T10:36:33Z")

</div>

but if you’re doing it in browser and node on server side, you must build your code with all variables rendered into plain text, you can’t query environment variable in the browser because there’s no server-side “process environment” to read this from. So all you can do is make sure to build the distribution of your app with all values included in their correct locations. During CI/CD process people usually bake-in those values, and then in gets deployed to relevant environments (for example in a multi-tenant company where apps get deployed for each enterprise customer separately, all required unique values are written into minified builds during build time). I hope it helps 🙂

---

<div class="post-metadata">

**Author:** ![rncrmn](https://avatars.discourse-cdn.com/v4/letter/r/e480ec/32.png) [@rncrmn](https://forum.dfinity.org/u/rncrmn)\
**Post date:** [January 1, 2023, 9:00am UTC](https://forum.dfinity.org/t/how-to-get-the-internet-identity-id-dynamically/17649/4 "2023-01-01T09:00:52Z")

</div>

Hi @mystical sorry for the late response, I was out of town and just got back.

About the “process.env.INTERNET\_IDENTITY\_CANISTER\_ID” I got it from the local internet\_idenity itself (see screenshot below).

 ![image](https://us1.discourse-cdn.com/flex023/uploads/dfn/original/2X/2/203a6b6ea9f2bb769cde0858a4e4ac46502409fa.png)

I was hoping if I was able to get the II canister ID from that and use it to webpack to set the ID dynamically instead of typing it.

Just in case the II canister ID was changed, I don’t need to worry since it was set dynamically, not sure thought if that is possible.

Cheers…

---

<div class="post-metadata">

**Author:** ![mystical](https://avatars.discourse-cdn.com/v4/letter/m/3ec8ea/32.png) [@mystical](https://forum.dfinity.org/u/mystical)\
**Post date:** [January 2, 2023, 11:32am UTC](https://forum.dfinity.org/t/how-to-get-the-internet-identity-id-dynamically/17649/5 "2023-01-02T11:32:37Z")

</div>

hmm, it’ll need to pull it from some backend then, because you’re working here with a client side code as I understand, the client would never know if something like canister is changing because it’s on remote servers/nodes. But I’m not a developer in ICP so maybe someone with real knowledge will have advice. I just chimed in with my idea of asking the AI for things that are generic (it sometimes comes up with good information actually 😄 I really enjoy using it, can’t wait for GPT-4 public release).

---

<div class="post-metadata">

**Author:** ![mystical](https://avatars.discourse-cdn.com/v4/letter/m/3ec8ea/32.png) [@mystical](https://forum.dfinity.org/u/mystical)\
**Post date:** [January 2, 2023, 11:40am UTC](https://forum.dfinity.org/t/how-to-get-the-internet-identity-id-dynamically/17649/6 "2023-01-02T11:40:13Z")

</div>

how it’s done in classic microservice architectures where the addresses of servers that the app should connect to, are unknown or can change any time (mobile game let’s say, or a vpn), is that there’s one “central” service that never changes, and its only job is to “know” what other server addresses exist and operational at this specific moment. So all clients will always first as this “indexer” backend which indexes all other servers and knows everything about them (to which countries to serve it, which client profiles, geo locations, etc’) so it’ll respond with current IP or DNS record of the backend that “can serve, current client needs” (when there are many possible backends to connect to). In your case it’ll be a canister that never-ever changes its ID/address whatever it is, that helps clients to locate it. And this simple canister, will be the location where you always put the correct “new address” of the “real workload canister”, so no matter how frequently you change it, client side code will always pull the correct ID of whatever backend you want them all to point at.  
I hope it helps 🙂 it’s architecture related, not ICP specific (cos I know nothing about ICP coding 😅 but the concept should work anywhere).

---

<div class="post-metadata">

**Author:** ![rncrmn](https://avatars.discourse-cdn.com/v4/letter/r/e480ec/32.png) [@rncrmn](https://forum.dfinity.org/u/rncrmn)\
**Post date:** [January 3, 2023, 2:09pm UTC](https://forum.dfinity.org/t/how-to-get-the-internet-identity-id-dynamically/17649/7 "2023-01-03T14:09:01Z")

</div>

@mystical no worries 😂 I heard of it weeks ago and people are enjoying it.

---

<div class="post-metadata">

**Author:** ![rncrmn](https://avatars.discourse-cdn.com/v4/letter/r/e480ec/32.png) [@rncrmn](https://forum.dfinity.org/u/rncrmn)\
**Post date:** [January 3, 2023, 2:10pm UTC](https://forum.dfinity.org/t/how-to-get-the-internet-identity-id-dynamically/17649/8 "2023-01-03T14:10:32Z")

</div>

Hi @peterparker how are you? I don’t want to mention you here maybe you’re having vacation at the moment and I don’t want to disturb you 😅

---

<div class="post-metadata">

**Author:** ![peterparker](https://avatars.discourse-cdn.com/v4/letter/p/b9bd4f/32.png) [@peterparker](https://forum.dfinity.org/u/peterparker)\
**Post date:** [January 3, 2023, 3:01pm UTC](https://forum.dfinity.org/t/how-to-get-the-internet-identity-id-dynamically/17649/9 "2023-01-03T15:01:57Z")

</div>

Fine and you? I just took few days and those were spent mostly developing my new side project (which is way too big I slowly realize).

Is your project open source? Can I clone it?

It will be easier to reproduce and debug.

---

<div class="post-metadata">

**Author:** ![rncrmn](https://avatars.discourse-cdn.com/v4/letter/r/e480ec/32.png) [@rncrmn](https://forum.dfinity.org/u/rncrmn)\
**Post date:** [January 4, 2023, 12:26am UTC](https://forum.dfinity.org/t/how-to-get-the-internet-identity-id-dynamically/17649/10 "2023-01-04T00:26:41Z")

</div>

Hi @peterparker

Yes I push it on GitHub, you can see it on the link below 😄

> **[GitHub - rncrmn/auth-client](https://github.com/rncrmn/auth-client)**
>
> Contribute to rncrmn/auth-client development by creating an account on GitHub.

In the webpack file, I hard coded the local II Canister ID since the “process.env.INTERNET\_IDENTITY\_CANISTER\_ID” won’t work for me at the moment 😅

Cheers…

---

<div class="post-metadata">

**Author:** ![peterparker](https://avatars.discourse-cdn.com/v4/letter/p/b9bd4f/32.png) [@peterparker](https://forum.dfinity.org/u/peterparker)\
**Post date:** [January 4, 2023, 6:33am UTC](https://forum.dfinity.org/t/how-to-get-the-internet-identity-id-dynamically/17649/11 "2023-01-04T06:33:40Z")

</div>

Thanks for the repo. Following worked out for me with your project:

1. remove the hard coded II canister ID in `webpack.config.js`

```auto
new webpack.EnvironmentPlugin({
      NODE_ENV: "development",
      ...canisterEnvVariables,
    }),

```

1. use `process.env.INTERNET_IDENTITY_CANISTER_ID` for the auth-client

```auto
await authClient?.login({
        onSuccess: async () => {
          initActor(authClient);
          navigate("/");
        },
        // 7 days in nanoseconds
        maxTimeToLive: BigInt(7 * 24 * 60 * 60 * 1000 * 1000 * 1000),
        ...(process.env.NODE_ENV === 'development' && {identityProvider: `http://localhost:4943/?canisterId=${process.env.INTERNET_IDENTITY_CANISTER_ID}#authorize`})
      });

```

1. `dfx start` + `dfx deploy` + `npm run start`
2. test on the browser on `http://localhost:8080/`

Hope that helps.

---

<div class="post-metadata">

**Author:** ![rncrmn](https://avatars.discourse-cdn.com/v4/letter/r/e480ec/32.png) [@rncrmn](https://forum.dfinity.org/u/rncrmn)\
**Post date:** [January 4, 2023, 6:42am UTC](https://forum.dfinity.org/t/how-to-get-the-internet-identity-id-dynamically/17649/12 "2023-01-04T06:42:42Z")

</div>

Hi @peterparker I followed the instructions above and it works perfectly 💯

Thank you so much for your time, I know you’re a very busy person (especially this year because of your special project) but you still give your time to answer our questions, we appreciate that.

Thank you once again ❤

---

<div class="post-metadata">

**Author:** ![peterparker](https://avatars.discourse-cdn.com/v4/letter/p/b9bd4f/32.png) [@peterparker](https://forum.dfinity.org/u/peterparker)\
**Post date:** [January 4, 2023, 6:58am UTC](https://forum.dfinity.org/t/how-to-get-the-internet-identity-id-dynamically/17649/13 "2023-01-04T06:58:38Z")

</div>

Glad to hear it worked out 🥳

No worries, we are all super busy building super stuffs. Happy to help!

I liked the UI of your dapp,nice and clean. Keep going 💪