프런트와 Pub/Sub연결하기 문의

Azure Native로 나만의 GPT 만들기

프론트와 Pub/Sub 연결하기

해결된 질문

작성

안녕하세요. 좋은 강의 잘 듣고 있습니다.

프런트와 Pub/Sub연결하기 강의를 듣고 있는데 아래와 같은 문제가 발생하였습니다. 시간 되실 때 확인해 주시면 감사하겠습니다.

빠른 시작
WebSocket API로 서비스에 연결하고 Pub/Sub 시작 -> 2개 새탭 열고 각 url 입력 후 메세지 상호작용 확인.
front 소스 코드 적용 후 아래 이미지와 같이 정상적 연결 성공 뜸.
front페이지 새로 고침 이 후 url 입력 한 창에서 메세지 입력하여도 front페이지개발자 도구의 console에서는 변화가 없음. data가 있는 json 메세지를 받아야 하는데 변화가 없네요.

유료강의로 상용화 가능한 azure기반 chatbot강의도 해주시면 감사하겠습니다.

답변 2

지식공유자

안녕하세요! 답변이 늦어 죄송합니다 ㅠㅠ

제가 예상하는 문제점은 다음과 같습니다.

hub가 한국어인 경우, 메세지 전송에 실패할 수 있습니다.
Azure Portal에서 생성하는 웹소켓 연결 URL의 경우, 유효기간이 존재하여 해당 유효기간을 넘은 경우 URL이 동작하지 않을 수 있습니다.

이 이외의 경우 말씀주신 내용으로는 디버깅이 어려워 보입니다 ㅠㅠ

아직 해결 못하셨다면, 프론트 코드 전문과 Azure Portal 리소스의 웹소켓 클라이언트 URL 생성기에서 "토큰 수명(분)" 옵션을 "1440분" 으로 세팅한 연결 URL을 wjdehdgud12346@gmail.com 제 메일로 보내주시면 확인드리겠습니다.

다시 한번 답변이 늦어 죄송합니다.

질문자

VS코드에서는 "group1" 소문자로 입력하였고, azure pubsub에서는 "Group1"으로 설정하여 메세지 전달이 안되었던 경우였습니다. 영상을 찬찬히 다시 보면서 해결하였습니다. 친절한 답변에 감사드립니다.

지식공유자

해결하셨다니 다행입니다!!

남은 강의들도 화이팅입니다!

안녕하세요, 인프런 AI 인턴입니다.
문의 주신 내용과 관련하여 ‘프런트와 Pub/Sub연결하기’ 문제 해결을 위한 몇 가지 점을 확인해야 할 것 같습니다.

WebSocket 연결 후 정상적으로 메시지를 주고받을 수 있는지 확인하기 위해, 서버와 프론트에서 사용된 WebSocket URL이 정확히 일치하는지 확인해 보세요. URL에 오타가 없는지, 필요하다면 프로토콜(ws:// 또는 wss://)이 올바르게 설정되었는지 검토해 주세요.
프론트 페이지에서 WebSocket 이벤트 핸들러(예: onmessage)가 올바르게 설정되어 있는지 확인해 보세요. 메시지 수신 로직이 이벤트 핸들러 내부에 올바르게 구현되어 있는지 점검해야 합니다.
개발자 도구의 Console 탭에서 보이는 ‘undefined’ 메시지와 관련하여, 정의되지 않은 변수나 함수를 참조하는 곳이 없는지 확인해 보세요. 해당 메시지가 발생하는 코드 부분을 찾아 정확한 값을 받아올 수 있도록 수정이 필요할 수 있습니다.
이미지에 나온 ‘front.html’ 파일의 42번과 51번 라인에서 발생한 로그를 바탕으로, 해당 라인의 코드가 올바르게 WebSocket 메시지를 처리하고 있는지 검토해 보세요. 필요한 경우, console.log를 사용하여 메시지가 올바르게 도착하는지, 이벤트 핸들러가 올바르게 작동하는지 등을 추가로 확인할 수 있습니다.

마지막으로, 유료 강의로 상용화 가능한 Azure 기반 chatbot 강의에 대한 관심을 가져주셔서 감사합니다. 해당 주제에 대한 강의 개설 요청은 인프런의 ‘수강 전 문의 게시판’이나 홈페이지 내 ‘문의하기’를 통해 직접 제안해 보시는 것도 좋은 방법입니다.

문제가 계속되면 추가적인 질문을 주시거나 해당 강의의 지식공유자에게 직접 문의해 보시길 권장드립니다.
항상 도움을 드리기 위해 최선을 다하겠습니다.

인프런 커뮤니티 질문&답변