Cookies Angular 2 http post重新加载页面,注销不';不能删除会话cookie

Cookies Angular 2 http post重新加载页面,注销不';不能删除会话cookie,cookies,authorization,angular,Cookies,Authorization,Angular,我有一个Angular 2服务,具有注销功能。当从应用程序组件调用该函数时,会导致整页刷新。当使用angular 1项目时,我没有经历过这种行为。如果我用邮递员调用注销端点,会话cookie将被删除。如果我使用angular 2身份验证服务,它不会被删除 服务 import {Injectable} from 'angular2/core'; import {User} from './user'; import {Headers, RequestOptions, Http, Response}

我有一个Angular 2服务,具有注销功能。当从应用程序组件调用该函数时,会导致整页刷新。当使用angular 1项目时,我没有经历过这种行为。如果我用邮递员调用注销端点,会话cookie将被删除。如果我使用angular 2身份验证服务,它不会被删除

服务

import {Injectable} from 'angular2/core';
import {User} from './user';
import {Headers, RequestOptions, Http, Response} from 'angular2/http';
import {Observable} from 'rxjs/Observable';
import {Cookie} from '../extensions/cookies';

@Injectable()
export class AuthenticationService {

    constructor (private http: Http) {}

    private _prepTestHost = 'http://localhost:8000/';
    private _prepTestLoginUrl = this._prepTestHost + 'login/';
    private _prepTestLogoutUrl = this._prepTestHost + 'logout/';

    private _authenticated: boolean;

    getUser() {}

    isAuthenticated() {
        return this._authenticated;
    }

    setAuthenticated() {
        this._authenticated = true;
    }

    loginUser(username, password) : Observable<User> {
        let body = JSON.stringify({username, password});
        let headers = new Headers({ 'Content-Type': 'application/json' });
        let options = new RequestOptions({ headers: headers });

        return this.http.post(this._prepTestLoginUrl, body, options)
                                .map(res => <User> res.json(), this.setAuthenticated())
                                .catch(this.handleError)
    }

    logoutUser() : Observable<void> {
        let body = JSON.stringify({});
        let csrfcookie = Cookie.getCookie('csrftoken');
        let headers = new Headers({
            'X-CSRFToken': csrfcookie,
            'Content-Type': 'application/json'
        });
        let options = new RequestOptions({ headers: headers});
        return this.http.post(this._prepTestLogoutUrl, body, options)
                        .map(res => <void> res.json())
                        .catch(this.handleError);

    }

    private handleError (error: Response) {
        // in a real world app, we may send the server to some remote      logging infrastructure
        // instead of just logging it to the console
        console.error(error);
        return Observable.throw(error.json().error || 'Server error');
    }
}

你可以做一些粗制滥造的事,但我想不出别的办法

Cookie.setCookie(nameOfCookie, "", -1);
这将有效地在注销时删除cookie。我很想知道是否有更好的方法


我也不知道你为什么会得到任何类型的页面重新加载,我还没有在我做过的任何事情上体验到这一点,希望其他人会知道。

我认为页面重新加载是因为你在布局按钮上阻塞时没有阻止事件传播(你是一个带有“href”属性的“a”HTML元素)。您可以在注销函数的末尾使用“return false”或“$event.stopPropagation()”

有关更多详细信息,请参见问题:

关于cookie问题,我建议您使用跨域请求(COR)。我认为您应该尝试将底层XHR对象上的“withCredentials”属性设置为true。有关更多详细信息,请参见此问题:


页面刷新是否有错误?如果是的话,请把我曾经遇到的问题贴出来,可能会对你有帮助。@PardeepJain,似乎没有错误。我的服务器响应状态为200,会话在服务器上被破坏。哦,好的……我认为您的
logoutUser
you
.map
返回
null或void
的可观察对象中还有一个错误,您订阅了null。可能这一个在某种程度上也会影响到它。我可以知道你发布的语法是javascript删除cookie的语法吗?@PardeepJain它来自angular2的一个扩展,我认为他正在使用它,并且他有相同的语法。@MorganG删除
href=“#”
似乎还让处理清除sessionid cookie的代码执行,并正确删除cookie。我从未使用angular 1应用程序手动删除sessionid Cookie,现在angular 2中的情况似乎也一样。谢谢你的帮助。蒂埃里·坦普尔的回答是正确的。@MichaelB没问题!Thierry通常是正确的,并且有更好的解决方案。很高兴他能回答你的问题!是
href=“#”
导致页面重新加载。这掩盖了我正在研究的抛出的错误。我已经设置了withCredentials属性,我已经添加了上面的代码`
import {BrowserXhr, HTTP_PROVIDERS} from "angular2/http";
import {Injectable, provide} from "angular2/core";

@Injectable()
export class CORSBrowserXHR extends BrowserXhr{
    build(): any{
        var xhr:any = super.build();
        xhr.withCredentials = true;
        return xhr;
    }
}
Cookie.setCookie(nameOfCookie, "", -1);