묻고 답해요
164만명의 커뮤니티!! 함께 토론해봐요.
인프런 TOP Writers
-
미해결웹소켓/STOMP 채팅서비스(spring, vue, redis)
수업자료 한번에 다운받기
수업자료 한번에 다운 받고 싶은데요. 압축파일로 올려주실수 있나요?
-
미해결웹소켓/STOMP 채팅서비스(spring, vue, redis)
웹소켓,stomp 개념 질문 !
바로 이전 강의에서는 순수 웹소켓에서는 토큰인증 구현안하고 기능만 돌아가도록 했음 최종강의 목표는 (stomp에서 고도화 하는 것이므로)물론 할라면 할 수있음예시): 쿼리 파라미터 방식으로 토큰을 포함한 WebSocket 연결 그리고 WebSocket 자체는 HTTP 헤더를 설정하는 기능을 제공하지 않기 때문에 순수 웹소켓에서는 헤더에 인증 토큰을 추가할 수 없음. ............................................................................이번강의에서는 토큰인증 구현할때SockJS와 STOMP 같은 라이브러리를 사용하면 HTTP 헤더에 인증 정보를 포함시킬 수 있기에 헤더에 인증정보 포함 시켜 서버로 넘기는 식으로 구현 !그리고 뷰 메인에서 axios.interceptors.request.use( config => { const token= localStorage.getItem("token"); if(token){ config.headers['Authorization']=Bearer ${token} } return config; }, error => { return Promise.reject(error); })이런 식으로 추가 하는 것은 HTTP 요청에 한에서 이므로 별도임 stomp의 connection 은 HTTP 엔드포인트긴하지만 HTTP 요청이 아닌 ws 요청임 따라서 뷰 메인에서 가로채서 요청에 인증 정보 넣지 않음 따라서 connec t할때 직접 헤더에 넣어야 함 ..........................................................................................으로 이해했는데 맞을까요 ? 혹시 틀린 개념이나 빠진 부분이 있으면 알려주시면 감사하겠습니다!
-
미해결Vue 3 시작하기
로컬이 안뜹니다..
로컬 화면이 강사님과 동일하게 뜨지 않는데.. 어떻게 하면 될까요..?
-
미해결[최신] Vue 강의 끝판왕 : Nuxt 3 완벽 마스터
eslint prettier 설정 오류
강의 교안대로 따라 설정했는데.. 문서 작성만하면 이런 빨간 오류들이 뜹니다,,
-
미해결웹소켓/STOMP 채팅서비스(spring, vue, redis)
Stomp과 웹소켓 프로토콜
connect할 때 웹소켓은 ws프로토콜 stomp는 http프로토콜을 사용하는건가요? 연결 후 메시지를 주고 받을 때 웹소켓은 ws프로토콜 stomp도 ws프로토콜을 사용하는건가요?
-
해결됨웹소켓/STOMP 채팅서비스(spring, vue, redis)
질문있습니다!!
container.addMessageListener(listenerAdapter, new PatternTopic("chat")); 해당 코드에서 chat은 redis에서 저장될 key 값인가요??
-
해결됨웹소켓/STOMP 채팅서비스(spring, vue, redis)
질문있습니다
채팅과 관련된 API를 설계할 때 보면 Controller 레이어에서 @AuthenticationPrincipal 파라미터를 사용해서 사용자의 정보를 가지고 오는 것이 아닌 Service 레이어에서 SecurityContextHoler를 통해 사용자의 정보를 가지고 오는데 이는 웹소켓 같은 경우에는 Header에 JWT 토큰 정보를 담을 수 없기 때문이다라고 이해하면 될까요??
-
해결됨웹소켓/STOMP 채팅서비스(spring, vue, redis)
프론트코드 받을 수 있나요
정말 강의잘 듣고있습니다 다름이아니라 빠르게 서버만 진행하고싶은데 프론트 코드저장소가있으시다면 받을 수 있나요? 아니면은 스톰프를 테스트할 수 있는 팁이있나요?
-
미해결웹소켓/STOMP 채팅서비스(spring, vue, redis)
DISCONNECT 질문이 있습니다.
안녕하세요, 일단 양질의 강의를 올려주셔서 감사하다는 말씀을 드립니다.다름이 아니라, 화면을 그리지 않고 단순히 백엔드 소스를 구현하면서 강의를 진행하고있습니다.https://jiangxy.github.io/websocket-debug-tool/라는 사이트에서 Connect(STOMP), pub/sub을 테스트 중입니다.그 과정에서 DISCONNECT를 진행할 경우, 아래와 같은 에러 메세지가 발생합니다. ava.lang.IllegalStateException: Message will not be sent because the WebSocket session has been closed at org.apache.tomcat.websocket.WsRemoteEndpointImplBase.writeMessagePart(WsRemoteEndpointImplBase.java:455) at org.apache.tomcat.websocket.WsRemoteEndpointImplBase.sendMessageBlockInternal(WsRemoteEndpointImplBase.java:313) at org.apache.tomcat.websocket.WsRemoteEndpointImplBase.sendMessageBlock(WsRemoteEndpointImplBase.java:266) at org.apache.tomcat.websocket.WsRemoteEndpointImplBase.sendMessageBlock(WsRemoteEndpointImplBase.java:250) at org.apache.tomcat.websocket.WsRemoteEndpointImplBase.sendPartialString(WsRemoteEndpointImplBase.java:223) at org.apache.tomcat.websocket.WsRemoteEndpointBasic.sendText(WsRemoteEndpointBasic.java:48) at org.springframework.web.socket.adapter.standard.StandardWebSocketSession.sendTextMessage(StandardWebSocketSession.java:217) at org.springframework.web.socket.adapter.AbstractWebSocketSession.sendMessage(AbstractWebSocketSession.java:108) at org.springframework.web.socket.handler.ConcurrentWebSocketSessionDecorator.tryFlushMessageBuffer(ConcurrentWebSocketSessionDecorator.java:190) at org.springframework.web.socket.handler.ConcurrentWebSocketSessionDecorator.sendMessage(ConcurrentWebSocketSessionDecorator.java:163) at org.springframework.web.socket.messaging.StompSubProtocolHandler.sendToClient(StompSubProtocolHandler.java:529) at org.springframework.web.socket.messaging.StompSubProtocolHandler.handleMessageToClient(StompSubProtocolHandler.java:516) at org.springframework.web.socket.messaging.SubProtocolWebSocketHandler.handleMessage(SubProtocolWebSocketHandler.java:386) at org.springframework.messaging.support.ExecutorSubscribableChannel$SendTask.run(ExecutorSubscribableChannel.java:152) at org.springframework.scheduling.support.DelegatingErrorHandlingRunnable.run(DelegatingErrorHandlingRunnable.java:54) at java.base/java.util.concurrent.Executors$RunnableAdapter.call(Executors.java:572) at java.base/java.util.concurrent.FutureTask.run$$$capture(FutureTask.java:317) at java.base/java.util.concurrent.FutureTask.run(FutureTask.java) at java.base/java.util.concurrent.ScheduledThreadPoolExecutor$ScheduledFutureTask.run(ScheduledThreadPoolExecutor.java:304) at java.base/java.util.concurrent.ThreadPoolExecutor.runWorker(ThreadPoolExecutor.java:1144) at java.base/java.util.concurrent.ThreadPoolExecutor$Worker.run(ThreadPoolExecutor.java:642) at java.base/java.lang.Thread.run(Thread.java:1583)해당 문제를 해결하기 위해, 관련해서 자료를 검색해보았지만 해결하지 못해 질문을 드립니다.혹시 확인을 해보아야할 메소드나 검색 키워드를 알려주실 수 있을까요?이미지도 첨부드립니다.
-
해결됨웹소켓/STOMP 채팅서비스(spring, vue, redis)
소스파일
깃 또는 소스파일은 어디서 확인할 수 있죠?
-
해결됨웹소켓/STOMP 채팅서비스(spring, vue, redis)
쿼리, jpa 질문 있습니다.
16:00 초에 보면 채팅 메세지를 가져오는데 이때 멤버 정보도 같이 가져오는 것 같다고 보여지는데 findByRoomOrderByCreatedTimeAsc를 호출할때 쿼리가 어떻게 날아가는지 이해가 잘 안되서 질문드립니다. 메세지의 개수마다 멤버 테이블에 join해서 가져오는게 맞는걸까요?
-
해결됨웹소켓/STOMP 채팅서비스(spring, vue, redis)
erd 관련 질문있습니다.
participant를 복합키인 채팅방id와 회원아이디를 message에 1대다로 연결하는것과 회원과 채팅방의 pk를 가져와 메세지에 연결하는 방식의 차이 부분이 잘 이해가 안되서 두 방식의 차이와 성능의 차이가 있는지에 대해 조금 더 자세한 설명을 들을 수 있을까요?
-
미해결[최신] Vue 강의 끝판왕 : Nuxt 3 완벽 마스터
clearNuxtState() 사용 문의
<q-btn label="clear" @click="clearNuxtState()" />안녕하세요. Nuxt 상태관리 : useState() 강의를 듣던 중 그대로 코딩을 따라했는데요. clearNuxtState() 이 버튼을 생성하자 이 메서드에서 사용할수 없다고 빨간색으로 표시 되는데요. ERROR(vue-tsc) Property 'clearNuxtState' does not exist on type 'CreateComponentPublicInstanceWithMixins<ToResolvedProps<{}, {}>, { counter: Ref<number, number>; sameCounter: Ref<number, number>; }, {}, {}, {}, ComponentOptionsMixin, ... 19 more ..., {}>'. FILE /Users/Documents/workspace/onego-front/pages/about.vue:43:42 41 | </div> 42 | <div> > 43 | <q-btn label="clear" @click="clearNuxtState()" /> | ^^^^^^^^^^^^^^ 44 | </div> 45 | </div> 46 |[vue-tsc] Found 1 error. Watching for file changes. 이와 같이 에러가 나는데요..왜 나는지 도저히 모르겠네요.. 짐코딩님 repository에서 about 페이지 소스 그대로 복사해서 붙여놨는데도 해당부분에 빨간색이 나오더라고요 ㅠ
-
미해결[최신] Vue 강의 끝판왕 : Nuxt 3 완벽 마스터
nuxt 빌드 환경 질문드립니다!
안녕하세요, 짐코딩님!항상 좋은 강의 제공해 주셔서 감사합니다. 덕분에 많은 도움을 받고 있습니다! 😊 Nuxt 3를 빌드할 때 기본적으로 production 모드로 진행되는 것으로 알고 있는데요.이를 local, dev, prod 등의 환경 기준으로 변경하려면 어떤 방식으로 설정하면 좋을까요?감사합니다! 🙏
-
미해결[최신] Vue 강의 끝판왕 : Nuxt 3 완벽 마스터
피니아 persist 질문드립니다!
안녕하세요 짐코딩님,강의 잘 듣고 있습니다!강의 듣다가 궁금한게 있어서 질문드려요!피니아 persist 사용하면서 localStorage 또는 sessionStorage에 저장할 때 암호화해서 저장하는 방법이 있을까요?
-
미해결[최신] Vue 강의 끝판왕 : Nuxt 3 완벽 마스터
prefetching 질문
<template> <div> <q-page padding> <div class='text-center q-py-xl'> <div class='text-h4'> {{ $route.path }} </div> </div> </q-page> </div> </template> <scipt lang='ts'> //아래 문장을 추가해야 링크클릭 가능 export default { }; console.log('prefetching-1'); </scipt> <script setup lang="ts"> </script> <style scoped> </style> 일단 각 prefetching-1,2,3 vue파일에 script 부분에 export default를 선언해야 강의로드맵 클릭했을때 이동이 되는데 왜그런가요?? 강의교안에는 그런게 없어서 영상에는 이동이 잘 되는데 말이죠.. <NuxtLink v-slot="{ navigate }" custom to="/course/prefetching-1"> <q-item clickable @click="navigate()">Prefetching Test 1</q-item> </NuxtLink> <NuxtLink v-slot="{ navigate }" custom to="/course/prefetching-2"> <q-item clickable @click="navigate()">Prefetching Test 2</q-item> </NuxtLink> <NuxtLink v-slot="{ navigate }" custom to="/course/prefetching-3"> <q-item clickable @click="navigate()">Prefetching Test 3</q-item> </NuxtLink>Prefetching에서 NuxtLink tag 안에 custom을 제거하면 prefetching이 정상적으로 되고 custom을 입력하면 prefetching이 되지 않는 것을 console.log에서 확인하였어요.. 혹시 왜그런지 아실까요? source : https://github.com/nhs0912/onego-front/tree/routing
-
미해결[최신] Vue 강의 끝판왕 : Nuxt 3 완벽 마스터
[nuxt] [request error] [unhandled] [500] __QUASAR_SSR_SERVER__ is not defined
안녕하세요. nuxt까지는 설정을 하였는데요 .잘 안되서 공식문서에 있는 순서대로 터미널로 그냥 만들어봤는데요.npx nuxi@latest init <project-name>https://nuxt.com/modules/quasar여기까지 초기페이지가 잘 나왔어요. 그런데 quasar를 공식문서에 있는 것 처럼 설치 해보니깐# Using npmnpm install quasar @quasar/extras npx nuxi@latest module add quasar ERROR [nuxt] [request error] [unhandled] [500] __QUASAR_SSR_SERVER__ is not defined npm run dev 이후에 웹페이지 초기화면 새로 고침을 하면 이런 에러가 나오는데 혹시 어떤게 문제인지 알수 있나요?
-
미해결Vue 3 & Firebase 10 커뮤니티 만들기 풀스택 - "활용편" (with Pinia, Quasar, Tiptap, VueUse)
[공유] 잘동작하는 unplugin-vue-router 버전 관련
처음에 퀘이사 프로젝트를 생성하고, unplugin-vue-router가 동작하지 않아 적잖이 당황했습니다. 여러 테스트를 해본 결과... 다음과 같은 결과를 얻었습니다. 1/25일 기준, 최신 Vue/Vue Router 기준으로... "vue": "^3.5.0", "vue-router": "^4.5.0" unplugin-vue-router의 0.8.8까지만 호환되는 걸 확인했습니다. "unplugin-vue-router": "^0.8.8", 정확히, 0.9.0으로 하니까..chunk-NFXBJ25B.js?v=f99a8603:1268 Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'forEach')위의 오류가 나더군요... 덧) 강사님 최신 unplug-vue-router 호환이슈좀 해결해 주세요.. ~~ ^^
-
미해결Vue 3 & Firebase 10 커뮤니티 만들기 풀스택 - "활용편" (with Pinia, Quasar, Tiptap, VueUse)
route.meta? 에서 물음표 개념
안녕하세요~ 웹 레이아웃 구성 default.vue 파일의 코드 일부분 입니다.route.meta? 에서 ?물음표개념이 어떻게 될까요?지워도 작동해서 질문 드립니다.답변 주시면 감사하겠습니다. const pageContainerStyles = computed(() => ({ maxWidth: route.meta?.width || '1080px', margin: '0 auto', }));
-
미해결[최신] Vue 강의 끝판왕 : Nuxt 3 완벽 마스터
사진 오류
<img src="https://i.ibb.co/XbsPPmQ/image.png" />이 사진 주소 바뀐거같아요