간단한 실시간 알림

We will use Vue.js + FastAPI + Pusher

모든 현대 웹 응용 프로그램은 실시간 알림과 떨어질 수 없다는 사실을 받아들여야 한다.만약 당신의 쿨링 서비스가 아직 그것들이 없다면, 그것은 99퍼센트의 가능성이 당신의 쌓인 업무에 존재할 것이다.

Today, speed of delivery is the level of quality.

다시 말하면, 의심할 여지없이 또 다른 문제가 있다. 어때?

목표 구조

우리는 이런 물건을 원한다.이 전자 상거래 예시의 세부 사항을 간략하게 토론해 봅시다.

고객 온라인 스토어와 관리자를 위한 CRM 등 두 가지 포털이 있습니다.

우리의 백엔드는 마이크로 서비스 구조를 가지고 서비스 간 통신을 위한 메시지 버스

를 가지고 있다

우리는 백엔드에 많은 서비스를 가지고 있지만 이 예에서 두 가지만 중요하다. 주문과 사건이다.

백엔드 서비스는 Cobol에서 Go까지 다양한 언어로 작성되었지만 사건에 대해 우리는 간단하고 합리적인 것이 필요하다. 예를 들어Python

우리는 실시간 알림의 복잡성을 처리하기 위해 Pusher 같은 무료 SaaS를 원한다. (우리는 처음부터 너무 욕심이 많아서 웹소켓을 사용하기도 귀찮았다.)

우리는 반드시 한 그룹의 매니저에게 같은 통지를 보낼 수 있어야 한다(고객을 위해 싸우게 하라!)

민감한 사용자 정보가 존재할 수 있기 때문에 프라이버시가 필요하다고 통지합니다.

개념 증명

개념을 증명하기 위해 우리는 모든 것을 더욱 간소화할 수 있다.

이벤트 서비스에 메시지가 어떻게 나타나는지 상관하지 않습니다. - 간단한 수동 스크립트 하나로 충분합니다

저희는 이벤트 인증 호출을 위해 복잡한 인증/권한을 만들지 않습니다. 로컬에서만 테스트를 진행하기 때문입니다

전면에 화려한 UI가 없고 PoC

에게는 간단한 텍스트 알림이 좋습니다.

소프트웨어 서비스

Pusher Channels가 달린 추진기는 우리의 수요에 매우 적합한 것 같다.그것은 최대 100개의 연결, 매일 20만 개의 메시지, SSL 보호, 무한 채널, 99.997%의 API 정상 운행 시간을 제공하는 아낌없는 무료 시작 계획을 제공했다.동기화와 비동기화 코드에 사용되는 백엔드가 있는 아주 좋은 Pusher Channels Python SDK도 있다.마지막으로 가장 중요하지 않은 것은 우리가 사랑하는 GitHub가 그것을 사용했다는 것이다.

Pusher also provides the Beams platform for mobile push messages (web is in beta at the moment). If you need to support such kind of notifications, it seems like a great tool to try. Though, you need to be warned that at this moment Python SDK for Beams doesn’t provide support for async code. It doesn’t seem like a big problem as Beams API is pretty simple, but it will take some efforts to integrate.

다음 단락의 코드에 대해, 우리는 일부 Pusher 채널 환경 변수를 사용할 것이다. 이 변수들은 Pusher Dashboard 에서 만든 응용 프로그램의 App Key 부분에서 찾을 수 있다.

CRM 포털

코드를 작성하기 시작합시다!CRM 포털에는 가장 간단한 Vue 응용 프로그램을 포함하는 HTML 페이지가 하나만 포함됩니다.

보시다시피 코드는 매우 간단합니다.사용자 정의 인증 노드가 있는 Pusher 실례를 만들고 개인 채널 foobar에 구독합니다.만약 우리가 지금 페이지를 열면 인증이 실패할 것입니다. 이벤트를 받을 수 없습니다.이 문제를 해결하기 위해 이벤트 서비스를 실현합시다

활동 서비스

우리의 서비스는 다음과 같은 요구가 있을 것이다

pusher              # Pusher Channels SDK
aiohttp             # Async HTTP client for Pusher Backend
fastapi             # Fast and Modern API Framework
uvicorn             # ASGI server to run our API
python-multipart    # Support for Forms in FastAPI
python-dotenv       # Loading of variables from .env

Pusher 클라이언트의 초기화를 시작합니다:

로컬 개발에 대해 우리는 모든 출처의CORSMiddleware(생산사용제한!)를 사용해야 합니다.pusher\uauth의 실현은 Pusher Authentication Specification에 근거하여 이루어진 것이다.이제 API를 실행할 수 있습니다

uvicorn api:app --reload
INFO:     Uvicorn running on http://127.0.0.1:8000 (Press CTRL+C to quit)
INFO:     Started reloader process [83155] using statreload
INFO:     Started server process [83157]
INFO:     Waiting for application startup.
INFO:     Application startup complete.

우리는 지금 CRM 포털을 열 수 있습니다. 인증이 성공할 것입니다.이제 우리는 사건 생성에 한 가지만 남았다.우리는 다음과 같은 간단한 스크립트를 작성할 것이다.

포털 사이트에서 통지를 받았는지 전화해 봅시다.이것은:

만약 우리가 같은 CRM 포털로 몇 개의 옵션을 열면, 우리는 모든 옵션에서 "hello world"메시지를 받을 수 있습니다

이 개념이 방금 성공적으로 증명되었다🥳! 이것은 사용자가 사용할 저장소입니다