Rocket.Chat SSO + 임베드 플러그인

[RGJ (Richard - Communiteq)]

요약: 이 플러그인은 Rocket.Chat을 Discourse와 통합합니다.

Communiteq, Digital Ocean 또는 다른 프로바이더를 통해 호스팅된 Rocket.Chat 인스턴스를 별도로 구비해야 합니다. 이 플러그인은 해당 인스턴스를 포럼과 통합합니다.

통합은 두 부분으로 구성됩니다:

• Discourse 사용자 인터페이스 내 채팅 임베딩
• Discourse와 Rocket.Chat 간의 단일 로그인(SSO). 여기서 Discourse는 Rocket.Chat에서 사용자를 인증, 생성 및 업데이트하기 위한 인증 제공자로 작용합니다.

GitHub: GitHub - communiteq/discourse-rocketchat · GitHub
설치: 플러그인 설치 가이드를 따르세요.
크레딧: @jrgong은 Rocket.Chat을 Discourse와 통합한다는 훌륭한 아이디어를 제시했으며, 사용자 인터페이스의 첫 버전 개발도 진행했습니다.

스크린샷

채팅은 Discourse 인터페이스의 오른쪽 하단에 임베딩됩니다. 제목 바를 클릭하여 접거나 펼칠 수 있습니다. 포럼 내부를 탐색할 때도 채팅은 열려 있는 상태로 유지됩니다.

모바일에서는 채팅이 전체 화면으로 표시되며, 상단 바의 Rocket.Chat 아이콘을 통해 접근할 수 있습니다:

설정

이 통합은 두 시스템 모두에서 설정해야 합니다. Discourse는 사용자 인터페이스에 통합하기 위해 채팅의 위치를 알아야 하고, Rocket.Chat은 인증을 수행하기 위해 Discourse의 위치를 알아야 합니다.

Discourse 측

관리 - 플러그인 - Discourse RocketChat - 설정

discourse_rocketchat_enabled
플러그인을 활성화하거나 비활성화합니다.

discourse rocketchat title
여기에서 채팅 창 제목을 설정합니다. 예: Chat

discourse rocketchat host
RocketChat 인스턴스의 호스트 이름을 설정합니다. 예: chat.example.com.
https:// 등으로 접두사를 붙이지 마세요.

discourse rocketchat default channel
여기에서 기본 채널을 설정합니다. 예: General.

discourse rocketchat min trust level
사용자가 Rocket.Chat을 사용할 수 있는 최소 신뢰 수준을 설정합니다. 예: 2: member.

discourse rocketchat click entire bar
채팅을 펼치거나 숨기기 위해 전체 제목 바를 클릭할 수 있도록 하려면 이 옵션을 활성화하세요. 'Open’과 ‘Close’ 텍스트만 클릭 가능하도록 하려면 비활성화하세요.

discourse rocketchat show menu for groups
Rocket.Chat이 메뉴를 표시하도록 하려는 그룹을 설정합니다. 예: staff

Rocket.Chat 측

관리 - 설정 - CAS

이 통합은 인증 및 인가(CAS 2.0 프로토콜)에 CAS 2.0 프로토콜을 사용합니다.

forum.example.com을 포럼 이름으로 교체하세요.

• SSO Base URL: https://forum.example.com/rocketchat
• SSO Login URL: https://forum.example.com/rocketchat/login
• CAS Version: 2.0
• Trust CAS username: 활성화됨
• Allow user creation: 활성화됨
• Enabled: 활성화됨

관리 - 설정 - CAS - Attribute Handling

이메일 주소와 전체 이름을 동기화할 수 있도록 해당 속성을 찾을 위치를 설정해야 합니다.

• Always Sync User Data: 활성화됨
• Attribute Map: {"email":"%email%", "name":"%name%"}

관리 - 설정 - General

iFrame 내에서 Rocket.Chat을 실행할 수 있어야 합니다.

• Restrict access inside any Iframe: 비활성화됨

관리 - 설정 - Accounts

두 플랫폼을 통합하려면 Discourse가 로그인 및 가입, 그리고 계정의 전체 이름, 이름 및 이메일 주소를 제어해야 합니다. Rocket.Chat 측에서 다음 설정을 비활성화해야 합니다:

• Allow User Avatar Change: 비활성화됨
• Allow Name Change: 비활성화됨
• Allow Username Change: 비활성화됨
• Allow Email Change: 비활성화됨
• Show Default Login Form: 비활성화됨

관리 - 설정 - Accounts - Registration

• Registration Form: 비활성화됨
• Registration Form Secret URL: (무작위 문자열)

관리 - 설정 - Accounts - Avatar

Rocket.Chat은 Discourse의 아바타를 사용할 수 있습니다.
forum.example.com을 포럼 이름으로 교체했는지 확인하세요.

• Avatar External Provider URL: https://forum.example.com/rocketchat/avatar/{username}.png

[jrgong]

저는 이 플러그인을 꽤 오랫동안 사용해 온 고객 중 한 명인데, 정말 놀랍습니다!!!

