質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
Java

Javaは、1995年にサン・マイクロシステムズが開発したプログラミング言語です。表記法はC言語に似ていますが、既存のプログラミング言語の短所を踏まえていちから設計されており、最初からオブジェクト指向性を備えてデザインされています。セキュリティ面が強力であることや、ネットワーク環境での利用に向いていることが特徴です。Javaで作られたソフトウェアは基本的にいかなるプラットフォームでも作動します。

Spring

Spring Framework は、Javaプラットフォーム向けのオープンソースアプリケーションフレームワークです。 Java Platform上に、 Web ベースのアプリケーションを設計するための拡張機能が数多く用意されています。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

Ajax

Ajaxとは、Webブラウザ内で搭載されているJavaScriptのHTTP通信機能を使って非同期通信を利用し、インターフェイスの構築などを行う技術の総称です。XMLドキュメントを指定したURLから読み込み、画面描画やユーザの操作などと並行してサーバと非同期に通信するWebアプリケーションを実現することができます。

Q&A

0回答

1261閲覧

springから@ResponseBodyで返却したjsonがajax側で「message: "data is not defined"」と表示され受け取れていない

pokemn

総合スコア16

Java

Javaは、1995年にサン・マイクロシステムズが開発したプログラミング言語です。表記法はC言語に似ていますが、既存のプログラミング言語の短所を踏まえていちから設計されており、最初からオブジェクト指向性を備えてデザインされています。セキュリティ面が強力であることや、ネットワーク環境での利用に向いていることが特徴です。Javaで作られたソフトウェアは基本的にいかなるプラットフォームでも作動します。

Spring

Spring Framework は、Javaプラットフォーム向けのオープンソースアプリケーションフレームワークです。 Java Platform上に、 Web ベースのアプリケーションを設計するための拡張機能が数多く用意されています。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

Ajax

Ajaxとは、Webブラウザ内で搭載されているJavaScriptのHTTP通信機能を使って非同期通信を利用し、インターフェイスの構築などを行う技術の総称です。XMLドキュメントを指定したURLから読み込み、画面描画やユーザの操作などと並行してサーバと非同期に通信するWebアプリケーションを実現することができます。

0グッド

0クリップ

投稿2019/04/21 02:55

前提・実現したいこと

いつもお世話になっております。
今回は、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

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

m.ts10806

2019/04/21 03:05 編集

/chat/getRoom をAjaxで実行した側のコード(Java)はどうなっていて、どういう情報を返しているのでしょうか? 下記のコードが非常に、謎です。 var label = document.createElement('label'); label = data; Ajaxで取得されたdataで、せっかく作ったlabel要素をそのまま上書きしている・・・?どういうつもりでこのような処理にされているのでしょうか?
pokemn

2019/04/21 03:29

■/chat/getRoom をAjaxで実行した側のコード(Java)はどうなっていて、どういう情報を返しているのでしょうか? /chat/getRoomをAjax側で実行すると下記が呼ばれます。 該当ソースコードに載せている「ChatWebSocketController」 メソッド:getRoom() 返却情報:String data = "test" ■Ajaxで取得されたdataで、せっかく作ったlabel要素をそのまま上書きしている・・・?どういうつもりでこのような処理にされているのでしょうか? 申し訳ありません。私のコーディングミスです。 本来は、ajaxで取得したdataの名前をlabelの名前にするという処理にしたいと考えております。
退会済みユーザー

退会済みユーザー

2019/04/21 09:07

JSPの変換に問題がない場合はJSPでなくHTMLに変換したあとので
退会済みユーザー

退会済みユーザー

2019/04/21 09:08

そもそも text/plain でかえしてるんだから json 変換できるわけないじゃん
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

まだ回答がついていません

会員登録して回答してみよう

アカウントをお持ちの方は

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問