플랫폼 | 버전 |
Electron | 13.1.5 이상 버전. |
Node.js | v14.2.0 |
통합 방법 | 적용 가능한 시나리오 |
DEMO 사용 | IM Demo에는 모든 채팅 기능이 포함되어 있으며 오픈 소스 코드를 제공합니다. 채팅 시나리오를 구현하려면 Demo를 사용하여 2차 개발을 진행할 수 있습니다. Demo에서 체험해 보십시오. |
자체 구현 | Demo가 UI 요구 사항을 충족하지 않는 경우 이 방법을 사용할 수 있습니다. |
git clone https://github.com/TencentCloud/tc-chat-demo-electron.git
// 프로젝트의 루트 디렉터리npm install// 렌더링 프로세스 디렉터리cd src/clientnpm install
// 프로젝트의 루트 디렉터리npm start
// mac 패키징npm run build:mac// windows 패키징npm run build:windows
src/app/main.js
와 렌더링 프로세스 디렉터리는 src/client
입니다. 실행 중 문제가 발생하면 먼저 문제 해결을 위한 FAQ를 참고하십시오.npm install im_electron_sdk
TimMain
에 sdkAppID
를 전달합니다.// 메인 프로세스const TimMain = require('im_electron_sdk/dist/main')const sdkappid = 0;// IM 콘솔에서 신청할 수 있습니다const tim = new TimMain({sdkappid:sdkappid})
TIMInit
를 호출하여 SDK를 초기화합니다.//렌더링 프로세스const TimRender = require('im_electron_sdk/dist/render')const timRender = new TimRender();// 컴포넌트 초기화timRender.TIMInit()
timRender.TIMLogin
메소드를 호출하여 테스트 사용자로 로그인합니다.
반환된 code
가 0이면 로그인에 성공한 것입니다.const TimRender = require('im_electron_sdk/dist/render')const timRender = new TimRender();let {code} = await timRender.TIMLogin({userID:"userID",userSig:"userSig" // userSig 생성 참고})
UserSig
배포 방법은 UserSig
계산 코드를 서버에 통합하고 APP 지향 API를 제공하는 것입니다. UserSig
가 필요한 경우 APP은 동적 UserSig
에 대한 요청을 비즈니스 서버에 보낼 수 있습니다. 자세한 내용은 Generating UserSig를 참고하십시오.code
가 0이면 메시지가 성공적으로 전송된 것입니다.
코드 예시:const TimRender = require('im_electron_sdk/dist/render')const timRender = new TimRender();let param:MsgSendMessageParamsV2 = { // param of TIMMsgSendMessageconv_id: "conv_id",conv_type: 1,params: {message_elem_array: [{elem_type: 1,text_elem_content:'Hello Tencent!',}],message_sender: "senderID",},callback: (data) => {}}let {code} = await timRender.TIMMsgSendMessageV2(param);
let param:getConvList = {userData:userData,}let data:commonResult<convInfo[]> = await timRenderInstance.TIMConvGetConvList(param)
let param:MsgGetMsgListParams = {conv_id: conv_id,conv_type: conv_type,params: {msg_getmsglist_param_last_msg: msg,msg_getmsglist_param_count: 20,msg_getmsglist_param_is_remble: true,},user_data: user_data}let msgList:commonResult<Json_value_msg[]> = await timRenderInstance.TIMMsgGetMsgList(param);
let param : TIMRecvNewMsgCallbackParams = {callback: (...args)=>{},user_data: user_data}timRenderInstance.TIMAddRecvNewMsgCallback(param);
npm ERR! gyp ERR! stack TypeError: Cannot assign to read only property 'cflags' of object '#<Object>'
오류가 보고되면 어떻게 해야 합니까?gypgyp ERR!ERR
오류를 해결하는 방법은 무엇입니까?npm install
실행 시 npm ERR! Fix the upstream dependency conflict, or retry
오류가 보고되면 어떻게 해야 하나요?npm install --force
npm run start
실행 시 Error: error:0308010C:digital envelope routines::unsupported
오류가 보고되면 어떻게 해야 하나요?npm run start
를 실행할 때 화면이 흰색으로 바뀌면 어떻게 해야 하나요?npm run start
를 실행하면 흰색 화면이 나오는 이유는 아직 렌더링 프로세스의 코드가 build 완료되지 않았고, 메인 프로세스가 오픈한 포트 3000번이 빈 페이지이기 때문입니다. 렌더링 프로세스의 코드 build 완료 후 창을 새로고침하면 문제가 해결될 수 있습니다. 또는 cd src/client && npm run dev:react
, npm run dev:electron
을 실행하여 렌더링 프로세스와 메인 프로세스를 각각 시작합니다.vue-cli-plugin-electron-builder
로 빌드된 프로젝트에서 native modules
을 어떻게 사용합니까?vue-cli-plugin-electron-builder
로 빌드된 프로젝트에서 native modules
사용과 관련된 문제는 No native build was found for platform = xxx를 참고하십시오.webpack
으로 빌드한 프로젝트에서 native modules
을 어떻게 사용하나요?Dynamic Linking Error
오류가 보고되면 어떻게 해야 합니까?extraFiles:[{"from": "./node_modules/im_electron_sdk/lib/","to": "./Resources","filter": ["**/*"]}]
문제 해결에 도움이 되었나요?