Как исправить добавленный параметр в вызове rest с ajax? - PullRequest
Новая
       12

Как исправить добавленный параметр в вызове rest с ajax?

0 голосов
/ 25 мая 2019

Я пытаюсь протестировать Datatables composer с вызовами ajax Rest для Spring RestController.Я установил переднюю часть в wampserver и заднюю часть с пружинной загрузкой.

Я использую пружину tuto для настройки RestController https://spring.io/guides/gs/rest-service/ Работает нормально, я получил файл Json при вызове контроллера.Я хочу использовать этот resutl и показывать в Datatables.

Код 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 page 

<!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>

Я получилстранный добавленный параметр {} & = 1558786054608 и ошибка запроса перекрестного источника при http://localhost:8080/greeting?{}&=1558786054608.

Я не уверен, что это временная метка, я не знаю, как это объяснить.

1 Ответ

1 голос
/ 30 мая 2019

Во-первых, в вашем 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;
    }
}

Надеюсь, это поможет.

...