无法 post 来自 Ionic 应用程序的 HTTP 请求

Question

我正在尝试使用 ionic 框架登录本地托管的应用程序（目前）。

这是我用于登录的 nodejs 后端代码，原本用于 Web 应用程序，但现在我正在为 android 平台制作它

// process the login form
app.post('/login', passport.authenticate('local-login', {
    successRedirect: '/profile', // redirect to the secure profile section
    failureRedirect: '/login', // redirect back to the signup page if there is an error
    failureFlash: true // allow flash messages
}));

HTML 离子代码

    <ion-item>
        <ion-input type="text" placeholder="Email" name="email" [(ngModel)]="email"></ion-input>
    </ion-item>

    <ion-item>
        <ion-input type="password" placeholder="Password" name="password" [(ngModel)]="password"></ion-input>
    </ion-item>

</ion-list>

调用的登录函数：

login() {
this.http.post('10.222.103.169:8080/login', JSON.stringify({ email: this.email, password: this.password }))
    .map((response: Response) => {

        let user = response.json();
        console.log(user);
        if (user && user.token) {
            // store user details and jwt token in local storage to keep user logged in between page refreshes
            localStorage.setItem('currentUser', JSON.stringify(user));
        }
    }
}

如果我对 post 使用 .subscribe 方法，它会报错其他登录方式：

login() {
    this.http.post('10.222.103.169:8080/login', JSON.stringify({ email: this.email, password: this.password }))
    .subscribe(data => {
        console.log(data);
    });
}

Runtime Error Error in ./LoginPage class LoginPage - caused by: Failed to execute 'open' on 'XMLHttpRequest': Invalid URL

但是 link 是正确的并且有效现在的问题是它甚至没有向服务器发送 post 请求。

PS: 我是angular2的新手。

Answer 1

将参数分配给 URLSearchParams 对象

 login() {
 let params = new URLSearchParams;
params.append('email',this.email);
params.append('password',this.password);
    this.http.post('10.222.103.169:8080/login',search:params )
        .map((response: Response) => {
            let user = response.json();
            console.log(user);
            if (user && user.token) {
                // store user details and jwt token in local storage to keep user logged in between page refreshes
                localStorage.setItem('currentUser', JSON.stringify(user));
            }
        }
    }

Answer 2

你必须按照所示去做 below.This 是 post 的 Angular 方式 method.Hope 代码是自己的 explanatory.If 你需要任何帮助随时在下面发表评论。

      //login
      loginUser(email: string, password: string): Observable<any> {
        let headers = new Headers();
        headers.append('content-type', 'application/json');
        let body = { email: email, password: password };
        let options = new RequestOptions({ headers: headers });
        let url = this.authenticationEndPoint + encodeURI(username) + '&password=' + encodeURI(password);

        return this.http.post(url, body, options)
          .map(this.extractData)
          .catch(this.handleError);
      }

 //to extract data
  private extractData(res: Response) {
    let body = res.json();
    return body || {};
  }

  //to handle error
  private handleError(error: Response | any) {
    let errMsg: string;
    if (error instanceof Response) {
      const body = error.json() || '';
      const err = body.error || JSON.stringify(body);
      errMsg = `${error.status} - ${error.statusText || ''} ${err}`;
    } else {
      errMsg = error.message ? error.message : error.toString();
    }
    console.error(errMsg);
    return Observable.throw(errMsg);
  }

无法 post 来自 Ionic 应用程序的 HTTP 请求

Unable to post HTTP request from Ionic application

node.js

passport-local

passport.js

ionic2

angular