Here, I am explaining how to show current user details using JavaScript Object Model (JSOM) in SharePoint online.
Steps
Open your site and go to Edit Site -> Add Web parts.
Now, go to Add Webparts- > Media and Contents -> Add Script Editor Web part.
Edit Script Editor Webpart -> Edit Snipped -> Paste your code.
- <script type="text/javascript">
- ExecuteOrDelayUntilScriptLoaded(init,'sp.js');
- var currentUser;
- function init(){
- this.clientContext = new SP.ClientContext.get_current();
- this.oWeb = clientContext.get_web();
- currentUser = this.oWeb.get_currentUser();
- this.clientContext.load(currentUser);
- this.clientContext.executeQueryAsync(Function.createDelegate(this,this.onQuerySucceeded), Function.createDelegate(this,this.onQueryFailed));
- }
-
- function onQuerySucceeded() {
- document.getElementById('userLoginName').innerHTML = currentUser.get_loginName();
- document.getElementById('userId').innerHTML = currentUser.get_id();
- document.getElementById('userTitle').innerHTML = currentUser.get_title();
- document.getElementById('userEmail').innerHTML = currentUser.get_email();
- }
-
- function onQueryFailed(sender, args) {
- alert('Request failed. \nError: ' + args.get_message() + '\nStackTrace: ' + args.get_stackTrace());
- }
- </script>
- <div>Current Logged User:
- <span id="userLoginName"></span></br>
- <span id="userId"></span></br>
- <span id="userTitle"></span></br>
- <span id="userEmail"></span></br>
- </div>
Result