Получение поста: 400 неверных запросов в ответ

Question

Здесь у меня есть форма регистрации. У меня есть поля имени пользователя и пароля. Я использую остальные API для отправки данных на сервер. Я не могу отправить данные напрямую. Я должен зашифровать данные и отправить токен на сервер. Я использую Jwt для отправки данных. Чтобы сгенерировать токен, я установил пакет npm i json -web-token. Я думаю, что я сделал ошибку при использовании токена jwt. Но я не могу это исправить.

 export class SignUp extends Component {
  constructor() {
    super();
    this.state = {
        username: '',
        Password: '',
        confirmPassword: '',
        token: ''

    }

    this.username = this.username.bind(this);
    this.Password = this.Password.bind(this);
    this.confirmPassword = this.confirmPassword.bind(this);
    this.SignUp = this.SignUp.bind(this);
}

username(event) {
    this.setState({ username: event.target.value })
}

Password(event) {
    this.setState({ Password: event.target.value })
}

confirmPassword(event) {
    this.setState({ confirmPassword: event.target.value })
}
SignUp(event) {

    var jwt = require('json-web-token');
    var secret = "topsecret";
    var payload = {
        "iss": "my_issurer",
        "aud": "World",
        "iat": 1400062400223,
        "username": this.state.username,
        "Password": this.state.Password,
    };
    const token = jwt.encode(secret, payload)
    console.log("token", token);
    const dtoken = jwt.decode(secret, token.value);
    console.log("dtoken", dtoken);


    fetch('url', {
        method: 'post',
        headers: {
            'Accept': 'application/json',
            'Content-Type': 'application/json',
        },

        body:  token.value


    }).then((Response) => Response.json())

        .then((Result) => {

            if (Result.Status === 'Success')

                this.props.history.push("/Home");
            else
                alert('Sorrrrrry !Account has not been created!!!!!')
        })
    }
  }

render() {

    return (

        <div>
            < form >
                < div class="row">
                    < div  >Sign Up </div >
                </div >

                < input type="text" onChange={this.username} placeholder="Enter username" />
                <br /><br />
                < input type="password" onChange={this.Password} placeholder="Enter Password" />
                <br /><br />
                <input type="password" onChange={this.state.confirmPassword} placeholder="ReEnter Password" />
                <br /><br />
                < Button onClick={this.SignUp}> Create Account</Button >
                <br /><br />
            </form >


        </div >
    );
}

}

Заранее спасибо.

Answer 1

Вам нужно будет использовать библиотеку JWT на стороне сервера, а не на стороне клиента.

Когда у вас есть пользовательский регистратор, этот пользователь отправит имя пользователя, пароль и другую информацию на ваш сервер, тогда вам нужно будет использовать библиотеку JWT для генерации токена для этого пользователя на основе вашего секрета и полезной нагрузки. .

Затем токен будет отправлен обратно этому пользователю на стороне клиента, и этот пользователь должен будет сохранить токен в локальном хранилище или файлах cookie. Если этому пользователю требуется доступ к вашему защищенному API отдыха, ему / ей необходимо отправить заголовок авторизации с токеном в запросе.

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