我嘗試用Ionic2開發我的新應用程序。在這種情況下,用戶應該使用預共享令牌進行認證,該共享令牌將被髮送到api(http請求)。作爲迴應,他得到一個訪問令牌,他可以使用更多的API功能。Ionic2:Http發送{「isTrusted」:true} - 與其他可觀察對象衝突?
問題是,當我發送HTTP請求時,出現錯誤: {「_body」:{「isTrusted」:true},「status」:200,「statusText」:「Ok」,「標題「:{},」type「:3,」url「:null}
在我的桌面版本中,一切正常,但在Android上出現此錯誤。我仍然使用了這個錯誤,我猜測http請求與其他可觀察對象(Form observable)有衝突。
如果有人能幫我避免這個「錯誤」,我會非常高興。 作爲一個小提示:{「isTrusted」:true}是方法handleSubmit的事件值的值。謝謝:-)
解決方法: 由於api無法訪問(在我的情況下是由於證書錯誤),因此引發此錯誤。當你有相同的錯誤: 檢查是否type =「3」,那麼你的http目標也可能無法訪問。
我的模板:
<ion-content padding class="token-auth">
<form [ngFormModel]="authForm" (submit)="handleSubmit($event)">
<ion-item>
<ion-label floating>Device-ID</ion-label>
<ion-input (keyup)="onKeyUp($event)" [ngFormControl]="token" type="text"></ion-input>
</ion-item>
<div *ngIf="error !== null"
class="error-box">
{{error.message}}
</div>
<button block type="submit" [disabled]="!authForm.valid">
Register device
</button>
</form>
</ion-content>
頁來源:
handleSubmit(event) : void {
this.tokenService.sendAccessTokenRequest(this.authForm.value.token, (err, code) => {
this.error = {
code : code,
message : err
};
}, (accessToken, refreshToken, validTill) => {
this.error = null;
});
}
TokenService:
/**
*
* @param token
* @param errCallback : (message : string, code : number) => any
* @param callback : (accessToken : string, refreshToken : string, validTill : string) => any
*/
public sendAccessTokenRequest(token : string, errCallback, callback) {
if (typeof token === 'undefined') {
throw 'Token value must be set. ';
}
if (typeof errCallback === 'undefined') {
errCallback = (code, message) => null;
}
if (typeof callback === 'undefined') {
callback = (accessToken, refreshToken, validTill) => null;
}
console.log(`Should send token: ${token}`);
this.sendPost(`/auth/login`, `application=XXX&device_token=${token}`)
.subscribe(res => {
console.log("Device verified: "+JSON.stringify(res));
let {
access_token,
refresh_token,
valid_till
} = res.data.token;
this._saveTokenData(access_token, refresh_token, new Date(valid_till));
callback(access_token, refresh_token, valid_till);
},
err => {
// error is here!
if (err && err._body) {
console.log("ERROR: "+JSON.stringify(err));
try {
let bodyData = JSON.parse(err._body);
let responseData = bodyData["data"];
let token:MessageResponse = responseData.token;
if (token && typeof token.code !== 'undefined' && typeof token.userMessage !== 'undefined') {
errCallback(token.userMessage, token.code);
} else {
errCallback(bodyData);
}
} catch (e) {
errCallback(e);
}
}
},
() => console.log("access token request successful")
);
}
// just an excerpt from other url
sendPost(link : string, params : string, header : Object = {}) {
console.log("SEND POST");
link = this._enforceSlashAtStringStart(link);
return this.http.post(`${this.base_url}${link}`, params, {
headers : this._mergeHeader(this.getHeader(), header)
}).map(res => { console.log("Start mapping! "); return res.json(); });
}
// EDIT: added function _saveTokenData
private _saveTokenData(accessToken : string, refreshToken : string, validTill : Date) {
if (!accessToken || !refreshToken || !validTill) {
throw new Error('access token data can not be null or undefined! ');
}
console.log("TOKEN SAVED!");
this._accessToken = accessToken;
this._refreshToken = refreshToken;
this._validTill = validTill;
// this._storage = new Storage(LocalStorage);
this._storage.set(TOKEN_STORAGE_KEY, JSON.stringify({
access_token : accessToken,
refresh_token : refreshToken,
valid_till : validTill.toString()
}));
}
最後但並非最不重要的日誌:
14 256534 log Should send token: XXXXXXXXXXXXXX
15 256548 log SEND POST
16 256750 log ERROR: {"_body":{"isTrusted":true},"status":200,"statusText":"Ok","headers":{},"type":3,"url":null}
'_saveTokenData'方法有什麼作用? –
對不起,我添加了這個功能。它只將三個變量保存到本地存儲。 – CapCa
好的。您可以向跟蹤添加請求的完整網址嗎?我的意思是「'$ {this.base_url} $ {link}'」。謝謝! –