前提・実現したいこと
いつもお世話になっております。
今回は、ajaxとspringで値のやり取りができるか確認をしたいと思い以下の実装を行ったのですが、
返却したjsonがajax側で「message: "data is not defined"」と表示されており確認ができない状態です。
ただchromeのdevtoolsのコンソールでは、下記「発生している問題・エラーメッセージ」の出力がされているので
サーバー側で返却している値が悪いのでないかと考えておりサイトを調べたのですが、解決策が見つからず。。。
どなたかご教授お願い致します。
※chromeのDevToolsの「Network」タブを確認したところ、下記が表示されているのは確認しました。
「Headers」タブ
Status Code:200
「Preview」タブ
test
「Response」タブ
test
発生している問題・エラーメッセージ
chatscreen.js:40 {readyState: 4, getResponseHeader: ƒ, getAllResponseHeaders: ƒ, setRequestHeader: ƒ, overrideMimeType: ƒ, …}abort: ƒ (e)always: ƒ ()catch: ƒ (e)done: ƒ ()fail: ƒ ()getAllResponseHeaders: ƒ ()getResponseHeader: ƒ (e)overrideMimeType: ƒ (e)pipe: ƒ ()progress: ƒ ()promise: ƒ (e)readyState: 4responseText: "test"setRequestHeader: ƒ (e,t)state: ƒ ()status: 200statusCode: ƒ (e)statusText: "parsererror"then: ƒ (t,r,i)__proto__: Object chatscreen.js:41 parsererror chatscreen.js:42 SyntaxError: Unexpected token e in JSON at position 1 at parse (<anonymous>) at Ut (jquery-3.3.1.min.js:2) at k (jquery-3.3.1.min.js:2) at XMLHttpRequest.<anonymous> (jquery-3.3.1.min.js:2)
該当のソースコード
jsp
1<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %> 2<%@ taglib uri="http://www.springframework.org/tags/form" prefix="form" %> 3<%@ taglib uri="http://www.springframework.org/tags" prefix="spring" %> 4<%@ page contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" session="false" %> 5<!DOCTYPE html> 6<html> 7<head> 8<link href="<c:url value="/resources/css/bootstrap.min.css" />" rel="stylesheet"> 9<link href="<c:url value="/resources/css/chatscreen.css" />" rel="stylesheet"> 10</head> 11<body> 12 13 <div class="flexside"> 14 <button id="connection" onclick="connection()">接続</button> 15 <button id="roomcreate" >ルーム作成</button> 16 <div id="room"> 17 </div> 18 <div class="flexcontainer"> 19 <div class="flexmain" id="response"> 20 </div> 21 22 <div class="flexfutter"> 23 <input type="text" id="textinput"> 24 <button id="send" onclick="send()">送信</button> 25 </div> 26 </div> 27 </div> 28 29<script src="<c:url value="/resources/js/jquery-3.3.1.min.js" />"></script> 30<script src="<c:url value="/resources/js/bootstrap.min.js" />"></script> 31<script src="<c:url value="/resources/js/stomp.min.js" />"></script> 32<script src="<c:url value="/resources/js/sockjs.js" />"></script> 33<script src="<c:url value="/resources/js/sockjs.min.js" />"></script> 34<script src="<c:url value="/resources/js/chatscreen.js" />"></script> 35</body> 36</html>
該当のソースコード
javascript
1$("#roomcreate").click(function() { 2 $.ajax({ 3 url:"/chat/getRoom", 4 dataType:"json", 5 timeout: 10000 6 7 }).done(function (data) { 8 var label = document.createElement('label'); 9 label = data; 10 document.getElementById('room').appendChild(label); 11 }).fail(function (data) { 12 alert(data); 13 }).always(function (data,textStatus,jqXHR) { 14 console.log(data); 15 console.log(textStatus); 16 console.log(jqXHR); 17 }); 18}); 19
該当のソースコード
java
1package jp.co.chat.controller; 2 3import java.util.concurrent.TimeUnit; 4 5import org.springframework.messaging.handler.annotation.MessageMapping; 6import org.springframework.messaging.handler.annotation.SendTo; 7import org.springframework.stereotype.Controller; 8import org.springframework.web.bind.annotation.RequestMapping; 9import org.springframework.web.bind.annotation.RequestMethod; 10import org.springframework.web.bind.annotation.ResponseBody; 11import org.springframework.web.bind.annotation.RestController; 12 13@Controller 14public class ChatWebSocketController { 15 16 @RequestMapping(value = "getRoom") 17 @ResponseBody 18 public String getRoom() { 19 20 String data = "test"; 21 22 return data; 23 } 24 25} 26
試したこと
・jsonの返却値をString[]にして返却
・jsの「dataType:"json"」を削除し、実行
補足情報(FW/ツールのバージョンなど)
SpringFramework:4.2.4.RELEASE
あなたの回答
tips
プレビュー