Skip to content

Commit 796fbfb

Browse files
committed
copy edit + image cleanup + dates
1 parent 710117d commit 796fbfb

12 files changed

+45
-34
lines changed

articles/active-directory/develop/quickstart-v2-javascript-auth-code.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@ ms.service: active-directory
1010
ms.subservice: develop
1111
ms.topic: quickstart
1212
ms.workload: identity
13-
ms.date: 04/22/2020
13+
ms.date: 05/19/2020
1414
ms.author: hahamil
1515
ms.custom: aaddev, scenarios:getting-started, languages:JavaScript
1616
#Customer intent: As an app developer, I want to learn how to get access tokens and refresh tokens by using the Microsoft identity platform endpoint so that my JavaScript app can sign in users of personal accounts, work accounts, and school accounts.
Lines changed: 24 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
---
2-
title: How to handle Intelligent Tracking Protection (ITP) in Safari with the Microsoft identity platform | Azure
2+
title: How to handle Intelligent Tracking Protection (ITP) in Safari | Azure
33
titleSuffix: Microsoft identity platform
44
description: Single-page app (SPA) authentication when third-party cookies are no longer allowed.
55
services: active-directory
@@ -10,7 +10,7 @@ ms.service: active-directory
1010
ms.subservice: develop
1111
ms.workload: identity
1212
ms.topic: conceptual
13-
ms.date: 05/11/2020
13+
ms.date: 05/19/2020
1414
ms.author: hirsin
1515
ms.reviewer: kkrishna
1616
ms.custom: aaddev
@@ -21,18 +21,22 @@ Many browsers today are blocking third-party cookies - cookies on requests to do
2121

2222
## What is Intelligent Tracking Protection (ITP)?
2323

