如何修復使用ajax在rest調用中添加的參數？

Question

我正在嘗試使用對spring RestController的ajax Rest調用來測試Datatables作曲家。 我在wampserver中設置正面，並在春季啟動中設置背面。

我正在使用spring tuto設置RestController https://spring.io/guides/gs/rest-service/效果很好，調用控制器時得到了Json文件。 我想使用該結果並顯示在數據表中。

字體的代碼script.js是：

    $(document).ready( function () {
        $('#table_id').DataTable( {
                  "processing": true,
                  "serverSide": false,
                  "ajax": {
                      "url": "http://localhost:8080/greeting",
                      "type": 'GET',
                      "dataType": "json",
                      "data": function (data) { 
                         // console.log(data); 
                         return data = JSON.stringify(data);
                      }
                      },

                  "columns": [
                                   {"data": 'id'},
                                   {"data": 'content'}
                               ]
           });
    });

HTML頁面

<!DOCTYPE html>
<html lang="en">
<head>
    <script
            src="https://code.jquery.com/jquery-3.4.1.min.js"
            integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo="
            crossorigin="anonymous"></script>

    <link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.19/css/jquery.dataTables.css">
    <script type="text/javascript" charset="utf8" src="https://cdn.datatables.net/1.10.19/js/jquery.dataTables.js"></script>
    <script type="text/javascript" charset="utf8" src="script.js"></script>
    <meta charset="UTF-8">

    <title>Gtreetings</title>
</head>
<h3>Hi, little one </h3>
<body>

    <table id="table_id" class="display" style="width:100%">
        <thead>
        <tr>
            <th>id</th>
            <th>content</th>
        </tr>
        </thead>
        <tfoot>
        <tr>
            <th>id</th>
            <th>content</th>
        </tr>
        </tfoot>
    </table>

</body>
</html>

我在http：// localhost：8080 / greeting ？{}＆ = 1558786054608上收到了一個奇怪的添加參數{}＆ = 1558786054608和跨域請求錯誤 。

我不確定是否是時間戳，我不知道該如何改寫。

Answer 1

首先，在您的JS腳本中，ajax調用出錯，數據表示參數不是從ajax發送的。 這是代碼的正確版本。

     $(document).ready( function () {

        $('#table_id').DataTable({                                                                              
                  processing: true,
                  serverSide: false,
                   dataType: "json",
                   ajax: {
                      url: "http://localhost:8080/greeting",
                      method: 'GET',
                      dataSrc: function (json) {

                         console.log("json",json)
                         return json;
                        },

                    },

                  columns: [
                               {data: 'id'},
                               {data: 'content'}
                           ]
           });
    });

其次，在控制器的后端，您必須添加注釋@CrossOrigin(origins = "*")從而避免了跨域錯誤。

最后，Datatable在重新調整結果中必須有一個數組，而在控制器中則不是這種情況。 它返回一個對象。 我建議將對象包裝在列表中，如下所示：

@CrossOrigin(origins = "*")
@RestController
public class GreetingController {

    private static final String template = "Hello, %s!";
    private final AtomicLong counter = new AtomicLong();

    @RequestMapping("/greeting")
    public List<Greeting> greeting(@RequestParam(value="name", defaultValue="World") String name) {

        List<Greeting> ls = new ArrayList<Greeting>();
        ls.add(new Greeting(counter.incrementAndGet(),
                String.format(template, name)));
        return ls;
    }
}

希望對您有所幫助。

如何修復使用ajax在rest調用中添加的參數？

問題描述

1 個解決方案

解決方案1
1 已采納 2019-05-30 20:58:13

如何修復使用ajax在rest調用中添加的參數？

問題描述

1 個解決方案

解決方案1 1 已采納 2019-05-30 20:58:13

解決方案1
1 已采納 2019-05-30 20:58:13