2013-12-23 13 views
6

私はこの例をSpringサイトから実行しようとしました:tutorial Spring Boot部分を除きます。Spring 4 WebSocket app

のWeb.xml

<web-app> 
    <display-name>Archetype Created Web Application</display-name> 

    <servlet> 
     <servlet-name>sample</servlet-name> 
     <servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class> 
     <init-param> 
      <param-name>contextClass</param-name> 
      <param-value> 
       org.springframework.web.context.support.AnnotationConfigWebApplicationContext 
      </param-value> 
     </init-param> 
     <init-param> 
      <param-name>contextConfigLocation</param-name> 
      <param-value> 
       com.evgeni.websock.WebSocketConfig 
      </param-value> 
     </init-param> 
    </servlet> 

    <servlet-mapping> 
     <servlet-name>sample</servlet-name> 
     <url-pattern>/</url-pattern> 
    </servlet-mapping> 
</web-app> 

Javaの設定:

@Configuration 
@ComponentScan(basePackages = {"com.evgeni.controller"}) 
@EnableWebSocketMessageBroker 
@EnableWebMvc 
public class WebSocketConfig extends WebMvcConfigurerAdapter implements WebSocketMessageBrokerConfigurer { 

    public void registerStompEndpoints(StompEndpointRegistry registry) { 
     registry.addEndpoint("/hello").withSockJS(); 
    } 

    public void configureClientInboundChannel(ChannelRegistration registration) { 
     // TODO Auto-generated method stub 

    } 

    public void configureClientOutboundChannel(ChannelRegistration registration) { 
     // TODO Auto-generated method stub 

    } 

    public void configureMessageBroker(MessageBrokerRegistry registry) { 
     registry.enableSimpleBroker("/topic"); 
     registry.setApplicationDestinationPrefixes("/app"); 
    } 
    @Override 
     public void addResourceHandlers(ResourceHandlerRegistry registry) { 
      registry.addResourceHandler("/css/**").addResourceLocations("/css/").setCachePeriod(31556926); 
      registry.addResourceHandler("/img/**").addResourceLocations("/img/").setCachePeriod(31556926); 
      registry.addResourceHandler("/js/**").addResourceLocations("/js/").setCachePeriod(31556926); 
     } 

} 

コントローラー:

@Controller 
public class GreetingController { 


    @MessageMapping("/hello") 
    @SendTo("/topic/greetings") 
    public Greeting greeting(HelloMessage message) throws Exception { 
     Thread.sleep(3000); // simulated delay 
     System.out.println(message.getName()); 
     return new Greeting("Hello, " + message.getName() + "!"); 
    } 

} 
index.jspを

<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %> 
<!DOCTYPE html> 
<html> 
<head> 
    <title>Hello WebSocket</title> 
    <script src="<c:url value='/js/sockjs-0.3.js'/>"></script> 
    <script src="<c:url value='/js/stomp.js'/>"></script> 
    <script type="text/javascript"> 
     var stompClient = null; 

     function setConnected(connected) { 
      document.getElementById('connect').disabled = connected; 
      document.getElementById('disconnect').disabled = !connected; 
      document.getElementById('conversationDiv').style.visibility = connected ? 'visible' : 'hidden'; 
      document.getElementById('response').innerHTML = ''; 
     } 

     function connect() { 
      var socket = new SockJS("<c:url value='/hello'/>"); 
      stompClient = Stomp.over(socket); 
      stompClient.connect('', '', function(frame) { 
       setConnected(true); 
       console.log('Connected: ' + frame); 
       stompClient.subscribe("<c:url value='/topic/greetings'/>", function(greeting){ 
        showGreeting(JSON.parse(greeting.body).content); 
       }); 
      }); 
     } 

     function disconnect() { 
      stompClient.disconnect(); 
      setConnected(false); 
      console.log("Disconnected"); 
     } 

     function sendName() { 
      var name = document.getElementById('name').value; 
      stompClient.send("<c:url value='/app/hello'/>", {}, JSON.stringify({ 'name': name })); 
     } 

     function showGreeting(message) { 
      var response = document.getElementById('response'); 
      var p = document.createElement('p'); 
      p.style.wordWrap = 'break-word'; 
      p.appendChild(document.createTextNode(message)); 
      response.appendChild(p); 
     } 
    </script> 
