Angular 2服务订阅了两次

18 浏览
0 Comments

Angular 2服务订阅了两次

我刚开始用Angular 2做第一个项目,遇到了服务的问题。

当我提交表单时,我有一个名为http的服务,但是当我提交表单时,http请求会执行两次。

login.component.html

login.component.ts

login() {
    this.service.login(this.user.email, this.user.password)
        .subscribe( res => {
            if (res == null) {
                alert("Fail");
            } else {
                res.password = null;
                this.user = res;
                alert("Welcome "+this.user.firstname+"!");
        }
    });
}

user.service.ts

login(email:string, password:string): Observable {
    let CryptoJS = require("cryptojs");
    let sha512 = CryptoJS.algo.SHA512.create();
    sha512.update(password);
    password = sha512.finalize().toString();
    return this.http.post(`${this.baseUrl}/user/login`, 
        {email: email.trim(), password: password.trim()}, 
        {headers: this.headers })
    .map(res => res.json())
    .catch(this.handleError);
}

我添加了一些console.log("test");来检查哪个方法被调用了两次,但是看起来没有方法被调用了两次,只有HTTP请求被浏览器的网络控制台捕获到了。

0
0 Comments

问题的出现原因是混淆了OPTIONS请求和POST请求,并错误地将两个POST请求作为了一个POST请求。

解决方法:

1. 理解Cross-Origin Resource Sharing(CORS)标准,了解OPTIONS请求和POST请求的区别。

2. 确保服务器正确处理OPTIONS请求,响应正确的HTTP头信息,以允许浏览器发送实际的POST请求。

3. 检查代码中是否存在重复订阅的问题,确保只订阅一次。

0