sm 기술 블로그

웹소캣은 양방향 통신을 제공하여 예를들어 유저 1이 메세지를 보내면 유저 2에게 실시간으로 도착하고 반대로 유저 2가 유저 1에게 메시지를 보내면 실시간으로 도착하도록 하는 프로토콜이다. - 본 방법은 웹 소캣을 이해하기 위한 방법으로 가공없이 프로젝트에 바로 적용이 불가능 하다. 1. Config import org.springframework.context.annotation.Configuration; import org.springframework.messaging.simp.config.MessageBrokerRegistry; import org.springframework.web.socket.config.annotation.EnableWebSocketMessageBroker; import org...

로그인을 하면 JWT를 받도록 구현했었다. https://smhope.tistory.com/519 [스프링부트] JWT(Json Web Token) - 코드 https://smhope.tistory.com/517 [스프링 부트] JWT(Json Web Token)란? JWT(Json Web Token) : 두 개체에서 JSON객체를 사용하여 정보를 안정성 있게 전달해주는 인증 방식이다. jwt는 다음과 같은 구성을 지니고.. smhope.tistory.com 그러면 JWT를 헤더에 담아서 보낼때는 어떻게 할까? 바로 코드로 살펴 보겠다. import React, { useState } from "react"; import axios from "axios"; const Talk = async () => {..

WebSocket 하나의 TCP 연결로 양방향 통신을 제공하는 프로토콜로 한번 연결을 맺은 뒤 유지된다. STOMP Simple Text Orienteated Messaging Protocol의 약자로, 중개 서버를 통해서 클라이언트간에 비동기적 메시지를 전송하기 위한 프로토콜이다. stomp는 pub-sub 방식이다. 하나의 채널을 클라이언트가 구독(Subscribe)하면 구독 중인 모든 클라이언트에게 메시지를 발행(Publish)한다. 다음과 같이 발신자와 구독자가 있다. websocket으로만 통신을 하면 다음과 같은 방향을 지닌다. 다시말해 서버를 지나지 않고 바로 구독자에게 메시지를 보낸다. 그렇게 되면 연결이 끊어질때 메시지가 사라지는 경우가 있다. 여기에 STOMP를 얹는다면, 서버를 지나기..

리액트를 이용하여 프론트를 제작할 때 우리는 로그인한 상태에서만 보여주고 싶은 페이지가 있을 것이다. 이때 PrivateRoute를 통해 문제를 해결할 수 있다. App import "./App.css"; import MainPage from "./Router/MainPage.jsx"; import MessengerPage from "./Router/Messenger.jsx"; import { BrowserRouter as Router, Routes, Route } from "react-router-dom"; import PrivateRoute from "./Router/PrivateRoute.jsx"; function App() { const access = localStorage.getItem("To..