Javascript-how to implement [cross-origin Single Sign-On]?

Source: Internet
Author: User
Manage user Website user account URL: accounts.com User Logon URL: accounts. comlogin user URL: accounts. comlogout Application website application 1: app1.com Application 2: app2.com implementation scenario login application 1... Manage user websites
  • User Account URL:http://accounts.com
  • User Logon URL:http://accounts.com/login
  • User and other websites:http://accounts.com/logout

Application website
  • Application 1:http://app1.com
  • Application 2:http://app2.com

Implementation scenario
  1. Log on to Application 1 and jumphttp://accounts.com/loginLog On
  2. 1 is used for redirect response after successful logon. A token is added to the address, for example:http://app1.com/callback?token=xxxxTo verify Logon
  3. After browsing application 1, the user enters Application 2 (the user may enter the app2.com address to access application 2)
  4. In this case, Application 2 passes"Some way"To determine whether or not the previous application 1 is logged on, to set whether the current user is logged on

The question is how to implement 4th entries in a scenario?
What I think of now is:
  1. Synchronous Logon: Like discuz, you can log on to other applications synchronously when logging on to an application. The disadvantage is that, after logging on, it is best to wait several seconds to redirect so that other applications can have enough time to write cookies, but I don't like the "wait a few seconds" method.
  2. Using jsonp: although I know how to use jsonp for cross-origin requests, it is difficult to implement it and there is a security problem if it is not well handled.

Do you have any good solutions ???
----------------------- Gorgeous split line ---------------------------
In the afternoon, I spent some time studying the login methods for the two groups of websites:
  1. Google.com and youtube.com
  2. Taobao.com and etao.com

I. google.com and youtube.com
Case 1: none of them are logged on, but they have browsed youtube
  1. Log on to google.com and usehttps://accounts.google.com/ServiceLoginAuthVerify user name and password
  2. Jumphttps://accounts.google.com/CheckCookieCheck if you have browsed other apps, such as youtube.https://accounts.youtube.com/accounts/SetSIDLog On
  3. Finally, jump back to the homepage of google.com.

Scenario 2: You have logged on to google.com, but have not browsed youtube or logged on.
  1. Because I logged on to google.com, I entered the address in the address bar to access youtube for the first time.
  2. Log on to the youtube homepage and click "Log on ".
  3. Still jumphttps://accounts.google.com/ServiceLoginAuth, But skip back to the yutube Homepage without any input

Ii. taobao.com and etao.com
  1. Whether I have logged on to taobao.com or not, I will first check whether the cookie is logged on to the etao.com homepage.
  2. Log on, the etao.com homepage displays the logon status.
  3. Jumphttp://jump.taobao.com/jump?target=http%3A%2F%2Fwww.etao.com%2F%3Ftbpm%3DtTo check whether taobao.com has logged on.
  4. Log on and jump back.http://pass.etao.com/add?...After logging on, the system jumps back to the homepage and the logon status is logon.
  5. If you are not logged on, the system still jumps back to the homepage. The logon status is not logged on.
Now I basically know how to do it, or is there any other better way? Let's talk about it ......

Reply content:

Manage user websites

  • User Account URL:http://accounts.com
  • User Logon URL:http://accounts.com/login
  • User and other websites:http://accounts.com/logout

Application website
  • Application 1:http://app1.com
  • Application 2:http://app2.com

Implementation scenario
  1. Log on to Application 1 and jumphttp://accounts.com/loginLog On
  2. 1 is used for redirect response after successful logon. A token is added to the address, for example:http://app1.com/callback?token=xxxxTo verify Logon
  3. After browsing application 1, the user enters Application 2 (the user may enter the app2.com address to access application 2)
  4. In this case, Application 2 passes"Some way"To determine whether or not the previous application 1 is logged on, to set whether the current user is logged on

The question is how to implement 4th entries in a scenario?
What I think of now is:
  1. Synchronous Logon: Like discuz, you can log on to other applications synchronously when logging on to an application. The disadvantage is that, after logging on, it is best to wait several seconds to redirect so that other applications can have enough time to write cookies, but I don't like the "wait a few seconds" method.
  2. Using jsonp: although I know how to use jsonp for cross-origin requests, it is difficult to implement it and there is a security problem if it is not well handled.

Do you have any good solutions ???
----------------------- Gorgeous split line ---------------------------
In the afternoon, I spent some time studying the login methods for the two groups of websites:
  1. Google.com and youtube.com
  2. Taobao.com and etao.com

I. google.com and youtube.com
Case 1: none of them are logged on, but they have browsed youtube
  1. Log on to google.com and usehttps://accounts.google.com/ServiceLoginAuthVerify user name and password
  2. Jumphttps://accounts.google.com/CheckCookieCheck if you have browsed other apps, such as youtube.https://accounts.youtube.com/accounts/SetSIDLog On
  3. Finally, jump back to the homepage of google.com.

Scenario 2: You have logged on to google.com, but have not browsed youtube or logged on.
  1. Because I logged on to google.com, I entered the address in the address bar to access youtube for the first time.
  2. Log on to the youtube homepage and click "Log on ".
  3. Still jumphttps://accounts.google.com/ServiceLoginAuth, But skip back to the yutube Homepage without any input

Ii. taobao.com and etao.com
  1. Whether I have logged on to taobao.com or not, I will first check whether the cookie is logged on to the etao.com homepage.
  2. Log on, the etao.com homepage displays the logon status.
  3. Jumphttp://jump.taobao.com/jump?target=http%3A%2F%2Fwww.etao.com%2F%3Ftbpm%3DtTo check whether taobao.com has logged on.
  4. Log on and jump back.http://pass.etao.com/add?...After logging on, the system jumps back to the homepage and the logon status is logon.
  5. If you are not logged on, the system still jumps back to the homepage. The logon status is not logged on.
Now I basically know how to do it, or is there any other better way? Let's talk about it ......

I have studied sohu and shared it with others.

Unified in login.common.com? Return = www.a.com login, (with the address to be returned)
If return js is verified successfully, add the returned JS in login.common.com/success, display it, and then return the value in the return parameter.

So what is the JS content?
Each site is called through JS to generate their own cookies.

This method is also used by ucenter. The logon center should have something similar to the Application List.

Google's method should be a relatively complete process, but it still has some disadvantages, that is, I logged on to google when I didn't access youtube, and it didn't automatically log on to youtube for me, you also need to manually click to log on. You do not need to enter a password, but it is also troublesome.

In fact, you can make an improvement by hanging a google domain js on youtube. Of course, this js is actually output through dynamic scripts. In the script, we first check that the user has logged on to the google domain. if the user has logged on, the system dynamically outputs the js file that allows the user to log on to the youtube domain.

Although this benefit only saves one step, it is actually to distribute the cookie writing time of the first method in the problem to access each sub-site, which makes the user almost invisible.

I know the following three methods:

1. Page nesting JS cross-origin requests, just like KANG Sheng's UCenter product;
2. Let the page Jump to the domain names of different applications in sequence to solve the cross-domain problem;
3. User requests are the same as Google requests;

The details are as follows:
1. app1, app2, and app3 are mounted to UC. The user requests app1 to log on. The app1 program simultaneously requests the UC login code (as shown below) during verification and prints it to the page.

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.