Angular 5 中的 RequestOptions 已弃用符号错误 [英] RequestOptions deprecated symbol error in Angular 5
问题描述
我正在尝试将 Angular 4 中的代码改编为 Angular 5.我做了很多更改,但是关于 RequestOptions
有错误.代码是关于身份验证的,这就是我出错的地方:
import { Injectable } from '@angular/core';从@angular/http"导入{RequestOptions};从'../model/model.user'导入{用户};导入 'rxjs/add/operator/map';从@angular/common/http"导入 {HttpClient, HttpHeaders};@Injectable()导出类 AuthService {构造函数(公共http:HttpClient){}公共登录(用户:用户){const headers = new HttpHeaders();headers.append('Accept', 'application/json')//从用户名和密码创建 base64 编码的字符串const base64Credential: string = btoa( user.username + ':' + user.password);headers.append('授权', '基本' + base64Credential);//这是我遇到问题的地方:const httpOptions = new RequestOptions();httpOptions.headers = 标头;return this.http.get('http://localhost:8081/' + '/account/login' ,http选项).map(resp => {//如果响应中有 jwt 令牌,则登录成功const user = resp.json().principal;//返回的用户对象是主体对象如果(用户){//将用户详细信息存储在本地存储中,以在页面刷新之间保持用户登录状态localStorage.setItem('currentUser', JSON.stringify(user));}});}登出() {//从本地存储中删除用户以注销用户返回 this.http.post('http://localhost:8081/' + 'logout', {} ).map(resp => {localStorage.removeItem('currentUser');});}}
错误:使用了不推荐使用的符号请帮我更改 Angular 5 中的代码 (RequestOptions
)
您不应使用已弃用模块 @angular/http
中的 RequestOptions
.
如API文档中所述,options
现在属于以下类型:
{头文件?:HttpHeaders |{[标题:字符串]:字符串|细绳[];};观察?:HttpObserve;参数?:HttpParams |{[参数:字符串]:字符串|细绳[];};报告进度?:布尔值;responseType?: 'arraybuffer' |'斑点' |'json' |'文本';withCredentials?: 布尔值;}
因此你应该写:
const headers = new HttpHeaders();headers.append('Accept', 'application/json')const base64Credential: string = btoa( user.username + ':' + user.password);headers.append('授权', '基本' + base64Credential);this.http.get('http://localhost:8081/' + '/account/login', {标题:标题});
或者:
this.http.get('http://localhost:8081/' + '/account/login', {标题:{'接受':'应用程序/json','授权': '基本' + btoa(user.username + ':' + user.password)}});
I'm trying to adapt code in Angular 4 to Angular 5.
I made many changes but I had an error about RequestOptions
.
The code is about authentication and this is where I have the error:
import { Injectable } from '@angular/core';
import { RequestOptions} from '@angular/http';
import {User} from '../model/model.user';
import 'rxjs/add/operator/map';
import {HttpClient, HttpHeaders} from '@angular/common/http';
@Injectable()
export class AuthService {
constructor(public http: HttpClient) { }
public logIn(user: User) {
const headers = new HttpHeaders();
headers.append('Accept', 'application/json')
// creating base64 encoded String from user name and password
const base64Credential: string = btoa( user.username + ':' + user.password);
headers.append('Authorization', 'Basic ' + base64Credential);
// this is where i'm having a problem :
const httpOptions = new RequestOptions();
httpOptions.headers = headers;
return this.http.get('http://localhost:8081/' + '/account/login' ,
httpOptions)
.map(resp => {
// login successful if there's a jwt token in the response
const user = resp.json().principal; // the returned user object is a principal object
if (user) {
// store user details in local storage to keep user logged in between page refreshes
localStorage.setItem('currentUser', JSON.stringify(user));
}
});
}
logOut() {
// remove user from local storage to log user out
return this.http.post('http://localhost:8081/' + 'logout', {} )
.map(resp => {
localStorage.removeItem('currentUser');
});
}
}
error : deprecated symbol used
please help me changing the code in Angular 5 (RequestOptions
)
You shouldn't use RequestOptions
from the deprecated module @angular/http
.
As indicated in the API documentation the options
are now of the following type:
{ headers?: HttpHeaders | { [header: string]: string | string[]; }; observe?: HttpObserve; params?: HttpParams | { [param: string]: string | string[]; }; reportProgress?: boolean; responseType?: 'arraybuffer' | 'blob' | 'json' | 'text'; withCredentials?: boolean; }
Thus you should write:
const headers = new HttpHeaders();
headers.append('Accept', 'application/json')
const base64Credential: string = btoa( user.username + ':' + user.password);
headers.append('Authorization', 'Basic ' + base64Credential);
this.http.get('http://localhost:8081/' + '/account/login', {
headers: headers
});
Or alternatively:
this.http.get('http://localhost:8081/' + '/account/login', {
headers: {
'Accept': 'application/json',
'Authorization': 'Basic ' + btoa(user.username + ':' + user.password)
}
});
这篇关于Angular 5 中的 RequestOptions 已弃用符号错误的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!