24-
Apple Safari has an on-by-default privacy protection feature called [Intelligent Tracking Protection](https://webkit.org/tracking-prevention-policy/), or *ITP*. ITP blocks "third-party cookies," cookies on requests that cross domains. A common form of user tracking is loading an iframe in the background to a third-party site, using cookies to correlate the user across the Internet. Unfortunately, this pattern is also the standard way of implementing the [implicit flow](v2-oauth2-implicit-grant-flow.md) for single page apps (SPAs). When a browser blocks third-party cookies to prevent user tracking, SPAs are also broken.
24+
Apple Safari has an on-by-default privacy protection feature called [Intelligent Tracking Protection](https://webkit.org/tracking-prevention-policy/), or *ITP*. ITP blocks "third-party" cookies, cookies on requests that cross domains.
2525

26-
Safari is not alone in blocking third-party cookies to enhance user privacy - Brave has blocked third-party cookies by default, and Chromium (the platform behind Google Chrome and Microsoft Edge) has announced that they will stop supporting third-party cookies as well in the future. The solution outlined in this document works in all of these browsers, or anywhere else third-party cookies are blocked.
26+
A common form of user tracking is done by loading an iframe to third-party site in the background and using cookies to correlate the user across the Internet. Unfortunately, this pattern is also the standard way of implementing the [implicit flow](v2-oauth2-implicit-grant-flow.md) in single-page apps (SPAs). When a browser blocks third-party cookies to prevent user tracking, SPAs are also broken.
27+
28+
Safari isn't alone in blocking third-party cookies to enhance user privacy. Brave has blocked third-party cookies by default, and Chromium (the platform behind Google Chrome and Microsoft Edge) has announced that they as well will stop supporting third-party cookies in the future.
29+
30+
The solution outlined in this article works in all of these browsers, or anywhere third-party cookies are blocked.
2731

2832
## Overview of the solution
2933

30-
In order to continue authenticating users in SPAs, app developers must use the [authorization code flow](v2-oauth2-auth-code-flow.md), which issues a code to the SPA. The SPA redeems this code for an access token and a refresh token. When the app requires additional tokens, it can use the [refresh token flow](v2-oauth2-auth-code-flow.md#refresh-the-access-token) to get new tokens. MSAL.js 2.0, the Microsoft identity platform library for SPAs, implements the authorization code flow for SPAs and is a drop-in replacement for MSAL.js 1.x with minor updates.
34+
To continue authenticating users in SPAs, app developers must use the [authorization code flow](v2-oauth2-auth-code-flow.md). In the auth code flow, the identity provider issues a code, and the SPA redeems the code for an access token and a refresh token. When the app requires additional tokens, it can use the [refresh token flow](v2-oauth2-auth-code-flow.md#refresh-the-access-token) to get new tokens. MSAL.js 2.0, the Microsoft identity platform library for SPAs, implements the authorization code flow for SPAs and, with minor updates, is a drop-in replacement for MSAL.js 1.x.
3135

32-
For the Microsoft identity platform, native clients and SPAs follow the same protocol guidance:
36+
For the Microsoft identity platform, SPAs and native clients follow similar protocol guidance:
3337

3438
* Use of a [PKCE code challenge](https://tools.ietf.org/html/rfc7636)
35-
* While PKCE is only *recommended* for native and confidential clients, Microsoft identity platform *requires* PKCE for SPAs.
39+
* PKCE is *required* for SPAs on the Microsoft identity platform. PKCE is *recommended* for native and confidential clients.
3640
* No use of a client secret
3741

3842
SPAs have two additional restrictions:
@@ -44,19 +48,21 @@ SPAs have two additional restrictions:
4448

4549
## Performance and UX implications
4650

47-
Some applications using the implicit flow attempt sign-in without redirecting away by opening a login iframe using `prompt=none`. In most browsers, this request will respond with tokens for the currently signed in user (assuming consent has already been granted). This pattern meant applications did not need a full page redirect to sign the user in, improving performance and user experience - the user visits the web page and is signed in already. `prompt=none` in an iframe are no longer an option when third-party cookies are blocked, so applications must visit the login page in a top-level frame to have an authorization code issued. There are two ways of accomplishing sign-in:
51+
Some applications using the implicit flow attempt sign-in without redirecting by opening a login iframe using `prompt=none`. In most browsers, this request will respond with tokens for the currently signed-in user (assuming consent has already been granted). This pattern meant applications did not need a full page redirect to sign the user in, improving performance and user experience - the user visits the web page and is signed in already. Because `prompt=none` in an iframe is no longer an option when third-party cookies are blocked, applications must visit the login page in a top-level frame to have an authorization code issued.
4852

49-
* Full page redirects
50-
* On the first load of the SPA, redirect the user to the sign-in page if no session exists already (or if the session is expired). The user's browser will visit the login page, present the cookies containing the user session, and then redirect back to the application with the code and tokens in a fragment.
51-
* The redirect does result in the SPA being loaded twice. Follow best practices for caching of SPAs so that the app is not downloaded in full twice.
53+
There are two ways of accomplishing sign-in:
54+
55+
* **Full page redirects**
56+
* On the first load of the SPA, redirect the user to the sign-in page if no session already exists (or if the session is expired). The user's browser will visit the login page, present the cookies containing the user session, and then redirect back to the application with the code and tokens in a fragment.
57+
* The redirect does result in the SPA being loaded twice. Follow best practices for caching of SPAs so that the app is not downloaded in-full twice.
5258
* Consider having a pre-load sequence in the app that checks for a login session and redirects to the login page before the app fully unpacks and executes the JavaScript payload.
53-
* Popups
54-
* If the UX of a full page redirect does not work for the application, consider using a popup to handle authentication.
55-
* When the popup finishes redirecting to the application after authentication, code in the redirect handler will store the code and tokens in local storage for the application to use. MSAL.JS supports popups for authentication, as do most libraries.
59+
* **Popups**
60+
* If the user experience (UX) of a full page redirect doesn't work for the application, consider using a popup to handle authentication.
61+
* When the popup finishes redirecting to the application after authentication, code in the redirect handler will store the code and tokens in local storage for the application to use. MSAL.js supports popups for authentication, as do most libraries.
5662
* Browsers are decreasing support for popups, so they may not be the most reliable option. User interaction with the SPA before creating the popup may be needed to satisfy browser requirements.
5763

5864
>[!NOTE]
59-
> Apple also [describes a popup method](https://webkit.org/blog/8311/intelligent-tracking-prevention-2-0/), a temporary compatibility fix to give the original window access to third-party cookies. While Apple may remove this transferral of permissions in the future, it will not impact the guidance here. Here, the popup is being used as a first party navigation to the login page so that a session is found and an auth code can be provided. This should continue working into the future.
65+
> Apple [describes a popup method](https://webkit.org/blog/8311/intelligent-tracking-prevention-2-0/) as a temporary compatibility fix to give the original window access to third-party cookies. While Apple may remove this transferral of permissions in the future, it will not impact the guidance here. Here, the popup is being used as a first party navigation to the login page so that a session is found and an auth code can be provided. This should continue working into the future.
6066
6167
### A note on iframe apps
6268

@@ -70,5 +76,6 @@ This limited-lifetime refresh token pattern was chosen as a balance between secu
7076

7177
## Next steps
7278

73-
* Review the [authorization code flow protocol documentation](v2-oauth2-auth-code-flow.md).
74-
* Try out the authorization code flow with the [MSAL.js 2.0 quickstart](quickstart-v2-javascript-auth-code.md).
79+
Learn more about the [authorization code flow](v2-oauth2-auth-code-flow.md).
80+
81+
Try out the authorization code flow with the [MSAL.js 2.0 quickstart](quickstart-v2-javascript-auth-code.md).

articles/active-directory/develop/scenario-spa-app-registration.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@ ms.service: active-directory
99
ms.subservice: develop
1010
ms.topic: conceptual
1111
ms.workload: identity
12-
ms.date: 05/11/2020
12+
ms.date: 05/19/2020
1313
ms.author: hahamil
1414
ms.custom: aaddev
1515
# Customer intent: As an application developer, I want to know how to write a single-page application by using the Microsoft identity platform for developers.

articles/active-directory/develop/tutorial-v2-javascript-auth-code.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@ ms.service: active-directory
99
ms.subservice: develop
1010
ms.topic: tutorial
1111
ms.workload: identity
12-
ms.date: 05/11/2020
12+
ms.date: 05/19/2020
1313
ms.author: hahamil
1414
ms.custom: aaddev
1515
---

0 commit comments

Comments
 (0)