chat.io

chat.io

Node.js, Express, Mongoose, Socket.io, Passport 및 Redis를 사용하여 구축된 실시간 채팅 애플리케이션입니다.

색인

• 데모
• 특징
• 설치
• 작동 방식
• 지원하다
• 기여하다
• 특허

데모

데모 확인

특징

• Express를 애플리케이션 프레임워크로 사용합니다.
• express-session 패키지를 사용하여 세션을 관리합니다.
• Passport를 사용하여 사용자 이름과 비밀번호를 통해 인증합니다.
• 비밀번호는 bcrypt-nodejs 패키지를 사용하여 해시됩니다.
• Passport를 사용하여 Facebook 및 Twitter를 통한 소셜 인증.
• Socket.io를 사용하여 클라이언트와 서버 간의 실시간 통신.
• 데이터 저장 및 쿼리를 위해 MongoDB, Mongoose 및 MongoLab(mLab)을 사용합니다.
• connect-mongo를 사용하여 MongoDB에 세션을 저장합니다. MongoDB 기반 세션 저장소.
• Redis를 Socket.io용 어댑터로 사용합니다.
• Winston을 사용하여 오류 및 예외 로깅

설치

로컬로 실행

Node.js와 npm이 설치되어 있는지 확인하세요.

1. 저장소 복제 또는 다운로드

   chat.io">

    $ git clone https://github.com/OmarElGabry/chat.io.git
   $ cd chat.io
   

2. 종속성 설치

    $ npm install
   

3. 자격 증명을 사용하여 app/config/config.json 의 구성 파일을 편집합니다(설정 구성 참조).

4. Redis를 다운로드하고 설치합니다.

5. Redis 서버 실행(관리자 권한으로)

    $ redis-server
   

6. 애플리케이션 시작

    $ npm start
   

이제 앱이 localhost:3000에서 실행되어야 합니다.

Heroku에 배포

Heroku Toolbelt가 설치되어 있는지 확인하세요.

1. 새로운 Heroku 애플리케이션을 생성하고 채팅 애플리케이션을 Git 원격 저장소에 푸시하세요.

    $ heroku create
   $ git push heroku master
   

   또는

2. 이제 Heroku에서 구성 변수를 설정해야 합니다.

   1. 설정 -> 구성 변수 표시로 이동합니다.
   2. 구성 변수를 추가합니다. 필요한 모든 변수는 app/config/index.js 안에 있습니다. 일반적으로 다음은 할당해야 하는 구성 변수입니다: { dbURI, sessionSecret, facebookClientID, facebookClientSecret, twitterConsumerKey, twitterConsumerSecret } (설정 구성 참조).

3. 마지막 단계는 Heroku에 Redis를 애드온으로 추가하는 것입니다.

   1. 리소스 -> 추가 기능으로 이동하세요.
   2. Heroku Redis를 선택하세요.

   추가 기능이 무료인 경우에도 결제 계정을 설정해야 합니다.

4. 브라우저에서 채팅 애플리케이션을 엽니다.

    $ heroku open
   

작동 방식

설정 구성

프로덕션 구성은 Heroku의 환경 변수에서 할당되고 개발 구성은 app/config/config.json 파일에 있습니다.

몽고DB와 몽고랩

MongoLab에서 데이터베이스를 생성한 다음 데이터베이스 사용자를 생성하고 MongoDB URI 가져와서 dbURI 에 할당해야 합니다.

페이스북 & 트위터

사용자가 애플리케이션에 대한 액세스 권한을 부여하고 소셜 계정을 사용하여 로그인할 수 있는 토큰을 얻으려면 Facebook과 Twitter 모두에 새 애플리케이션을 등록해야 합니다.

Facebook에 앱 등록하기

1. Facebook 개발자로 이동
2. 새 앱을 추가하고 필수 정보를 입력합니다.
3. App ID , App Secret 받으세요.
4. 제품 추가 -> Facebook 로그인 -> 유효한 OAuth 리디렉션 URI로 이동하세요.
5. 유효한 콜백 URI 추가
6. 앱 심사 -> 애플리케이션을 공개로 설정하세요.