참고로 @RGJ, 기존 Discourse 인스턴스에 RC를 통합하기 위한 SSO + Embed 솔루션이라는 점을 주제 제목에 추가해 주시면 좋겠습니다.

Babble Chat의 대안을 찾고 계신 분들에게, 이 플러그인이 바로 그 성배입니다!

[DiscourseMetrics]

정말 멋지네요!

아바타 URL에 대해 한 가지 참고할 점이 있습니다. 이 URL을 사용하면 기본 아바타(색상 배경 위에 글자가 표시되는 형태)를 사용하는 사용자의 이미지가 표시되지 않으며, 커스텀 이미지나 그라바타만 표시됩니다. 모든 아바타를 포함할 수 있는 다른 URL을 아시는 분이 있을까요?

[RGJ (Richard - Communiteq)]

좋은 지적이네요, @DiscourseMetrics. 감사합니다.

그런 URL이 있는지 몰라서 플러그인에 해당 기능을 추가했습니다. 이제 그라바바(Gravatar), 업로드된 이미지, 또는 문자일 관계없이 https://forum.example.com/rocketchat/avatar/{username}.png를 통해 어떤 아바타든 가져올 수 있습니다.

[davidkingham]

정말 멋져 보입니다! 하지만 이 기능을 활성화하면 d-header가 사라지는데, 이유가 뭔지 혹시 아시나요?

[RGJ (Richard - Communiteq)]

음… 테마 컴포넌트를 엄청나게 많이 사용하고 있어서 직접 접근할 수 없으면 디버깅하기가 어렵네요.

접두사가 없는 클래스(.collapsible)를 사용하고 있었는데, 이로 인해 충돌이 발생할 가능성이 높다고 판단하여 해당 클래스에 접두사를 붙였습니다.

[davidkingham]

Richard님, unfortunately 그 방법으로 해결되지 않았습니다. 다른 사이트 중 하나에도 설치해보고 모든 플러그인과 TC를 비활성화했지만, 여기에서 보시는 것처럼 여전히 같은 문제가 발생합니다. Exploring Exposure - Exploring Exposure Discussions

[RGJ (Richard - Communiteq)]

방금 깨달은 건데, 이 플러그인은 stable 브랜치에서만 개발하고 테스트했습니다. 플러그인이 2.8.x에서 오류를 발생시키고 충돌합니다. 조사해서 수정하겠습니다. 보고해 주셔서 감사합니다!

@davidkingham 문제를 수정했습니다. 다시 빌드해서 테스트해 주시겠습니까?

[mangojumbo (Luca)]

이 플러그인을 만들어 주셔서 정말 감사합니다. 매우 유용합니다!

두 가지 질문이 있습니다:

• 현재는 통합 기능 중 채팅 임베딩 부분만 테스트하고 있습니다.
  플러그인의 SSO 기능이 자동 로그인과 원활하게 통합되어 사용자는 비밀번호를 입력하지 않고도 로그인할 수 있는가요, 아니면 여전히 SSO 로그인 버튼을 클릭해야 rocketchat에 로그인할 수 있나요?
  현재 rocketchat과 nextcloud 간의 SSO 통합에서 이 문제를 겪고 있으며, 지금까지 SSO 버튼을 클릭하지 않고 rocketchat에 자동 로그인하는 방법을 찾지 못했습니다.

• 임베딩된 채팅이 기본 채널이 아닌 rocketchat 홈 페이지에서 열리도록 설정할 수 있을까요?
  현재는 기본 채널을 설정하는 것만 가능한데, 임베딩된 채팅이 rocketchat의 사용자 정의 홈 페이지에서도 열릴 수 있다면 매우 유용할 것입니다.
  (이와 관련하여 github 저장소에 이슈를 하나 열었습니다. 여기를 참고해 주세요. 누가 불편해하지 않기를 바랍니다.)

다시 한번 귀중한 기여에 깊이 감사드립니다!

[volanar]

이 솔루션은 phpfox에서 ChatPlus라고 불리며, 여기서 기존 채팅의 모든 메시지를 Rocket Chat으로 이전할 수 있습니다. 이러한 기능을 추가할 계획이 있으신가요?

Welcome to phpFox User Manual

[RGJ (Richard - Communiteq)]

@volanar

기존 채팅의 모든 메시지를 로켓 채팅으로 이전

어떤 "기존 채팅"을 말씀하시는 건가요? 이건 Discourse 기능보다는 Rocket.Chat 기능에 더 가까운 것 같습니다? 아니면 제가 오해하고 있는 건가요?

@mangojumbo

플러그인의 SSO 기능이 자동 로그인과 원활한 통합을 허용하는지, 아니면 사용자가 로그인하려면(비밀번호를 입력하지 않아도) SSO 로그인 버튼을 클릭해야 하는지 궁금합니다.

이 스크립트를 Rocket.Chat에서 "로그아웃된 사용자를 위한 커스텀 스크립트"로 설정하세요 (2번째 줄에서 호스트명을 포럼 이름으로 교체하는 것을 확인하세요). 참고: 최근에 이 기능을 테스트해 보지 않았습니다. 작동하지 않을 경우 도움을 드릴 수 있을지 확신할 수 없습니다.

