노드가 Single Sign-On 시스템을 구현하는 방법에 대한 간략한 분석

Single Sign-On 시스템을 구현하는 방법은 무엇입니까? 다음 글에서는 node를 사용하여 Single Sign-On 시스템을 구현하는 방법을 소개하겠습니다. 도움이 되길 바랍니다!

Single Sign On SSO(Single Sign On)는 두 개 이상의 비즈니스 시스템에서 로그인 기능을 분리하여 새로운 시스템을 구성하여 한 번의 로그인 후에 모든 비즈니스 시스템에 로그인할 수 있도록 하는 것입니다. 필수의.

1. 기본 지식

1.1 동일 출처 정책

소스 = 프로토콜 + 도메인 이름 + 포트

http://www.a.com을 예로 들어보세요:

• https: // www.a.com ❌(다른 프로토콜)
• http://www.b.com ❌(다른 도메인 이름)
• http://www.a.com:3000 ❌(다른 포트)

동일 출처 정책 애플리케이션 아래의 리소스는 이 애플리케이션에서만 액세스할 수 있도록 하여 보안을 보장하는 것이 브라우저의 동작입니다. [관련 튜토리얼 권장 사항: nodejs 비디오 튜토리얼]

1.2 세션 메커니즘

http 프로토콜은 stateless 프로토콜이므로 클라이언트와 서버 데이터가 교환된 후 연결이 닫히고 다시 연결됩니다. 다음에 요청할 때 설정됨) 연결), 그러나 비밀번호 기억과 같은 기능을 수행해야 하는 경우 세션을 기록해야 한다는 것은 분명합니다.

일반적으로 사용되는 세션 추적은 쿠키와 세션입니다. 간단히 이해하면 키와 값을 저장할 수 있는 데이터 구조입니다. 차이점은 쿠키는 클라이언트 측에 저장되고 세션은 서버 측에 저장된다는 점입니다.

2. 싱글 사인온

1. 동일한 상위 도메인 SSO

동일한 상위 도메인(예: www.app1.aaa.com, www) app2.aaa.com두 서버 모두 .aaa.com의 상위 도메인에 있습니다. www.app1.aaa.com,www.app2.aaa.com这两个服务器都是在.aaa.com的父域名。
默认情况下，两个服务器下页面之间的cookie是互相访问不到的。

但是我们可以通过设置cookie的domain属性为共通的父域名,使得两个服务器下页面之间的cookie可以相互访问到。

router.get('/createCookie', async (ctx, next) => {
  ctx.cookies.set('username', '123', {
    maxAge: 60 * 60 * 1000,
    httpOnly: false,
    path: '/',
    domain:'.a.com' //设置domain为共通的父域名
  });
  ctx.body = "create cookie ok"})router.get('/getCookie', async (ctx, next) => {
  let username=ctx.cookies.get('username')
  if (username){
    ctx.body=username  }else{
    ctx.body='no cookie'
  }})

2. 跨域SSO

当我们的域名为www.a.com,www.b.com时，无论怎样设置domain都没用了。

那么就要想办法将身份凭证(token)写入到所有域的cookie中。

2.1 跨域写cookie

2.1.1 利用标签跨域写cookie(jsonp)

在http://www.a.com/index.js中直接向https://www.c.com:3000/sso直接发送网络请求，是无法跨域写入cookie的。

  <script>
    $.ajax({
      url: &#39;https://www.c.com:3000/sso?key=username&value=123&#39;,
      method: &#39;get&#39;,
    })
  </script>

但是我们可以通过标签发起跨域请求，写入cookie

<script></script>

或者使用jquery jsonp的方式发起跨域请求，写入cookie，这种方式的原理也是通过标签能够跨域实现的。

 $.ajax({
      url: 'https://www.c.com:3000/sso?key=username&value=123',
      method: 'get',
      dataType:'jsonp'
    })

这样通过标签就实现了往www.a.com中写入了domain为www.c.com的跨域cookie.

后端

