如何从浏览器使用@PostMapping？

Question

我正在使用 Spring 开发一个简单的 REST 服务。我有一个实体和一个控制器。我的问题是我不能从浏览器使用 Post 功能，它只能在终端上工作。 Get 功能在浏览器和终端上都可以正常工作，但 Post 功能只能在终端上工作，但我必须在浏览器上工作。

对于下面的代码，如果我导航到：

http://localhost:8080/cities

结果ok，返回所有记录。

获取方法：

@RestController
public class CityController {

    ...

    @GetMapping(value = "/cities", produces = "application/json; charset=UTF-8")
    List<City> all() {
        return repository.findAll();
    }
}

对于 Post 方法，如果我写如下内容，则只能在终端上工作：

curl -X POST localhost:8080/cities -H 'Content-type:application/json' -d '{"name":"test", "state":"test"}'

结果正常，记录已创建。

但是，在浏览器中，如果我尝试添加一条新记录：

http://localhost:8080/cities?name=test&state=test

什么都没有发生，也没有错误发生。

发布方式：

@PostMapping(path = "/cities", consumes = "application/json", produces = "application/json")
City newCity(@RequestBody City city) {
    return repository.save(city);
}

实体：

@Entity
public class City {

    @Id @GeneratedValue(strategy=GenerationType.AUTO) Long id;
    private String name;
    private String state;

    public City() {
    }

    public City(String name, String state) {
        this.name = name;
        this.state = state;
    }

    public void setId(Long id) {
        this.id = id;
    }

    public Long getId() {
        return id;
    }

    public String getName() {
        return name;
    }

    public void setName(String name) {
        this.name = name;
    }

    public String getState() {
        return state;
    }

    public void setState(String state) {
        this.state = state;
    }

}

Answer 1

在浏览器中输入http://localhost:8080/cities?name=test&state=test 仍会将其作为GET 发送。

要以POST 发送，您有几个选择：

1. 使用其他人提到的浏览器插件。
2. 创建一个 HTML 表单。
3. 使用 JavaScript。

选项 1 非常适合调试和测试，但不适用于生产质量网站。您不能合理地期望您的访问者安装或使用浏览器插件与您的网站进行交互。

选项2是最传统的设计。您需要从应用程序中提供 HTML 文件（它可以是静态 HTML 文件或使用模板框架，例如 Thmyeleaf 或 Freemarker）。 HTML 需要一个 form element 配置为使用 POST 并将其指向您的端点。请记住，您的端点需要接受表单编码数据，而不仅仅是 JSON。

选项 3 可以通过多种方式实现。您可以拥有一个使用嵌入式 JavaScript 调用端点的 HTML 文件，或者您可以使用 Angular 或 React 等框架。

有很多选择，如果不知道您到底想要完成什么，就很难说哪个是最好的。