const credentialToken = Random.id();
const login_url = "https://discourse.example.com/rocketchat/login";

const appUrl = Meteor.absoluteUrl().replace(/\/$/, '') + __meteor_runtime_config__.ROOT_URL_PATH_PREFIX;
const delim = (login_url.split('?').length > 1) ? '&' : '?';

var i = document.createElement('iframe');
i.style.display = 'none';
i.onload = function() { 
    Accounts.callLoginMethod({
        methodArguments: [{ cas: { credentialToken } }],
    });
};
i.src = `${ login_url }${ delim }service=${ appUrl }`;
document.body.appendChild(i);

@mangojumbo

임베디드 채팅을 기본 채널이 아닌 로켓 채팅 홈 페이지에서 열리도록 설정할 수 있을까요?

몇 주 안에 이 부분을 조사해 보겠습니다. 제 자신을 상기시키기 위해 Github 이슈를 열어 두겠습니다.

[volanar]

@RGJ

어떤 “오래된 채팅”을 말씀하시는 건가요? 이건 Discourse 기능보다는 Rocket.Chat 기능처럼 들리는데? 아니면 제가 잘못 이해하고 있는 건가요?

phpfox에는 네이티브 채팅의 모든 오래된 메시지를 rocket.chat(ChatPlus)으로 이전하는 기능이 있습니다. Discourse에서도 이렇게 해서 rocket.chat만 채팅으로 사용할 수 있도록 하는 것이 가능한가요? 그러면 모든 오래된 메시지가 사라지지 않고, 이미 많은 메시지가 있는 오래된 포럼에서도 이 플러그인을 사용할 수 있을 것입니다.

[RGJ (Richard - Communiteq)]

Discourse에는 네이티브 채팅 기능이 없으므로, 이러한 메시지는 어디서 온 것일까요?
또한, 채팅(포럼과 달리)의 핵심 아이디어는 채팅 메시지가 더 휘발성(ephemeral)이 강하다는 점입니다.

[volanar]

제가 말하는 건 개인 메시지예요.

[RGJ (Richard - Communiteq)]

아, 그렇군요. 그렇다면, 아니요.
개인 메시지(PM)를 비활성화하더라도 Rocket.Chat 플러그인을 활성화하면 이 기능이 여전히 사용 가능하므로, 이것이 실제로 문제가 되는지 확실하지 않습니다:

모든 이전 메시지는 삭제되지 않으며, 이 플러그인은 이미 많은 메시지가 있는 기존 포럼에서도 사용할 수 있습니다

[mangojumbo (Luca)]

@RGJ

이 스크립트를 Rocket.Chat에서 “로그아웃된 사용자를 위한 사용자 정의 스크립트”로 설정하세요 (2번째 줄에서 호스트 이름을 포럼 이름으로 교체하는 것을 확인하세요). 참고: 최근에 이 부분을 테스트해 보지 않았습니다. 작동하지 않을 경우 도움을 드릴 수 있을지 확신할 수 없습니다.

매우 유용한 답변을 주셔서 정말 감사합니다.
이전에 게시하신 스크립트를 여기에서 본 적이 있지만, CAS 인증에만 유효하고 SSO에는 적용되지 않는다고 생각했습니다. 시도해 보고 브라우저가 숨겨진 창을 차단하지 않는지, 즉 브라우저가 숨겨진 창을 종료하지는 않는지 확인해 보겠습니다.

@RGJ

몇 주 후에 그 문제를 살펴볼 예정입니다. 제게 상기시키기 위해 Github 이슈를 열어 두겠습니다.

정말 감사합니다! 제 생각에 기본값이 홈 페이지뿐 아니라 임베디드 채팅 창에서도 적용될 수 있다면 매우 흥미로운 기능이 될 것 같습니다. 자원을 확보하여 시간을 할애해 주실 경우, 결국 구현되는 모습을 기대하고 있습니다. 이 옵션을 추가하는 것을 검토해 주셔서 감사합니다.

[volanar]

답변 감사합니다. rocket.chat 대신 채팅에 mattermost나 MongooseIM을 사용할 수 있을까요? Mattermost는 golang으로 작성되어 자원을 덜 소모하고 확장성이 더 좋습니다. 아니면 rocket.chat만 가능한가요?

[RGJ (Richard - Communiteq)]

@volanar

Rocket.Chat 대신 Mattermost 또는 MongooseIM을 채팅으로 사용할 수 있을까요?

아니요, 이것은 Discourse용 Rocket.Chat 플러그인입니다…

@mangojumbo

SSO용이 아니라 CAS 인증에 대한 것입니다

이 플러그인은 CAS 2.0 프로토콜을 사용하여 SSO 기능을 구현합니다.

[valsha (KingPin)]

채팅을 포럼에 맞게 다시 디자인할 수 있을까요? CSS로 이 작업을 할 수 있을까요? 감사합니다.

[RGJ (Richard - Communiteq)]

이 답변이 궁금증을 해결해 드릴까요? https://developer.rocket.chat/guides/developer/ui-and-theming