Spring 검색 결과

7개 발견
  1. 미리보기
    2020.10.19 - mr.november11

    [spring.io] 레디스로 메시지 통신하기(코틀린 ver.)

  2. 미리보기
    2020.10.18 - mr.november11

    [spring.io] 스프링 JDBC를 활용하여 관계형 데이터베이스 연동하기(코틀린 ver.)

  3. 미리보기
    2020.10.17 - mr.november11

    [spring.io]RESTful 웹 서비스 호출하기(코틀린 ver.)

  4. 미리보기
    2020.10.17 - mr.november11

    [spring.io]RESTful 웹 서비스 만들기(코틀린 ver.)

  5. 미리보기
    2020.07.08 - mr.november11

    스프링 부트에서 도커 컨테이너 이미지 생성하기

  6. 미리보기
    2020.04.09 - mr.november11

    [React+Spring] 리액트, 스프링 부트로 웹소켓 구현하기

  7. 미리보기
    2020.04.03 - mr.november11

    메이븐(maven) 빌드 시 "Source option 5 is no longer supperted." 에러가 발생할 경우 해결 방법

# [spring.io] 레디스로 메시지 통신하기(코틀린 ver.)

#kotlin #spring

참고 사이트 : Getting Started | Messaging with Redis

레디스 서버 실행하기

spring.io 예제에서는 brew 를 사용하여 reds 서버를 설치하고 실행합니다.
이번 예제에서는 docker 를 사용하여 redis 를 실행합니다.
참고 사이트 : https://hub.docker.com/_/redis/

실행 명령어 : docker run —name some-redis -p 6379:6379 -d redis

Spring Initializr 로 시작하기

메이븐 기준으로 다음 의존성을 추가한 프로젝트를 생성합니다.

  • Spring Data Redis (Access+Driver)
<dependencies>
    <dependency>
        <groupId>org.springframework.boot</groupId>
        <artifactId>spring-boot-starter-data-redis</artifactId>
    </dependency>
    <dependency>
        <groupId>org.jetbrains.kotlin</groupId>
        <artifactId>kotlin-reflect</artifactId>
    </dependency>
    <dependency>
        <groupId>org.jetbrains.kotlin</groupId>
        <artifactId>kotlin-stdlib-jdk8</artifactId>
    </dependency>

    <dependency>
        <groupId>org.springframework.boot</groupId>
        <artifactId>spring-boot-starter-test</artifactId>
        <scope>test</scope>
        <exclusions>
            <exclusion>
                <groupId>org.junit.vintage</groupId>
                <artifactId>junit-vintage-engine</artifactId>
            </exclusion>
        </exclusions>
    </dependency>
</dependencies>

Receiver 클래스 생성하기

메시지를 받고 응답하는 Receiver 클래스를 생성합니다.
Receiver는 POJO로 메시지를 수신하는 메소드를 정의합니다.
예제에서는 메시지를 전달 받으면 receiveMessage 함수를 호출할 예정입니다.

class Receiver {
    val LOGGER = LoggerFactory.getLogger(Receiver::class.java)
    val counter = AtomicInteger()

    fun receiveMessage( message: String ) {
        LOGGER.info(“Received < $message >”);
        counter.incrementAndGet();
    }
}

리스너를 등록하고 메시지를 보내기

스프링 데이터 레디스는 레디스와 메시지를 주고받기 위한 모든 컴포넌트를 제공합니다.
- 커넥션 팩토리
- 메시지 리스너 컨테이너
- 레디스 템플릿
예제에서는 레디스 템플릿을 사용하여 메시지를 보내고 Receiver 메시지 리스너로 등록합니다.

@SpringBootApplication
class RedisApplication{

    val LOGGER = LoggerFactory.getLogger(RedisApplication::class.java)

    @Bean
    fun container(
            connectionFactory: RedisConnectionFactory,
            listernerAdapter: MessageListenerAdapter) : RedisMessageListenerContainer {

        val container = RedisMessageListenerContainer();
        container.setConnectionFactory(connectionFactory)
        container.addMessageListener(listernerAdapter, PatternTopic(“chat”))

        return container
    }

