Requirements for Microsoft account sign-in (HTML)

Your Windows Runtime apps can sign users in and out with their Microsoft accounts so that your apps can access their data in Microsoft cloud services like Outlook.com and Microsoft OneDrive.

Apply these guidelines when you design your app's sign-in and sign-out experience so that it provides a user experience that's consistent with other Windows Runtime apps. These guidelines also help your app keep the user's data secure.

Important  The tutorial in this topic demonstrates a Windows Store app. You can also add Microsoft services to a Windows Phone Store app. Since the Windows Phone user interface does not support flyouts, however, you have to use pages in a Windows Phone Store app to implement the features for which flyouts are used in this topic.

 

Overview

Accessing users' data from Microsoft cloud services like Outlook.com and OneDrive requires that users sign in with their Microsoft account and give consent for your app to access the data that the app requires. To help users keep their data secure from other users of their computer, your Windows Store app should also make it possible for the user to sign out of the app. This topic describes how to do that.

Important  If your app does not enable users to sign out, the app will be able to access the users' data whenever the app runs from the computer account in which they first signed in. Although this provides a great convenience to users who never share or lose their computer, it presents a possible security vulnerability if the computer is used by another person or if the computer is stolen. For these reasons, your Windows Store app should always indicate when it is signed in to a user's account and provide the option for the user to sign out.

 

Note  If the user's computer account is associated with a Microsoft account, the user cannot sign out of their Microsoft account from within the app. This should occur only on personal computers and not shared computers.

 

These steps describe at a high level how your app can access the user's profile info. To see the detailed instructions, see How to use Microsoft services in your app.

  1. Initialize the JavaScript API by calling WL.init()

    Your app must call WL.init() once in each page that uses functions from the Live SDK.

    You might be able to simplify this in your app by keeping the functions that call the Live SDK in a single file.

  2. Add settings commands to the app

    Add these two entries in the app's Settings pane.

    • Account

      The Account command in the Settings pane shows the Flyout in which users can sign in to and sign out of their Microsoft account.

    • Privacy policy

      The Privacy command in the Settings pane shows the Flyout that contains your app's privacy policy.

    This image shows a setting pane with those commands added explicitly. If you app has other settings, you might also consider putting the sign-in and sign-out functionality or the privacy statement on a Settings flyout with other related entries. The important point is that these settings must be available and discoverable in your app.

    Screen shot of the settings tab created by the code example

  3. Provide a privacy policy

    For more info, see the Windows and Windows Phone Store Policies.

  4. Sign the user in

    Your app can do this automatically when it starts, or it can allow users to sign in only when they need to access to data that is stored in Microsoft cloud services like Outlook.com and OneDrive.

    Important  To provide the most secure and consistent experience, only use the Windows 8 sign-in control, shown here, to sign in a user.

     

    Screen shot of Microsoft account sign-in UI

    If the user has not already given permission to the app so that it can access his or her profile info, the user will also see this screen.

    Screen shot of consent UI

  5. Sign the user out

    Consider how your app will be used. If it accesses data that the user might consider sensitive, your app should sign the user out automatically to prevent unauthorized access. But if the app is used in a more secure environment, you could leave it up to the user to sign out manually by using the Account settings command.

    If the user's computer account is associated with a Microsoft account, the user cannot sign out of their Microsoft account from within the app. This should only occur on personal computers and not shared computers.

    Important  

    Users should always understand when the app is connected to their Microsoft account and when it isn't.

     

  6. Show the sign-in state in the app's UI

    Add some type of indication to your app's UI to show users when they are signed in and the app can access their info.

    Note  It's important for your app to let users know when they are signed in. This could be done as simply as by displaying their name or by listing elements that come from data that is stored in their Microsoft cloud service. For example, if your app displays users' photos from their OneDrive, it could display a list of their photos when they are signed in, and a message that they need to sign in if they are not signed in. OneDrive

     

How to use Microsoft services in your app

Live SDK