无法使用jQuery使用Spring REST API

Question

我在Spring Boot中编写了简单的REST API，并将其部署在Heroku（ http://books-anzu.herokuapp.com/books/1 ）上，现在我创建了一个简单的webapp，它使用jQuery来使用此API，脚本books.js如下所示：

$(document).ready(function() {
    $.ajax({
        url: "https://books-anzu.herokuapp.com/books/1"
}).then(function(data) {
    $('.book-id').append(data.id);
    $('.book-title').append(data.title);
    $('.book-author').append(data.author);
    $('.book-description').append(data.description);
    $('.book-publicationYear').append(data.publicationYear);
    $('.book-numberOfPages').append(data.numberOfPages);
    });
});

和html文件： https ： //pastebin.com/XptrVv4x

输出没有来自API的数据...这是怎么回事？ 我也尝试使用tomcat在springboot上运行webapp，并且输出是相同的。 我正在遵循此指南： https : //spring.io/guides/gs/using-rest-jquery/

提前致谢

Answer 1

您使用JSON数据，需要使用dataType告诉jQuery您想解析JSON数据：

$.ajax({
  dataType: "json",
  url: url,
  data: data,
  success: success
});

或者，您可以使用$.getJSON ，更多信息： http : $.getJSON

Answer 2

如果两个应用程序位于不同的域（或端口，协议）上，则需要在服务器端启用CORS。 检查您的浏览器控制台是否存在此错误。 您可以使用此示例配置启用cors

  @Configuration
    @EnableWebMvc
    public class WebConfig extends WebMvcConfigurerAdapter {

            @Override
            public void addCorsMappings(CorsRegistry registry) {
                registry.addMapping("/api/**")
                    .allowedOrigins("http://domain2.com")
                    .allowedMethods("PUT", "DELETE")
                    .allowedHeaders("header1", "header2", "header3")
                    .exposedHeaders("header1", "header2")
                    .allowCredentials(false).maxAge(3600);
            }
     }

Answer 3

我刚刚为控制器类（在服务器端）添加了@CrossOrigin批注，它解决了我的问题。

感谢您的所有回复。