    @Bean
    fun listenerAdapter(receiver: Receiver) : MessageListenerAdapter {
        return MessageListenerAdapter(receiver, “receiveMessage”)
    }

    @Bean
    fun receiver() : Receiver {
        return Receiver()
    }

    @Bean
    fun template(connectionFactory: RedisConnectionFactory) : StringRedisTemplate {
        return StringRedisTemplate(connectionFactory)
    }

}

fun main(args: Array<String>) {

    val ctx = runApplication<RedisApplication>(*args)
    val template : StringRedisTemplate = ctx.getBean(StringRedisTemplate::class.java)

    val receiver : Receiver = ctx.getBean(Receiver::class.java)

    while(receiver.counter.toInt() == 0) {
        *println*(“Sending message…”);
        template.convertAndSend(“chat”, “Hello from Redis!”);
        Thread.sleep(500L);
    }
}

실행 결과

  .   ____          _            __ _ _
 /\\ / ___'_ __ _ _(_)_ __  __ _ \ \ \ \
( ( )\___ | '_ | '_| | '_ \/ _` | \ \ \ \
 \\/  ___)| |_)| | | | | || (_| |  ) ) ) )
  '  |____| .__|_| |_|_| |_\__, | / / / /
 =========|_|==============|___/=/_/_/_/
 :: Spring Boot ::        (v2.3.4.RELEASE)

INFO 61756 --- [           main] com.example.redis.RedisApplicationKt     : Starting RedisApplicationKt on C02XHD9VJG5J with PID 61756 (/Users/user/study/redis/target/classes started by in /Users/user/study/redis)
INFO 61756 --- [           main] com.example.redis.RedisApplicationKt     : No active profile set, falling back to default profiles: default
INFO 61756 --- [           main] .s.d.r.c.RepositoryConfigurationDelegate : Multiple Spring Data modules found, entering strict repository configuration mode!
INFO 61756 --- [           main] .s.d.r.c.RepositoryConfigurationDelegate : Bootstrapping Spring Data Redis repositories in DEFAULT mode.
INFO 61756 --- [           main] .s.d.r.c.RepositoryConfigurationDelegate : Finished Spring Data repository scanning in 8ms. Found 0 Redis repository interfaces.
INFO 61756 --- [           main] com.example.redis.RedisApplicationKt     : Started RedisApplicationKt in 1.298 seconds (JVM running for 1.737)
Sending message...
2020-10-19 20:18:43.770  INFO 61756 --- [    container-2] com.example.redis.Receiver               : Received < Hello from Redis! >

Process finished with exit code 0

다른 카테고리의 글 목록

Spring 카테고리의 포스트를 톺아봅니다

[spring.io] 스프링 JDBC를 활용하여 관계형 데이터베이스 연동하기(코틀린 ver.)

#kotlin #spring

참고 사이트 : https://spring.io/guides/gs/relational-data-access/

스프링의 JdbcTemplate 을 사용하여 관계형 데이터베이스에 저장된 데이터에 접근하는 애플리케이션을 작성합니다.

Spring Initializr 로 시작하기

메이븐 기준으로 다음 의존성을 추가한 프로젝트를 생성합니다.

  • Spring DATA JDBC
  • H2 Database
<dependencies>
    <dependency>
        <groupId>org.springframework.boot</groupId>
        <artifactId>spring-boot-starter-data-jdbc</artifactId>
    </dependency>
    <dependency>
        <groupId>org.jetbrains.kotlin</groupId>
        <artifactId>kotlin-reflect</artifactId>
    </dependency>
    <dependency>
        <groupId>org.jetbrains.kotlin</groupId>
        <artifactId>kotlin-stdlib-jdk8</artifactId>
    </dependency>

    <dependency>
        <groupId>com.h2database</groupId>
        <artifactId>h2</artifactId>
        <scope>runtime</scope>
    </dependency>
    <dependency>
        <groupId>org.springframework.boot</groupId>
        <artifactId>spring-boot-starter-test</artifactId>
        <scope>test</scope>
        <exclusions>
            <exclusion>
                <groupId>org.junit.vintage</groupId>
                <artifactId>junit-vintage-engine</artifactId>
            </exclusion>
        </exclusions>
    </dependency>
</dependencies>

Customer 객체 생성하기

간단한 데이터 접근 로직 테스트를 위해서 서비스에서 사용할 Customer 클래스를 생성합니다.

class Customer(
        val id : Long,
        val firstName : String,
        val lastName : String
) {
    override fun toString(): String {
        return “Customer id=$id, firstName=‘$firstName’, lastName=‘$lastName’]”
    }
}

JDBC 로 H2 데이터 데이터 베이스에 SQL 쿼리 실행하기

생성자에서 JdbcTemplate 객체를 주입받아 사용합니다.
Customer 리스트를 생성한 후 jdbcTemplate.batchUpdate 로 데이터베이스에 적재합니다.
적재 이후에는 SELECT 쿼리를 사용하여 전체 Customer 목록을 조회한 후 log로 출력합니다.

@SpringBootApplication
class JdbcApplication(
        val jdbcTemplate: JdbcTemplate
): CommandLineRunner{

    override fun run(vararg args: String?) {
        val log = LoggerFactory.getLogger(this.javaClass)

        log.info("Creating tables");

        jdbcTemplate.execute("DROP TABLE customers IF EXISTS");
        jdbcTemplate.execute("CREATE TABLE customers(" + "id SERIAL, first_name VARCHAR(255), last_name VARCHAR(255))");

        val splitUpNames = listOf<String>("John Woo", "Jeff Dean", "Josh Bloch", "Josh Long")
                .map{ it.split(" ").toTypedArray()}


        splitUpNames.forEach { log.info("Inserting customer record for ${it[0]} / ${it[1]}") }

        jdbcTemplate.batchUpdate("INSERT INTO customers(first_name, last_name) VALUES (?,?)", splitUpNames);

        log.info("Querying for customer records where first_name = 'Josh':");

        jdbcTemplate.query("SELECT id, first_name, last_name FROM customers") {
            rs, rowNum -> println("${rs.getLong("id")}, ${rs.getString("first_name")}, ${rs.getString("last_name")} $rowNum")
        }
    }
}

출력 결과

1, John, Woo 0
2, Jeff, Dean 1
3, Josh, Bloch 2
4, Josh, Long 3

다른 카테고리의 글 목록

Spring 카테고리의 포스트를 톺아봅니다

# [spring.io]RESTful 웹 서비스 호출하기(코틀린 ver.)

#kotlin #spring

참고 사이트 : https://spring.io/guides/gs/consuming-rest/

RESTful 웹 서비스 호출하기

스프링의 RestTemplate을 사용하여 RESTful 웹 서비스를 호출하는 예제입니다.
호출할 테스트 URL 은 https://gturnquist-quoters.cfapps.io/api/random 입니다.

Spring Initializr 로 시작하기

메이븐 기준으로 다음 의존성을 추가한 프로젝트를 생성합니다.

  • Spring Web
    <dependency>
        <groupId>org.springframework.boot</groupId>
        <artifactId>spring-boot-starter-web</artifactId>
    </dependency>
    <dependency>
        <groupId>com.fasterxml.jackson.module</groupId>
        <artifactId>jackson-module-kotlin</artifactId>
    </dependency>
    <dependency>
        <groupId>org.jetbrains.kotlin</groupId>
        <artifactId>kotlin-reflect</artifactId>
    </dependency>
    <dependency>
        <groupId>org.jetbrains.kotlin</groupId>
        <artifactId>kotlin-stdlib-jdk8</artifactId>
    </dependency>

    <dependency>
        <groupId>org.springframework.boot</groupId>
        <artifactId>spring-boot-starter-test</artifactId>
        <scope>test</scope>
        <exclusions>
            <exclusion>
                <groupId>org.junit.vintage</groupId>
                <artifactId>junit-vintage-engine</artifactId>
            </exclusion>
        </exclusions>
    </dependency>
</dependencies>

REST 리소스 가져오기

https://gturnquist-quoters.cfapps.io/api/random URL을 호출하면 다음과 같은 JSON 응답을 받아옵니다.

{
   type: "success",
   value: {
      id: 10,
      quote: "Really loving Spring Boot, makes stand alone Spring apps easy."
   }
}

도메인 클래스 생성하기

Quote 클래스 생성

class Quote (
        val type : String,
        val value : Value
){
    override fun toString(): String {
        return "Quote{" +
                "type='" + type + '\'' +
                ", value=" + value +
                '}';

    }
}

Value 클래스 생성

class Value(
        val id: Long,
        val quote : String
) {
    override fun toString(): String {
        return “Value{“ +
                “id=“ + id +
                “, quote=‘” + quote + ‘\’’ +
                ‘}’;
    }
}

애플리케이션 생성

  • 참고 사이트에서는 RestTemplate 의 getForObject 함수를 사용하지만,
    코틀린에서는 getForObject 를 사용할 경우 코드가 조금 복잡해지기 떄문에 getForEntity를 사용합니다.
fun main() {
    val quote: ResponseEntity<Quote> = RestTemplate().*getForEntity*<Quote>(
            “https://gturnquist-quoters.cfapps.io/api/random”)
    *println*(quote.toString())
}

실행 결과

<200,Quote{type='success', value=Value{id=5, quote='Spring Boot solves this problem. It gets rid of XML and wires up common components for me, so I don't have to spend hours scratching my head just to figure out how it's all pieced together.'}},[Content-Type:"application/json;charset=UTF-8", Date:"Sat, 17 Oct 2020 14:36:41 GMT", X-Vcap-Request-Id:"ad5f0439-f4ee-42b7-495c-0c44834274d5", Content-Length:"235", Connection:"keep-alive"]>

다른 카테고리의 글 목록

Spring 카테고리의 포스트를 톺아봅니다

[spring.io]RESTful 웹 서비스 만들기(코틀린 ver.)

참고 사이트 : Getting Started | Building a RESTful Web Service

RESTful 웹 서비스 만들기

이번 가이드에서는 스프링과 코틀린 언어로 “Hello, World”를 출력하는 RESTful 웹 서비스를 만들어볼 예정입니다.

http://localhost:8080/greeting GET 요청에 위와 같은 JSON 인사를 응답하는 웹 서비스를 만듭니다.

{"id":1,"content":"Hello, World!”}

추가로, http://localhost:8080/greeting?name=User 와 같이 문자열 쿼리에 name 파라미터를 전달 받으면 전달 받은 이름을 응답합니다.
(name 파라미터 값이 없을 경우 기본 값은 World입니다.)

{"id":1,"content":"Hello, User!”}

Spring Initializr 로 시작하기

메이븐 기준으로 다음 의존성을 추가한 프로젝트를 생성합니다.

  • Spring Web
    <dependency>
        <groupId>org.springframework.boot</groupId>
        <artifactId>spring-boot-starter-web</artifactId>
    </dependency>
    <dependency>
        <groupId>com.fasterxml.jackson.module</groupId>
        <artifactId>jackson-module-kotlin</artifactId>
    </dependency>
    <dependency>
        <groupId>org.jetbrains.kotlin</groupId>
        <artifactId>kotlin-reflect</artifactId>
    </dependency>
    <dependency>
        <groupId>org.jetbrains.kotlin</groupId>
        <artifactId>kotlin-stdlib-jdk8</artifactId>
    </dependency>

    <dependency>
        <groupId>org.springframework.boot</groupId>
        <artifactId>spring-boot-starter-test</artifactId>
        <scope>test</scope>
        <exclusions>
            <exclusion>
                <groupId>org.junit.vintage</groupId>
                <artifactId>junit-vintage-engine</artifactId>
            </exclusion>
        </exclusions>
    </dependency>
</dependencies>

리소스 클래스 생성

서비스는 /greeting 에 대한 GET 요청과 문자열 쿼리의 name 파라미터를 처리합니다. 서비스는 200 OK 코드와 함께 다음과 같은 JSON 을 본문에 넣어 응답합니다.

{
    "id": 1,
    "content": "Hello, World!"
}
  • Greeting 클래스 생성
    class Greeting(
          val id : String,
          val content : String`
    ) 