const options = {
  key: fs.readFileSync(path.join(__dirname, './https/privatekey.pem')),
  cert: fs.readFileSync(path.join(__dirname, './https/certificate.pem')),
  secureOptions: 'TLSv1_2_method' //force TLS version 1.2}var server = https.createServer(options,app.callback());  //只能使用https协议写cookierouter.get('/sso', async (ctx, next) => {
  let {
    key, value  } = ctx.request.query
  ctx.cookies.set(key, value, {
    maxAge: 60 * 60 * 1000, //有效时间，单位毫秒
    httpOnly: false, //表示 cookie 是否仅通过 HTTP(S) 发送，, 且不提供给客户端 JavaScript (默认为 true).
    path: '/',
    sameSite: 'none', //限制第三方 Cookie
    secure: true //cookie是否仅通过 HTTPS 发送
  });
  ctx.body = 'create Cookie ok'})

注意:

• 浏览器未写入cookie报错his set-cookie was blocked due to http-only
  http-only：表示 cookie 是否仅通过 HTTP(S) 发送，, 且不提供给客户端 JavaScript (默认为 true).
  所以要将httpOnly设置为false.

• 浏览器未写入cookie报错this set-cookie was blocked due to user preference
  这个真的坑，因为我是无痕模式打开的浏览器，但是chrome浏览器默认无痕模式下禁用第三方cookie，修改为允许所有cookie就行了.
  

• 浏览器未写入cookie报错this set cookie was blocked because it has the SameSite attribute but Secure not set
  需要设置sameSite和secure属性

• 浏览器未写入cookie报错server error Error: Cannot send secure cookie over unencrypted connection 기본적으로 두 서버의 페이지 간 쿠키는 서로 액세스할 수 없습니다.
  

  하지만 쿠키의 도메인 속성을 공통 상위 도메인 이름으로 설정하여 두 서버의 페이지 사이에 있는 쿠키에 서로 액세스할 수 있습니다.

router.get('/sso', async (ctx, next) => {
  let {
    key, value  } = ctx.request.query
  ctx.cookies.set(key, value, {
    maxAge: 60 * 60 * 1000, //有效时间，单位毫秒
    httpOnly: false,
    path: '/',
    sameSite: 'none',
    secure: true
  });
  ctx.set("P3P", "CP='CURa ADMa DEVa PSAo PSDo OUR BUS UNI PUR INT DEM STA PRE COM NAV OTC NOI DSP COR'") //p3p响应头
  ctx.body = 'create Cookie ok'})

2 . Cross-domain SSO

🎜🎜저희 도메인 이름이 www.a.com, www.b.com이면 어떻게 도메인을 설정해도 소용이 없습니다. . 🎜🎜그런 다음 모든 도메인의 쿠키에 ID 자격 증명(토큰)을 기록하는 방법을 찾아야 합니다🎜. 🎜

🎜2.1 도메인 전체에 쿠키 쓰기🎜

🎜🎜2.1.1 <script></script> 태그를 사용하여 도메인 전체에 쿠키 작성(jsonp)🎜🎜🎜http://www.a.com /index .js에서 https://www.c.com:3000/sso로 직접 네트워크 요청을 보내는 경우 도메인 간에 쿠키를 쓸 수 없습니다. 🎜

router.get('/createToken', async (ctx, next) => {
  let { from } = ctx.request.query  let token = "123";
  ctx.response.redirect(`${from}?token=${token}`)})

🎜하지만 <script></script> 태그를 통해 도메인 간 요청을 시작하고 쿠키를 작성🎜

router.get('/createCookie', async (ctx, next) => {
  let { token } = ctx.request.query
  ctx.cookies.set('token', token, {
    maxAge: 60 * 60 * 1000, //有效时间，单位毫秒
    httpOnly: false,
    path: '/',
  });
  ctx.body = 'set cookie ok'})

🎜하거나 jquery jsonp를 사용하여 도메인 간 요청을 시작하고 쿠키를 작성할 수 있습니다. 스크립트 /> 태그는 여러 도메인에 걸쳐 구현될 수 있습니다. 🎜

<script></script>

🎜이렇게 하면 <script></script> 태그를 통해 www.c.com 도메인의 크로스 도메인 쿠키가 www.a.com에 기록됩니다.🎜🎜 백엔드🎜

router.get('/readCookie', async (ctx, next) => {
  let username = ctx.cookies.get('username')
  console.log('cookie', username)})

🎜참고:🎜 🎜

