Kann nicht verbinden react.js Login SpringBoot App

Question

Ich versuche, REST-Endpunkte auf einer Anwendung (Spring-Boot) von einem anderen (reactjs) aufzurufen. Die Anwendungen werden auf den folgenden Hosts und Ports ausgeführt.

• REST-Anwendung, mit Federverschluß, http://localhost:8080
• HTML-Anwendung, mit reactjs, http://localhost:9000

Ich versuche, die Login-Informationen von reactjs senden to-Boot zu springen, aber ohne Erfolg.

Reactjs:

import React from 'react'; 


export default class Login extends React.Component { 
constructor() { 
    super(); 
    this.state = { 
     login:"", 
     password:"" 
    }; 

    this.handleChange = this.handleChange.bind(this); 

} 

handleChange() { 
    this.setState({login: this.state.login}); 
} 


render() { 

    return (
     <form role="form"> 
      <div> 
       <input type="text" name="login" onChange={this.handleChange} /> 
       <input type="password" name="password"/> 
      </div> 
      <button onClick={this.login.bind(this)}>Login</button> 
     </form> 
    ); 
} 


login() { 


    var xmlhttp = new XMLHttpRequest(); // new HttpRequest instance 
    var url = "http://localhost:8080/test/login" 
    xmlhttp.open("POST", url); 
    xmlhttp.setRequestHeader("Content-Type", "application/json;charset=UTF-8"); 
    xmlhttp.send(JSON.stringify({login: this.state.login})); 
} 
} 

und Spring-boot:

@CrossOrigin(origins = "http://localhost:9000") 
@RequestMapping(value = "/test/login") 
public Boolean testLogin(@RequestParam String login) { 
    if (login.equals ("ajt")) 

    return true; 
    else { 
     return false; 
    } 
} 

Ich kann sehen, dass die beiden Apps für obwohl reactjs anschließen gibt mir 400-Fehler, wenn ich vorlegen, die Konsole der Frühlings-Boot-App sagt mir:

Resolved exception caused by Handler execution: org.springframework.web.bind.MissingServletRequestParameterException: Required String parameter 'login' is not present 

ich nur, dass aus der Frühjahr-Boot-Seite übernehmen kann, kann es nicht tra nslate was immer über react.js gesendet wird.

PS: Bär mit mir, ich habe für etwa 6 Monate codiert.

Answer 1

Ich wusste, dass dies bekannt vorkam. Sorry, meine letzte Antwort hat nicht alle Probleme behoben.

Ihr aktuelles Problem ist hier;

public Boolean testLogin(@RequestParam String login) { 

Sollte

public Boolean testLogin(@RequestBody String login) { 

EDIT :: Zweites Problem sein.

Ihre handleChange Funktion nimmt keine Werte an! Es sollte eher so aussehen;

handleChange(value) { 
    this.setState({login: value}); 
} 

Wenn Ihr Eingabefeld diese Funktion aufruft, muss es einen Wert von dem Eingang passieren in den Staat. Ihr derzeitiger Code ist im Wesentlichen derselbe;

this.state.login = this.state.login; 

Welche offensichtlich wird Sie nirgends bekommen.

Versuchen Sie diese Änderung. Wenn es immer noch nicht funktioniert, stellen Sie sicher, dass Sie Ihre Dev-Tools in Ihrem Browser öffnen und den Code Zeile für Zeile durchgehen, um sicherzustellen, dass er die gewünschten Werte ausführt und speichert.