리소스 컨트롤러 생성

HTTP 요청 처리를 위해 @RestController 어노테이션을 추가합니다.

@RestController
class GreetingController {
    val counter = AtomicLong()

    @GetMapping(“/greeting”)
    fun greeting(@RequestParam(value=“name”, defaultValue = “World”)  name :String ) =
            Greeting(counter.incrementAndGet(), “Hello, $name”)
}

@GetMapping 어노테이션은 /greeting의 HTTP GET 요청을 greeting() 메소드에 매핑합니다.

@RequestParam 어노테이션은 문자열 쿼리 name 의 값을 greeting() 메소드의 name 파라미터에 주입합니다. 문자열 쿼리에 name 값이 없을 경우에는 defaultValue를 주입합니다.

테스트 결과

 curl localhost:8080/greeting                               
{"id":4,"content":"Hello, World"}                                               
curl localhost:8080/greeting?name=User                      
{"id":5,"content":"Hello, User”}

다른 카테고리의 글 목록

Spring 카테고리의 포스트를 톺아봅니다

스프링 부트에서 도커 컨테이너 이미지 생성하기

  • 개발 환경
    • Intellij IDE
    • Maven

참고 사이트 : https://spring.io/guides/gs/spring-boot-docker/

예제 코드 생성

@SpringBootApplication
@RestController
public class DockerTestApplication {

    @RequestMapping("/")
    public String sayHello() {
        return "Hello CI";
    } 

    public static void main(String[] args) {
        SpringApplication.run(DockerTestApplication.class, args);
    }

}
  • maven 을 활용하여 jar 파일 생성 및 실행
$ mvn package && java -jar target/*.jar
$ curl localhost:8080                                        
Hello CI

Dockerfile 생성

  • maven package 로 생성된 jar 파일을 컨테이너 이미지 안에 넣고 엔트리 포인트를 지정한다.
FROM openjdk:8-jdk-alpine
ARG JAR_FILE=target/*.jar
COPY ${JAR_FILE} app.jar
ENTRYPOINT ["java","-jar","/app.jar"]

Docker 이미지 생성

  • 실행 명령어 : docker build -t ci/hello-ci .
$docker build -t ci/hello-ci .                                                 SIGINT(2) ↵
Sending build context to Docker daemon  16.75MB
Step 1/4 : FROM openjdk:8-jdk-alpine
8-jdk-alpine: Pulling from library/openjdk
e7c96db7181b: Pull complete
f910a506b6cb: Pull complete
c2274a1a0e27: Pull complete
Digest: sha256:94792824df2df33402f201713f932b58cb9de94a0cd524164a0f2283343547b3
Status: Downloaded newer image for openjdk:8-jdk-alpine
 ---> a3562aa0b991
Step 2/4 : ARG JAR_FILE=target/*.jar
 ---> Running in a50bdf4f6a76
Removing intermediate container a50bdf4f6a76
 ---> a44d7bc3b35f
Step 3/4 : COPY ${JAR_FILE} app.jar
 ---> ca072fc923ee
Step 4/4 : ENTRYPOINT ["java","-jar","/app.jar"]
 ---> Running in d5fb7258f922
Removing intermediate container d5fb7258f922
 ---> 336f8ce8cdc3
Successfully built 336f8ce8cdc3
Successfully tagged ci/hello-ci:latest

Docker 이미지 실행

  • 실행 명령어 : docker run -p 8080:8080 ci/hello-ci
$ docker run -p 8080:8080 ci/hello-ci                                                



  .   ____          _            __ _ _
 /\\ / ___'_ __ _ _(_)_ __  __ _ \ \ \ \
( ( )\___ | '_ | '_| | '_ \/ _` | \ \ \ \
 \\/  ___)| |_)| | | | | || (_| |  ) ) ) )
  '  |____| .__|_| |_|_| |_\__, | / / / /
 =========|_|==============|___/=/_/_/_/
 :: Spring Boot ::        (v2.3.1.RELEASE)

2020-07-08 00:46:10.959  INFO 1 --- [           main] c.e.dockertest.DockerTestApplication     : Starting DockerTestApplication v0.0.1-SNAPSHOT on 145d1d9f806a with PID 1 (/app.jar started by root in /)
2020-07-08 00:46:10.968  INFO 1 --- [           main] c.e.dockertest.DockerTestApplication     : No active profile set, falling back to default profiles: default
2020-07-08 00:46:13.175  INFO 1 --- [           main] o.s.b.w.embedded.tomcat.TomcatWebServer  : Tomcat initialized with port(s): 8080 (http)
2020-07-08 00:46:13.211  INFO 1 --- [           main] o.apache.catalina.core.StandardService   : Starting service [Tomcat]
2020-07-08 00:46:13.212  INFO 1 --- [           main] org.apache.catalina.core.StandardEngine  : Starting Servlet engine: [Apache Tomcat/9.0.36]
2020-07-08 00:46:13.399  INFO 1 --- [           main] o.a.c.c.C.[Tomcat].[localhost].[/]       : Initializing Spring embedded WebApplicationContext
2020-07-08 00:46:13.400  INFO 1 --- [           main] w.s.c.ServletWebServerApplicationContext : Root WebApplicationContext: initialization completed in 2305 ms
2020-07-08 00:46:14.013  INFO 1 --- [           main] o.s.s.concurrent.ThreadPoolTaskExecutor  : Initializing ExecutorService 'applicationTaskExecutor'
2020-07-08 00:46:14.453  INFO 1 --- [           main] o.s.b.w.embedded.tomcat.TomcatWebServer  : Tomcat started on port(s): 8080 (http) with context path ''
2020-07-08 00:46:14.480  INFO 1 --- [           main] c.e.dockertest.DockerTestApplication     : Started DockerTestApplication in 4.277 seconds (JVM running for 5.158)

다른 카테고리의 글 목록

Spring 카테고리의 포스트를 톺아봅니다

- Back-end : Spring Boot, WebSocket, SockJS, Gradle

- Front-end : ReactJS, react-stomp

 

1. Spring Boot 서버 구현 

1) Spring Boot -> Message -> WebSocket 로 Spring boot 프로젝트를 생성한다. 
   생성 후 프로젝트 내 spring-boot-starter-websocket 이 추가되었는지 확인해야 한다. 

 

'org.springframework.boot:spring-boot-starter-websocket'

 

2) WebSocketConfig 클래스 생성

- enableSimpleBroker : 메시지 브로커를 등록한 

- addEndpoint : 클라이언트가 접속할 웹 소켓의 주소, setAllowedOrigins("*")로 전체 CORS 를 허용하며 SockJS을 사용하도록 설정했다. 

 

@Controller
@Configurable
@EnableWebSocketMessageBroker
public class WebSocketConfig implements WebSocketMessageBrokerConfigurer {

    @Override
    public void configureMessageBroker(MessageBrokerRegistry config) {
        config.enableSimpleBroker("/topic");
    }

    @Override
    public void registerStompEndpoints(StompEndpointRegistry registry) {
        registry.addEndpoint("/test").setAllowedOrigins("*").withSockJS();
    }

}

 

3) 웹소켓을 컨트롤할 TestController 클래스 생성 

- 웹소켓을 주고 받을 시 이벤트를 Trigger 하는 방법은 2가지가 있다. 

   먼저 client 소켓에서 sendMessage 함수로 메시지를 보낼 경우에는 @MessageMapping 어노테이션으로 받을 수 있다.
   두 번째로 @RequestMapping을 사용할 경우에는 웹 소켓이 연동된 Client와 무관하게 외부의 GET 질의로 이벤트를 Trigger 할 수 있다. 

 

- 메시지를 응답하는 방식도 2가지다. 

   첫 번째는 @SendTo 어노테이션을 사용하여 해당 topics를 수신하는 Client Websocket에 메시지를 전달할 수 있다.  
   이 경우 해당 함수는 리턴할 타입을 정의해야하며 반환값 리턴을 통해 Client에 메시지를 전달한다. 

   두 번째는 SimpMessagingTemplate를 사용하는 방식이다.  @SendTo 어노테이션을 사용하지 않고SimpMessagingTemplate로 응답값을 보낼 수 있으며, 이 경우 해당 함수의 리턴값은 void로 처리해야 한다.  SimpMessagingTemplate의 convertAndSend 함수를 사용하면 특정 유저에게만 메시지를 보낼 수 있다. 

 

@RestController
public class TestController {

    @Autowired
    private SimpMessagingTemplate webSocket;

    @MessageMapping("/sendTo")
    @SendTo("/topics/sendTo")
    public String SendToMessage() throws Exception {

        return "SendTo";
    }

    @MessageMapping("/Template")
    public void SendTemplateMessage() {
        webSocket.convertAndSend("/topics/template" , "Template");
    }

    @RequestMapping(value="/api")
    public void SendAPI() {
        webSocket.convertAndSend("/topics/api" , "API");
    }
}

 

2. React 코드 구현

1) 프로젝트 생성

 

npx create-react-app websocket_react

 

2) 관련 라이브러리 추가 

- sockjs-client, react-stomp 라이브러리 추가

 

yarn add sockjs-client react-stomp

 

3) 테스트 App 코드 작성

- react-stomp 라이브러리를 사용하여 웹소켓을 주고 받을 SockJsClient 컴포넌트를 생성한다.

  SockJsClient 생성 시 url은 WebSocket Config에서 Endpoint로 추가한 주소를 지정한다. 
  topics는 서버가 메시지를 보낼 시 수신할 토픽을 지정한다. 다중 지정할 수 있다.

  예제에서는 서버에서 3가지 방식으로 발신하는 모든 메시지를 수신한다. 

 

- SendTo, SendTemplate 버튼은 위 Controller에서 지정한 함수를 트리거하는 이벤트를 작성한다. 

   버튼 클릭 시 SockJsClient의 ref가 지정된 websocket에서 각 sendMessage 함수를 사용하여 서버에 메시지를 보낸다. 

- SockJsClient 관련 Docs : https://github.com/lahsivjar/react-stomp/blob/master/API.md

import React, {useRef} from 'react';

import SockJsClient from 'react-stomp';

function App () {
  const $websocket = useRef (null);

  const handleMsg = msg => {
    console.log (msg);
  };

  const handleClickSendTo = () => {
    $websocket.current.sendMessage ('/sendTo');
  };

  const handleClickSendTemplate = () => {
    $websocket.current.sendMessage ('/Template');
  };

  return (
    <div>

      <SockJsClient
        url="http://localhost:8080/start"
        topics={['/topics/sendTo', '/topics/template', '/topics/api']}
        onMessage={msg => {
          console.log (msg);
        }}
        ref={$websocket}
      />
      <button onClick={handleClickSendTo}>SendTo</button>
      <button onClick={handleClickSendTemplate}>SendTemplate</button>

    </div>
  );
}

export default App;

 

3. 실행 결과

- SendTo 버튼 클릭 시 

 

- SendTemplate 버튼 클릭 시

 

- 외부에서 http://localhost:8080/api 호출 시

다른 카테고리의 글 목록

Spring 카테고리의 포스트를 톺아봅니다

현상

메이븐(maven) 빌드 시 "Source option 5 is no longer supperted." 에러가 발생할 경우

해결방법

프로젝트 내 pom.xml 파일에 다음과 같이 properties를 추가한다. 

 <properties>
        <maven.compiler.source>1.8</maven.compiler.source>
        <maven.compiler.target>1.8</maven.compiler.target>
        <spring.version>5.0.0.RC2</spring.version>
</properties>

sping.version은 원래 pom.xml에 있던 프로퍼티다.

maven.compiler.source, maven.compiler.target 만 추가하면 된다.  

다른 카테고리의 글 목록

Spring 카테고리의 포스트를 톺아봅니다