angular - 使用 Angular 在 HTTP 调用中获取表单数据
问题描述
This is how the authentication is supposed to be.
POST https://DomainName/api/v1/authentication?username= {username}&password={password}.. 这是打字稿认证调用代码
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"}
错误
"Unauthorized" and this is because the form values are not being sent to
the api as headers.
任何帮助深表感谢。谢谢。
解决方案
您是否在this.http.store(url,data)
幕后添加了 url 参数?
authentication?username={username}&password={password}..
如果不是快速的方法是自己做,
const url =`authenticationusername=${this.loginData.username}&password=${this.loginData.password}`
那么您可以做
this.http.store(url,this.loginData)
或者您可以查看 URL 参数https://angular.io/guide/http#url-parameters
推荐阅读
- string - 使用 string.find 在列表中查找字符串(Lua)
- android - 颤振错误:构建失败并出现异常
- tableau-api - 在文本表中隐藏特定总计
- python - 阻止数据库驱动程序和异步 Web 框架
- android-studio - 如何在 Android Studio 上导入 APK 文件
- excel - filling values up to last row in a dynamic range
- python - tkinter Class Object Not Defined
- r - 警告:包需要依赖于 R
- r - 从矩阵到ggplot
- javascript - 组件编写为不呈现的类