SpringMVCでjsonデータを受信・応答する方法の紹介（コード付き）

この記事では SpringMVC が json データを受信して​​応答する方法 (コード付き) を紹介します。一定の参考価値があります。困っている友人は参考にしてください。お役に立てれば幸いです。

フロントエンドとバックエンドのデータ連携は、フォームからの送信に加え、ajaxを介してバックエンドにjson形式のデータを送受信することも可能です（この方法によりリクエストの分離が実現できます）データとページ)。この記事では、Spring MVC で json データを受信して​​応答するいくつかの方法をまとめます。

準備手順:
1. json 関連のフレームワーク (jackson など) の依存関係をインポートします。
2. spring mvc のコントローラーメソッドは普通に記述しますが、json に応答する必要がある場合は @responsebody アノテーションを追加します。
3. json に対応する入力パラメータを受け入れる前に、@RequestBody アノテーションを追加します。
サーバーがjsonデータを受け取ってjavaオブジェクトに戻すことをデシリアライズといいますが、逆にjavaオブジェクトを応答としてjsonデータに変換してクライアントに返すことをシリアル化といいます。

注: ajax を使用したいので、jQuery を導入する必要があることに注意してください。

jackson maven dependency:

        <!-- jackson依赖 -->
        <dependency>
            <groupId>com.fasterxml.jackson.core</groupId>
            <artifactId>jackson-core</artifactId>
            <version>2.7.0</version>
        </dependency>
        <dependency>
            <groupId>com.fasterxml.jackson.core</groupId>
            <artifactId>jackson-databind</artifactId>
            <version>2.7.0</version>
        </dependency>
        <dependency>
            <groupId>com.fasterxml.jackson.core</groupId>
            <artifactId>jackson-annotations</artifactId>
            <version>2.7.0</version>
        </dependency>

1. エンティティ クラスで受信

背景: ajax が多くのパラメータを渡す場合、パラメータ名一致メソッドを使用するのは不便です。バックグラウンドに対応するエンティティ クラスがある場合は、クライアントでデータを json 形式でカプセル化し、バックグラウンドに渡すことを選択できます。バックグラウンドは、対応するエンティティ クラスを使用してデータを受け取ります。

Client:

<button onclick="clickMe()">点我</button>
<script>
    function clickMe() {
        $.ajax({
            type : 'POST',
            url : "acceptJsonByEntity",
            contentType : "application/json;charset=utf-8",
            // 如果想以json格式把数据提交到后台的话，JSON.stringify()必须有，否则只会当做表单提交
            data : JSON.stringify({
                "bookId" : 1,
                "author" : "Jack"
            }),
            // 期待返回的数据类型
            dataType : "json",
            success : function(data) {
                var bookId = data.bookId;
                var author = data.author;
                alert("success:" + bookId+','+author);
            },
            error : function(data) {
                alert("error" + data);
            }
        });
</script>

@responseBody アノテーションは、コントローラーのメソッドから返されたオブジェクトを適切なコンバーターを通じて指定された形式に変換し、レスポンスのボディ領域に書き込むことです。オブジェクト。通常は JSON データまたは XML を返します。

@RequestBody アノテーションは、content-type がデフォルトの application/x-www-form-urlcoded エンコーディングではないコンテンツを処理するためによく使用されます。一般的に、アプリケーション/json タイプを処理するためによく使用されます。

Controller:

@Controller
public class PassJsonParam {
    @RequestMapping(value="acceptJsonByEntity",method = RequestMethod.POST)
    @ResponseBody
    public Book acceptJsonByEntity(@RequestBody Book book, HttpServletRequest request){
        System.out.println("当前http请求方式为:"+request.getMethod());
        System.out.println("bookId="+book.getBookId()+", author="+book.getAuthor());
        return book;
    }
}

コンソール出力: 現在の http リクエスト メソッドは次のとおりです: POST bookId=1、author=Jack

Client (ポップアップ ウィンドウ): success :1,Jack

---

コントローラー内のすべてのメソッドが json 形式のデータを返す必要がある場合は、@RestController アノテーションを使用できます。

@RestController = @Controller @ResponseBody

Controller (上記のコントローラーは次のものに置き換えることができます):

@RestController
public class PassJsonParam {
    @RequestMapping(value="acceptJsonByEntity",method = RequestMethod.POST)
    public Book acceptJsonByEntity(@RequestBody Book book, HttpServletRequest request){
        System.out.println("当前http请求方式为:"+request.getMethod());
        System.out.println("bookId="+book.getBookId()+", author="+book.getAuthor());
        return book;
    }
}

注: @RestController注釈が付けられると、コントローラーのメソッドは JSP ページまたは HTML を返せなくなり、構成されたビュー パーサーは機能しなくなります。

2. マップ モードで受信する

バックグラウンド: フロントエンドは ajax リクエストをバックエンドに送信し、多くのパラメーターを運びますが、バックエンドにはそれを受信するための対応するエンティティ クラスがありません。それに対処するには？最も一般的なのはフォームであり、マップを使用して解決することを検討できます。マップのデータ構造はキーと値の形式であるため、フォームの名前をマップのキーとして使用し、フォームの値をマップの値として使用して、検索ボックス フォームをトラバースできます。

クライアント:

<form id="bookForm">
    <input type="text" name="bookName" id="bookName">
    <input type="text" name="author" id="author" >
    <button onclick="submitForm(event)">提交</button>
</form>

<script>
    function submitForm(event) {
        //阻止form默认事件
        event.preventDefault();
        //得到搜索框数据
        var map = new Map();
        $("#bookForm input").each(function () {
            var value = $(this).val();      //input 值
            var name = $(this).attr('name');
            map.set(name,value);
        })

        //Map转为Json的方法
        var obj= Object.create(null);
        for (var [k,v] of map) {
            obj[k] = v;
        }

        $.ajax({
            type: 'POST',
            contentType:'application/json',
            url: "acceptJsonByMap",
            data: JSON.stringify(obj),
            dataType: 'json',
            success: function (data) {
                var bookName = data.bookName;
                var author = data.author;
                alert("bookName ="+bookName+"; author="+author);
            },
            error: function (data) {
                alert("失败啦");
            }
        });
    }
</script>

コントローラ:

    @RequestMapping(value="acceptJsonByMap")
    @ResponseBody
    public Map<String,Object> acceptJsonByMap(@RequestBody Map<String,Object> paramsMap, HttpServletRequest request){
        System.out.println("当前http请求方式为:"+request.getMethod());
        System.out.println(paramsMap);
        return paramsMap;
    }

コンソール出力: 現在の http リクエスト メソッドは次のとおりです: POST {bookName=Love, author=Frank}

Client (Pop -up window): bookName =Love; author=Frank

3. リスト モードで受信 (json 配列形式で渡されます)

クライアント:

<button onclick="clickHere()">clickHere</button>
<script>
    function clickHere() {
        var params1 = {
            "bookId":"123",
            "author":"Rose"
        };
        var params2 = {
            "bookId":"321",
            "author":"Jack"
        };
        var list = [];
        list.push(params1);
        list.push(params2);

        $.ajax({
            type: 'POST',
            contentType:'application/json',
            url: "acceptJsonByList",
            data: JSON.stringify(list),
            dataType: 'json',
            success: function (data) {
                for (let i = 0; i < data.length; i++) {
                    var bookId = data[i].bookId;
                    var author = data[i].author;
                    alert("bookId ="+bookId+"; author="+author);
                }
            },
            error: function (data) {
                alert("失败啦");
            }
        });
    }
</script>

注: バックエンドに渡す場合、リストは [ { key1 : value1} { key2 : value2} ] の json 形式データである必要があります。そうしないと、Json 解析エラーが発生する可能性があります。

Controller:

    @RequestMapping(value="acceptJsonByList")
    @ResponseBody
    public List<Book> acceptJsonByList(@RequestBody List<Book> book, HttpServletRequest request){
        System.out.println("当前http请求方式为:"+request.getMethod());
        System.out.println(book);
        return book;
    }

注: ここで受信するには Book エンティティ クラスが必要です。

コンソール出力: 現在の http リクエスト メソッドは次のとおりです: POST [entity.Book@1138a75c,entity.Book@22d1cbcf]

クライアント (ポップアップ ウィンドウ): bookId =123; author= Rose bookId =321; 著者=Jack

以上がSpringMVCでjsonデータを受信・応答する方法の紹介（コード付き）の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。