nav[aria-label="Primary Navigation"] { padding: 0; & ul { list-style: none; width: 100%; display: flex; flex-direction: row; justify-content: start; align-items: start; gap: 30px; padding: 0; & li { margin: 0; } & ul li { list-style: none; } } }

Retrieve the username of the person connected on the Experience Builder Application

JasonBOCQUET

Hello community,

I am currently building an ArcGIS Experience Builder application and I would like to be able to add a header where the person viewing the application with a connected ArcGIS account can see a message like "Hello, Franck". But I don't know how to get the user's first name or nickname and how to integrate it into a Text widget or elsewhere.

Can you help me ?

Have a nice day.

Trouver plus de publications taguées avec

ArcGIS Enterprise

Accepted answers

JeffreyThompson2

This is not possible in the Online/Enterprise versions. In Developer Edition, this information can be accessed in the props.user object in any custom widget.

JeffreyThompson2

https://community.esri.com/t5/experience-builder-custom-widgets/security-widget/m-p/1344363

I decided to share a custom widget that includes a line that displays the user's username.

JeffreyThompson2

It might be as simple as adding a question mark to this line.

<div className='center'>
{props.user?.firstName &&
	 <span><p>Bonjour {props.user.firstName}</p></span>
	 }
	</div>

You could also try a teriary.

<div className='center'>
{props.user ? 
	 <span><p>Bonjour {props.user.firstName}</p></span> : <></>
	 }
	</div>

The next thing to try after that is to use your useEffect statement to put the username into state.

All comments

JeffreyThompson2

This is not possible in the Online/Enterprise versions. In Developer Edition, this information can be accessed in the props.user object in any custom widget.

JasonBOCQUET

Hello @JeffreyThompson2

Thanks for your reply !

Can I develop a custom widget in Developer Edition and add this widget in my application easily ? I mean i just have to write a code and import this code or it's more difficult ?

JeffreyThompson2

Once you have created a custom widget in Developer Edition, you can drop it into an Experience the same way as any other widget. Depending on your set-up, deployment may be your biggest challenge. If you use Developer Edition, you will be responsible for hosting your final application to a webserver. https://developers.arcgis.com/experience-builder/guide/deployment-topics/

I am not 100% certain you can edit an Experience in Developer Edition that has already been created in Enterprise/Online, but I think it should be possible. Worst case: You might have to rebuild all of your pre-existing work.

JasonBOCQUET

Hello !

Can I create a little script for this widget (which be simple to write) without using the developer edition ?

I mean, i can't host the application on a webserver because i have not the right. I only want to import a little script to have a custom widget.

Thanks.

JeffreyThompson2

There is no way to simply add a few lines of code to Experience Builder without Developer Edition. If you are using a version of ArcGIS Enterprise 11.X, it is possible to connect a custom widget to your portal, but you will still need to host the custom widget on the web somewhere. https://www.esri.com/arcgis-blog/products/arcgis-enterprise/developers/add-experience-builder-custom-widgets-in-arcgis-enterprise/

This example hosts the widget on Github Pages which is a simple, free hosting platform for very basic applications.

JasonBOCQUET

Oh ! it's gonna be good for me ! Nice !

So if I want to write a javascript for a custom widget to retrieve the username, i have only to use the props.user objects or it's more complicated ? I'm not friendly with javascript.

JeffreyThompson2

https://developers.arcgis.com/experience-builder/guide/install-guide/

https://developers.arcgis.com/experience-builder/guide/create-a-starter-widget/

https://docs.github.com/en/get-started/quickstart/set-up-git

Before getting started read over the installation and starter widget guides. You should also look at the GitHub guides if you are going to host there. There is a steep learning curve in the setup process if you are not familiar with programming.

JasonBOCQUET

Hey again here,

I'm trying to develop the widget to retrieve the username of the person connected on my application.

I'm very begginer on development and I don't understand how to use the props.user object. There is any documentation to understand how to use this object ?

JeffreyThompson2

I'm guessing you don't have any React experience. That's going to make jumping into Experience Builder tough. Start learning React before getting into Experience Builder and you should understand where to find the props.

https://community.esri.com/t5/experience-builder-custom-widgets/what-is-the-best-place-to-start-learning-react/m-p/1343921#M122

JeffreyThompson2

https://community.esri.com/t5/experience-builder-custom-widgets/security-widget/m-p/1344363

I decided to share a custom widget that includes a line that displays the user's username.

JasonBOCQUET

Thanks for your link; i'm gonna start to learn all of this !

JasonBOCQUET

Oh thanks ! It was easy to implemet in fact. I have to import the correct library and to use {props.user.fullName} tag.

It's time to learn to do more insane widget ! thank

JasonBOCQUET

Hi @JeffreyThompson2 i used a part of your code to retrieve the username and it works partially.

Actually here is my code :

import { React, AllWidgetProps } from 'jimu-core'
import './widget.css'

const { useState, useEffect } = React

const Widget = (props: AllWidgetProps<any>) => {
console.log(props.user)
React.useEffect(() => {
console.log('props.user in useEffect', props.user)
}, [props.user])


  return (
<div className='container'>  
<div className='center'>
{props.user.firstName &&
	 <span><p>Bonjour {props.user.firstName}</p></span>
	 }
	</div>
	</div>
  )
}

export default Widget

the problem that I have is the following : we use a SSO connexion system and when the users going on our application the widget cannot identity the user (logic because he's not connected)

So the user have the login popup, he click on OK and he have the access to the application. BUT the widget doesn't be actualized so it stay with the error message "Cannot read property..."

How can I modify the code to have an actualization/a check to replace the error code by the username once the user is connected.

I have already test some of Hook function like "useEffect" to solve the problem; but because the login windows is a pop-up windows, I think it doesn't trigger an action on the application windows (and it's the reason that explaining why the "cannot read property" do not be actualised).

thanks 🙂

Marc_Graham

Just as an update for anyone looking for this post 2025: you can do this with smart forms and Arcade.

https://developers.arcgis.com/arcade/function-reference/portal_functions/

CW-GIS

In regards to retrieving a username from Experience Builder. Do you know if that is possible to use with normal widgets?

For Example:

If I have a hosted table with usernames and cities. Then I had a list, could I filter down the list to the username that matches the logged in username?

JeffreyThompson2

No, you'll need a Custom Widget to access the user information.

CW-GIS

If I made one custom widget list that was filtered by the user information, then from there anyone could use a normal widget to interact with the one custom widget right?

Rejoindre la conversation

Les membres connectés peuvent publier, suivre les mises à jour, et plus encore. Nouveau ici ? Inscrivez-vous gratuitement.

Liens rapides

Community Help
Find useful guides, FAQs, and documents to help you navigate and make the most of Esri Community.