🎜🎜브라우저가 쿠키를 쓰지 않았고 오류를 보고했습니다그의 쿠키 설정은 http 전용으로 인해 차단되었습니다🎜 http- only: 쿠키가 HTTP(S)를 통해서만 전송되고 클라이언트 JavaScript에 제공되지 않는지 여부를 나타냅니다(기본값은 true).🎜 따라서 httpOnly를 false로 설정하세요.🎜🎜🎜🎜브라우저가 쿠키를 작성하지 않았고 오류를 보고했습니다. code>이 설정 쿠키는 사용자 기본 설정으로 인해 차단되었습니다.🎜 브라우저를 시크릿 모드로 열었지만 Chrome 브라우저는 기본적으로 시크릿 모드에서 타사 쿠키를 비활성화하므로 이는 정말 함정입니다. 모든 쿠키를 허용합니다.🎜🎜🎜🎜 🎜브라우저가 쿠키를 쓰지 않습니다 오류이 설정된 쿠키는 SameSite 속성이 있지만 보안이 설정되지 않았기 때문에 차단되었습니다🎜 sameSite 및 보안 속성을 설정해야 합니다🎜🎜🎜🎜브라우저가 쿠키를 작성하고 오류를 보고했습니다서버 오류 오류: 암호화되지 않은 연결을 통해 보안 쿠키를 보낼 수 없습니다🎜 이것이 쿠키 작성에 대한 Koa 프레임워크의 제한 사항인 것 같습니다. www.c.com을 https 서버로 변경했습니다.🎜🎜🎜🎜🎜 2.1.2 p3p 프로토콜 헤더는 IE 브라우저 크로스 도메인을 구현합니다. 🎜🎜🎜위에서 언급한 jsonp 메소드는 크롬 브라우저에서 완벽하게 실행되지만 IE 브라우저는 쿠키에 대해 더 엄격하며 위의 방법만으로는 쿠키를 작성할 수 없습니다. 해결책은 p3p 응답 헤더를 추가하는 것입니다. 🎜

router.get('/sso', async (ctx, next) => {
  let {
    key, value  } = ctx.request.query
  ctx.cookies.set(key, value, {
    maxAge: 60 * 60 * 1000, //有效时间，单位毫秒
    httpOnly: false,
    path: '/',
    sameSite: 'none',
    secure: true
  });
  ctx.set("P3P", "CP='CURa ADMa DEVa PSAo PSDo OUR BUS UNI PUR INT DEM STA PRE COM NAV OTC NOI DSP COR'") //p3p响应头
  ctx.body = 'create Cookie ok'})

2.1.3 url参数实现跨域信息传递

访问http://www.c.com:3000/createToken?from=http://www.a.com/createCookie

www.c.com上生成token后将url重写，带上token，重定向到www.a.com

router.get('/createToken', async (ctx, next) => {
  let { from } = ctx.request.query  let token = "123";
  ctx.response.redirect(`${from}?token=${token}`)})

www.a.com上从url上获取token，存入cookie

router.get('/createCookie', async (ctx, next) => {
  let { token } = ctx.request.query
  ctx.cookies.set('token', token, {
    maxAge: 60 * 60 * 1000, //有效时间，单位毫秒
    httpOnly: false,
    path: '/',
  });
  ctx.body = 'set cookie ok'})

这样就实现了跨域信息的传递.与上面的方式不同，这种方法只是单纯的http请求，适用于所有浏览器，但是缺点也很明显，每次只能分享给一个服务器。

2.2 跨域读cookie

2.2.1 利用标签跨域读cookie(jsonp)

之前2.1.1利用标签在www.a.com中写入了www.c.com的cookie(username,123),现在想要www.a.com请求的时候携带上www.c.com的cookie，也就是说要跨域读cookie.

其实也是同样的方法，在www.a.com上利用跨域访问访问www.c.com,会自动的带上domain为www.c.com的cookie。
www.a.com/index.js

<script></script>

www.c.com

router.get('/readCookie', async (ctx, next) => {
  let username = ctx.cookies.get('username')
  console.log('cookie', username)})

可以看到读取到了存储在www.a.com里面domain为www.c.com的cookie.

3. nodejs实现单点登录系统实战

效果如图所示:

• 第一次访问www.a.com首页

• 跳转到www.c.com:3000登录页面,登录成功后跳转www.a.com首页

• 再次访问www.a.com首页，无需登录直接跳转

• 访问www.b.com首页，无需登录直接跳转

源码: https://github.com/wantao666/sso-nodejs

详细设计:

更多node相关知识，请访问：nodejs 教程！

위 내용은 노드가 Single Sign-On 시스템을 구현하는 방법에 대한 간략한 분석의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!