{"id":940,"date":"2024-04-18T20:18:37","date_gmt":"2024-04-18T12:18:37","guid":{"rendered":"https:\/\/gjweb.top\/?p=940"},"modified":"2024-04-21T13:23:32","modified_gmt":"2024-04-21T05:23:32","slug":"%e5%a4%a7%e5%89%8d%e7%ab%af%e7%94%a8%e6%88%b7%e8%a1%8c%e4%b8%ba%e5%9f%8b%e7%82%b9%e5%8f%8a%e7%ae%a1%e7%90%86%e7%ab%af%e8%af%95%e8%af%95%e6%8e%a8%e9%80%81%e6%96%b9%e6%a1%88","status":"publish","type":"post","link":"https:\/\/gjweb.top\/?p=940","title":{"rendered":"\u5927\u524d\u7aef\u7528\u6237\u884c\u4e3a\u57cb\u70b9\u53ca\u7ba1\u7406\u7aef\u5b9e\u65f6\u63a8\u9001\u65b9\u6848"},"content":{"rendered":"\n

\u573a\u666f: \u5728 toC \u9879\u76ee\u4e2d\u9762\u5411\u7528\u6237\u4f1a\u5c06\u5e94\u7528\u7684\u6ce8\u518c\u529f\u80fd\u66b4\u9732\u7ed9\u6e38\u5ba2,\u5f53\u6e38\u5ba2\u901a\u8fc7\u6ce8\u518c\u5165\u53e3\u7533\u8bf7\u67d0\u4e9b\u529f\u80fd\u65f6,\u9700\u8981\u5546\u52a1\u4eba\u5458\u7b2c\u4e00\u65f6\u95f4\u5bf9\u63a5\u5230\u6e38\u5ba2\u4fe1\u606f.<\/p>\n\n\n\n

\u6280\u672f\u70b9: \u670d\u52a1\u7aef\u53d1\u5e03\u8ba2\u9605\u6a21\u5f0f + SSE\u63a8\u9001<\/p>\n\n\n\n

\u6280\u672f\u6808: node Nest.js<\/p>\n\n\n\n

\u670d\u52a1\u7aef<\/p>\n\n\n\n

app.controller.js<\/code><\/p>\n\n\n\n

import { Controller, Get, Sse,Param, Query } from '@nestjs\/common';
import { AppService } from '.\/app.service';
import { Observable } from 'rxjs';
\u200b
@Controller()
export class AppController {
  constructor(private readonly appService: AppService) {}
\u200b
  @Get()
  getHello(@Query() data) {
    return this.appService.getHello(data);
  }
\u200b
  @Sse('\/channel')
  sse():Observable<MessageEvent>{
    return this.appService.sseChannel()
  }
}
\u200b<\/code><\/pre>\n\n\n\n
app.service.ts<\/code><\/p>\n\n\n\n
import { Injectable } from '@nestjs\/common';
import { Observable } from 'rxjs';
import * as EventEmitter from 'events';
\/*eventHub*\/
const myEmitter = new EventEmitter();
\u200b
@Injectable()
export class AppService {
  getHello(data:any) {
    myEmitter.emit('send', data);
    return {code:200,message:\"\u8bf7\u6c42\u6210\u529f\"}
  }
    \/**sse\u63a8\u9001 *\/
    sseChannel(){
      return new Observable<any>((observer) => {
        myEmitter.on('send', (data: any) => {
          observer.next({ data: data });
        });
      });
    }
}<\/code><\/pre>\n\n\n\n
\u73b0\u5728\u6d4b\u8bd5\u4e00\u4e0b\u63a5\u53e3<\/p>\n\n\n\n
\"\"<\/div><\/figure>\n\n\n\n
\n\n\n\n
web\u7aef<\/h2>\n\n\n\n
\nimport React, { useEffect, useMemo } from 'react';\nimport { Button, Divider, notification, Space } from 'antd';\nimport type { NotificationArgsProps } from 'antd';\n\n\n\n\nconst HomePage:React.FC<any> = ()=>{\n  const [api, contextHolder] = notification.useNotification();\n  const openNotification = (data:any) => {\n    const obj  = JSON.parse(data);\n    const key = `open${Date.now()}`;\n    const btn = (\n      <Space>\n        <Button type=\"link\" size=\"small\" onClick={() => api.destroy()}>\n          \u5df2\u8bfb\n        <\/Button>\n      <\/Space>\n    );\n    api.open({\n      message: '\u6709\u65b0\u6e38\u5ba2',\n      description:\n        `\u7528\u6237\u540d\u79f0\uff1a${obj.userName}`,\n      btn,\n      key,\n      onClose: close,\n    });\n  };\n\n  \/*\u8fde\u63a5\u540e\u7aefsse\u63a5\u53e3*\/\n  const sse = new EventSource('\/sseApi\/channel');\n  sse.onmessage = function (event) {\n    openNotification(event.data)\n  }\n\n  return (\n    <>\n    {contextHolder}\n    <Button type=\"primary\" onClick={openNotification}>\n      web\u7aef\u5b9e\u65f6\u63a8\u9001\n    <\/Button>\n  <\/>\n  );\n}\n\nexport default HomePage<\/code><\/pre>\n\n\n\n
\u6548\u679c\u5982\u4e0b<\/p>\n\n\n\n
\"\"<\/div><\/figure>\n","protected":false},"excerpt":{"rendered":"
\u573a\u666f: \u5728 toC \u9879\u76ee\u4e2d\u9762\u5411\u7528\u6237\u4f1a\u5c06\u5e94\u7528\u7684\u6ce8\u518c\u529f\u80fd\u66b4\u9732\u7ed9\u6e38\u5ba2,\u5f53\u6e38\u5ba2\u901a\u8fc7\u6ce8\u518c\u5165\u53e3\u7533\u8bf7\u67d0\u4e9b\u529f\u80fd\u65f6,\u9700\u8981\u5546\u52a1\u4eba\u5458 […]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[38],"tags":[],"class_list":["post-940","post","type-post","status-publish","format-standard","hentry","category-38"],"_links":{"self":[{"href":"https:\/\/gjweb.top\/index.php?rest_route=\/wp\/v2\/posts\/940","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/gjweb.top\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/gjweb.top\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/gjweb.top\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/gjweb.top\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=940"}],"version-history":[{"count":6,"href":"https:\/\/gjweb.top\/index.php?rest_route=\/wp\/v2\/posts\/940\/revisions"}],"predecessor-version":[{"id":956,"href":"https:\/\/gjweb.top\/index.php?rest_route=\/wp\/v2\/posts\/940\/revisions\/956"}],"wp:attachment":[{"href":"https:\/\/gjweb.top\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=940"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/gjweb.top\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=940"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/gjweb.top\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=940"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}