</head> 
<body> 
<noscript><h2 style="color: #ff0000">Seems your browser doesn't support Javascript! Websocket relies on Javascript being enabled. Please enable 
    Javascript and reload this page!</h2></noscript> 
<div> 
    <div> 
     <button id="connect" onclick="connect();">Connect</button> 
     <button id="disconnect" disabled="disabled" onclick="disconnect();">Disconnect</button> 
    </div> 
    <div id="conversationDiv"> 
     <label>What is your name?</label><input type="text" id="name" /> 
     <button id="sendName" onclick="sendName();">Send</button> 
     <p id="response"></p> 
    </div> 
</div> 
</body> 
</html> 

Everithingは、プロジェクトのルートを追加するためにjspのweb.xmlと2-3 c:urlからロードされたconfを除いて、チュートリアルと同じです。私は

Opening Web Socket... stomp.js:122 
Web Socket Opened... stomp.js:122 
>>> CONNECT 
login: 
passcode: 
accept-version:1.1,1.0 
heart-beat:10000,10000 

stomp.js:122 
<<< ERROR 
message:Illegal header\c 'login\c'. A header must be of the form <name>\c<value> 
content-length:0 

stomp.js:122 
>>> SEND 
destination:/websock/app/hello 
content-length:14 

{"name":"asd"} 

私は番目のproblmはソックスのjs

stompClient.connect('', '', function(frame) {... 

のconnect関数であることを考える:私は、接続をクリックして送信、私が手ブラウザコンソールで

ログインとパスコードのために ''を渡します。

編集:私はstompClient.connect('random', 'random',へ接続機能を変更する コンソールの応答がある:

Opening Web Socket... stomp.js:122 
Web Socket Opened... stomp.js:122 
>>> CONNECT 
login:asd 
passcode:asd 
accept-version:1.1,1.0 
heart-beat:10000,10000 

stomp.js:122 
<<< CONNECTED 
heart-beat:0,0 
version:1.1 

stomp.js:122 
connected to server undefined stomp.js:122 
Connected: CONNECTED 
version:1.1 
heart-beat:0,0 

(index):23 
>>> SUBSCRIBE 
id:sub-0 
destination:/websock/topic/greetings 

stomp.js:122 
>>> SEND 
destination:/websock/app/hello 
content-length:14 

{"name":"asd"} 

が、メッセージがコントローラに供給されません。

+0

あなたは実行可能なjarファイルを使用しています。tここを見てみましょう

stompClient.connect('', '', function(frame) { 

代わり

stompClient.connect({}, function(frame) { 

を使用その記事のように、埋め込みのTomcatと?または、他の何か? – eis

+0

私はSTSのTomcat 7.0.47を使用します。 WebSocketのサポートがあればどうすればいいですか? –

+0

ちょうど私の質問を変更しました、ごめんなさい:)あなたはそれを埋め込んでいるのか、外部のインスタンスに展開していますか? – eis

答えて

7

間違ったコントローラマッピングです。

@MessageMapping("/hello") 
    @SendTo("/topic/greetings") 
    public Greeting greeting(HelloMessage message) throws Exception 

とJSPで::私が持っている

stompClient.subscribe("<c:url value='/topic/greetings'/>", function(greeting){... 

stompClient.send("<c:url value='/app/hello'/>", {}, JSON.stringify({ 'name': name })); 

正しいものは、次のとおりです。

stompClient.subscribe('/topic/greetings', function(greeting){... 
stompClient.send('/app/hello', {}, JSON.stringify({ 'name': name })); 

C:urlはルートが追加されます私はそれを削除すると、プロジェクトのpp働いた。しかし、C:「あなたはshouldnまた、あなたは(あなたが春のセキュリティに依存している可能性があるとして)サーバにログイン/パスワードを渡すことがないかどう

var socket = new SockJS("<c:url value='/hello'/>"); 
+0

私はURLマッピングのために同じ問題がありました。アプリケーションコンテキストパスは、新しいSockJSインスタンスを作成する場合にのみ必要です。その後、購読するには、URLマッピングを使用してください。暗黙的に、コンテキストパスにマップされます。 @エヴゲニ素晴らしい答えをありがとう。 – LahiruBandara

関連する問題