이제 App ID facebookClientID 에 할당하고 App Secret facebookClientSecret 에 할당할 수 있습니다.

트위터에 앱 등록하기

1. 트위터 앱으로 이동
2. 새 앱을 만들고 필수 정보를 입력하세요.
3. 웹사이트 및 콜백 URL 추가
4. Consumer Key , Consumer Secret )을 받으세요.

이제 Consumer Key twitterConsumerKey 에 할당하고 Consumer Secret twitterConsumerSecret 에 할당할 수 있습니다.

콜백 URL

• 로컬 호스트를 다시 가리킬 수 있습니다. http://localhost:3000/auth/facebook/callback

• Heroku에 배포하면 다음과 같은 모습이 됩니다. http://my-chat-app.herokuapp.com/auth/facebook/callback

세션

브라우저의 세션 ID가 무작위인지 확인하려면 세션에 무작위 문자열이 필요합니다. 해당 임의의 문자열은 브라우저에서 세션 ID를 암호화하는 데 사용됩니다. 이유는 무엇입니까? 세션 ID 추측을 방지합니다.

데이터 베이스

Mongoose는 MongoLab에서 호스팅하는 MongoDB와 상호작용하는 데 사용됩니다.

스키마

두 가지 스키마가 있습니다. 사용자 및 방.

각 사용자는 사용자 이름, 비밀번호, 소셜 ID 및 사진을 가지고 있습니다. 사용자가 사용자 이름과 비밀번호를 통해 로그인한 경우 소셜 ID는 null이어야 하며, 소셜 계정을 통해 로그인한 경우 비밀번호는 null이 됩니다.

각 방에는 제목과 연결 배열이 있습니다. 연결 배열의 각 항목은 고유 소켓을 통해 연결된 사용자를 나타냅니다. {userId + 소켓Id} 로 구성된 객체입니다. 둘 다 함께 독특합니다.

모델

각 모델은 Mongoose Model 객체를 래핑하고 일부 메서드를 재정의하고 제공합니다. 두 가지 모델이 있습니다. 사용자 및 룸.

세션

Express 애플리케이션의 세션은 express-session 패키지를 사용하여 가장 잘 관리됩니다. 세션 데이터는 컴퓨터에 로컬로 저장되지만 프로덕션 환경의 데이터베이스에는 저장됩니다. 로그아웃 시 세션 데이터가 삭제됩니다.

사용자 인증

사용자는 사용자 이름과 비밀번호를 사용하여 로그인하거나 소셜 계정을 통해 로그인할 수 있습니다. 사용자 인증은 Passport를 사용하여 수행됩니다. Passport에는 각 인증 방법을 구현하는 방법에 대한 광범위하고 단계별 문서가 있습니다.

소켓

클라이언트와 서버 사이에 활성 연결이 열려 클라이언트가 데이터를 보내고 받을 수 있습니다. 이를 통해 TCP 소켓을 사용한 실시간 통신이 가능해집니다. 이것은 Socket.io에 의해 가능해졌습니다.

클라이언트는 소켓(특정 네임스페이스에 할당될 수도 있음)을 통해 서버에 연결하는 것으로 시작됩니다. 연결이 성공하면 클라이언트와 서버는 이벤트를 내보내고 수신할 수 있습니다.

두 가지 네임스페이스가 사용됩니다. /rooms 및 /chatroom .

나무꾼

그리고 당연히 애플리케이션을 모니터링해야 합니다. Winston은 포착되지 않은 예외를 기록하고 포착할 수 있습니다. 모든 로그는 콘솔에 표시되며 debug.log 파일에 저장됩니다.

Heroku에서는 애플리케이션 대시보드 왼쪽 상단에 있는 More -> View Logs를 클릭하여 로그를 모니터링할 수 있습니다.

지원하다

나는 공부하는 동안 자유시간에 이 대본을 썼습니다. 유용하다고 생각하시면 널리 알려 프로젝트를 지원해 주세요.

기여하다

새로운 이슈를 생성하고 Github에 풀 요청을 보내 기여하거나 [email protected]으로 이메일을 보낼 수 있습니다.

특허

MIT 라이선스로 제작되었습니다.