Angular2 不在 POST 请求中传递参数

Posted 2023-02-27

【中文标题】Angular2 不在 POST 请求中传递参数

【英文标题】：Angular2 does not pass parameters in POST request

【发布时间】：2016-11-05 05:20:27

【问题描述】：

我正在尝试使用 Angular POST 请求将参数传递给 Tomcat 服务器 Spring Framework。不知何故，我看到参数在发送时就在那里，但它以某种方式没有到达/在后端正确检索。这是Angular2的代码：

addCompany() 
  console.log("addCompany button clicked!");
  console.log("company name: " + this.input);
  let nameId = this.input;
  let body = JSON.stringify( input: nameId );
  let headers = new Headers( 'Content-Type': 'application/json', 'X-CSRF-TOKEN':this.getToken() );
  console.log("csrf token: " + this.getToken());
  let options = new RequestOptions( headers: headers );
this.http.post('http://localhost:8080/views/addcompany', body, options).toPromise()
    .then(() => 
      console.log("company added!");
      this.reloadList();
    );;

当我试图在 Spring 中获取它时，我得到了 null 的参数：

@RequestMapping(value = "/addcompany", method = RequestMethod.POST)
@ResponseBody
public void addCompany(HttpServletRequest request,
        HttpServletResponse response) 
    String nameId = request.getParameter("input");
    eventService.addCompany(nameId);

我也试过这样：

@RequestMapping(value = "/addcompany", method = RequestMethod.POST)
@ResponseBody
public void addCompany(Model model, @RequestParam("input") String nameId) 
    eventService.addCompany(nameId);

在 Angular 代码中，我一直在尝试在任何地方更改逗号，例如：

  let nameId = this.input;
  let body = JSON.stringify( 'input': nameId );

等等。

我试过这个：Angular2 - Http POST request parameters

按照JB Nizet的建议，我尝试创建POJO：

public class Company 
public String input;

public Company() 
    this.input = "";


public String getInput() 
    return this.input;


public void setInput(String input) 
    this.input = input;

在我的@Configuration 文件中注册：

@Bean
public Company getCompany()
    return new Company();

并将请求方法改为如下：

@RequestMapping(value = "/addcompany", method = RequestMethod.POST)
@ResponseBody
public void addCompany(Company company) 
    eventService.addCompany(company.input);

之后，我在 input=null 的方法中获得了 Company 对象。

然后我尝试从@Configuration注销Company@Bean并将请求方法更改为以下：

@RequestMapping(value = "/addcompany", method = RequestMethod.POST)
@ResponseBody
public void addCompany(@RequestBody Company company) 
    eventService.addCompany(company.input);

但在那之后我收到415 (Unsupported Media Type) 错误。

在pom.xml 我有以下杰克逊进口：

    <dependency>  
         <groupId>org.codehaus.jackson</groupId>  
         <artifactId>jackson-mapper-asl</artifactId>  
         <version>1.9.10</version>  
    </dependency> 

用它代替第二个杰克逊版本解决了这个问题：

    <properties>
        ...
        <jackson.version>2.7.5</jackson.version>
    </properties>
    <dependency>
        <groupId>com.fasterxml.jackson.core</groupId>
        <artifactId>jackson-databind</artifactId>
        <version>$jackson.version</version>
    </dependency>
    <dependency>
        <groupId>com.fasterxml.jackson.core</groupId>
        <artifactId>jackson-core</artifactId>
        <version>$jackson.version</version>
    </dependency>
    <dependency>
        <groupId>com.fasterxml.jackson.core</groupId>
        <artifactId>jackson-annotations</artifactId>
        <version>$jackson.version</version>
    </dependency>

【参考方案1】：

您正在发送一个 JSON 对象作为正文，并且您希望获得一个包含此 JSON 对象属性的请求参数。

那不会发生。您需要一个与发送的 JSON 结构相匹配的 POJO，将该 POJO 作为参数并使用@RequestBody 对其进行注释。 Jackson 会将 JSON 解组为 POJO，然后 POJO 将传递给您的方法。

如果请求包含 application/x-www-form-urlencoded 有效负载，则可以使用请求参数：您在提交 html 表单时发送的有效负载类型，无需执行任何 javascript。

【讨论】：

我尝试了您建议的方法，现在我得到了一个参数“输入”等于 null 的 POJO。

所以，我想绑定需要修复或smth，不确定

编辑您的问题并发布此 POJO 的代码和 addCompany 方法的新代码。还要确保浏览器实际发送了非空输入。

不要在你的配置中注册它。它不应该是单例 Spring bean。每次调用该方法时，只需由 Spring 创建和填充一个 POJO。而且，正如我上面所说，参数必须使用 RequestBody 进行注释：public void addCompany(@RequestBody Company company).

是的，已经解决了，也是错误的jackson版本。非常感谢！

【参考方案2】：

而不是 let body = JSON.stringify( input: nameId );

试试 let body = input: nameId ;

【参考方案3】：

尝试使用：

let body:string='input='+nameId;

并使用这个标题

let headers = new Headers( 'Content-Type': 'application/x-www-form-urlencoded', 'X-CSRF-TOKEN':this.getToken() );

如果您要发送超过 1 个参数，仅适用于其他读者。使用 something & 来回分隔参数。像下面的代码

let body :string='username='+username+'&password='+password;