使用angular在HTTP调用中获取表单数据

POST{username}&password={password}。。 这是typescript身份验证调用代码

This is how the authentication is supposed to be.

这是表单数据的代码

authenticate(url, payload){
let username: string = 'admin';
let password: string = 'password';
let headers: Headers = new Headers();
  headers.append("Authorization", "Basic " + btoa(username + ":" + password)); 
  headers.append("Content-Type", "application/json");
  headers.append("Access-Control-Allow-Origin", "*");
return this.http.post(server + url + addon, payload, { headers:headers });

用户数据

    // Getting data info from signing form
loginForm = new FormGroup({
username: new FormControl(null, ([Validators.required, Validators.minLength(5)])),
password: new FormControl(null, ([Validators.required, Validators.minLength(5)])),
})

登录功能

// user data 
loginData={
username:'',
    password:'',
}

buildLoginData(){
    this.loginData.password = this.loginForm.controls['password'].value;
this.loginData.username = this.loginForm.controls['username'].value;
}

响应日志数据

    signin(){
    this.loading =this.loadingCtrl.create({
  content:"Verifying Credentials ..."
});
this.loading.present();
    this.buildLoginData();
    console.log(this.loginData);
  this.http.store('authentication', this.loginData).subscribe((response)=>{
            // console.log(response);
            // console.log("*******************************************");
            // console.log(response['username']);
            localStorage.setItem('office_ID',response['officeId']);
            localStorage.setItem('user_ID', response['userId']);
            localStorage.setItem('username', response['username']);
            this.loading.dismissAll();
            this.navCtrl.push(HomePage);
  },error=>{
            this.loading.dismissAll();
                if(error.status === 401){
                    this.toastr.messenger('Wrong Username or Password');
                }else
    this.toastr.messenger('Login Failed!');
            console.log(JSON.stringify(error));
            alert("Error : " + error );
});    
}

错误

{"_body":"{\"developerMessage\":\"Invalid authentication details were 
passed in api request.\",\"httpStatusCode\":\"401\",\"defaultUserMessage 
\":\"Unauthenticated. Please login.\",\"userMessageGlobalisationCode
\":\"error.msg.not.authenticated\",\"errors
\":[]}","status":401,"ok":false,"statusText":"Unauthorized","headers":
{"Content-Type":["application/json"]},"type":2,"url":"https//x.x.x.x:xxxx            
/xxxxxxxxx/api/v1/authentication?tenantIdentifier=default"} 

---

非常感谢您的帮助。谢谢。

您的

是否使用此.http.store（url、数据）

在场景后面添加url参数

authentication？username={username}和password={password}..

如果不是，快速的方法是自己做

---

const url=`authenticationusername=${this.loginda.username}&password=${this.loginda.password}`

然后你可以做

this.http.store（url，this.loginda）

---

或者您可以查看URL参数

那么错误是什么？？？@UnluckyAj错误响应为“未经授权”，这是因为表单值没有作为标题发送到api。@JONATHANOKINE:请添加。将错误添加到您的问题中，以明确用户的帮助。如果没有，用户将不得不在您的评论中搜索错误，他们可能会监督它。@k.vincent我已经添加了它。谢谢username=${this.loginda.username}和password=${this.loginda.password}signin.ts:70:6{u body:“{\”developerMessage\：\”api请求中传递了无效的身份验证详细信息。\”，“httpStatusCode\”：\“401\”，“defaultUserMessage\”：“未经身份验证的。请登录。\”，“UserMessageGlobalationCode\：“error.msg.未经身份验证的\”，“errors\”：[]，“status”：401，“ok”：false，“statusText:“Unauthorized”，“headers:{“Content Type”：[“application/json”]}，“Type”：2，“url”：“}抱歉，将单引号更改为”`

 "Unauthorized" and this is because the form values are not being sent to                                                                                     
  the api as headers.