Insert an existing item into the website with iframe tag. The embedded item cannot be logged in normally. It is normal to directly enter the URL in the browser address bar and log in. And began to explore…

Problem analysis

As the subsequent interface prompts 401, it is judged to be caused by the authentication failure of the login interface. Therefore, observe the request response of the login interface and find the following clues:

Write Cookie failed. The cookie’s samesite property is not explicitly set, so it defaults to Lax, and the browser blocks the interface because it is a cross-site request that is not top-level navigation!

This prompt contains two pieces of information:

  1. There is an associated SameSite attribute when setting cookies
  2. Top level navigation

More on that!

SameSite properties

SetHeader (” set-cookie “,”CookieName=CookieValue; setHeader(” set-cookie “,”CookieName=CookieValue; SameSite=propValue”), indicating whether the cookie can be carried in a cross-site request, can take three values:

  1. Strict: indicates that third-party cookies are strictly prohibited. Cookies are not sent across sites under any circumstances.
  2. Lax, do not send third-party cookies in most cases, except for Get requests that navigate to the target url
  3. None, which indicates that cross-site restriction is turned off, but you need to explicitly set the Secure property and configure HTTPS

If not, the browser defaults to Lax. As mentioned above.

Top level Navigation

What is top-level navigation?

Enter www.baidu.com in the browser address bar to open the home page of Baidu. Open the console and you can see that there are three applications (Google Translate, Grammarly and UserTesting) on the current page, and the other three are plug-ins installed by me.

As far as the browser is concerned, Baidu is a top level-navigation, the other three are not, because the url of Baidu is entered in the address bar.

To solve the problem

To sum it up:

The login interface is an interface from the non-top-level navigation (iframe nested) whose default SameSite attribute value Lax requires that the URL of the application in iframe be the same as that of the top-level navigation application.

There are three plans:

  1. Make sure both urls are the same (domain name, testing found that the same master domain name under different subdomains is also ok).
  2. Set SameSite to set-cookie :Key=Value; SameSite=None; Secure: Ensures that the protocol is HTTPS
  3. Disable the browser’s default configuration for SameSite (only for unset SameSite properties) by:

The first is the simplest and most direct.

The second requires modifications to the server code.

The third is very unrealistic at the user level.

The first scheme was decisively adopted.