Question

我在Angular 6中具有以下身份验证和登录服务：

import { Injectable } from '@angular/core';
import { HttpClient, HttpHeaders } from '@angular/common/http';
import { map } from 'rxjs/operators';
@Injectable({
  providedIn: 'root'
})

export class AuthApiService {
  public credentials:any=[];
  constructor(private http: HttpClient) { }


  login(username, password)
  {
    let headerOptions = new HttpHeaders();
    headerOptions.append('Content-Type', 'application/json');
    headerOptions.append("authorization", "basic aGM0YXBwOmHjddP5NjU=");
    let test = {user: username, pass: password};
    this.credentials = JSON.stringify(test);
    console.log("hi "+ this.credentials);
    return this.http.post('https://127.0.0.1/api/scripts/login.php', this.credentials, {
      headers: headerOptions
    }).pipe(map(
        res=>{
          console.log(res)
        },
        err=>
          console.log(err)
      ))
  }
}

当我单击“登录”按钮时：

a id="btn-login"  (click)="login()" class="btn btn-success">Login </a>

login.component.ts中的函数将执行身份验证服务的登录功能：

login(){
    this.auth.login("a", "p").subscribe(
      (data)=>{
        console.log(data)
      },
      (error)=>{
        console.log(error)
      }
    )
}

在php和url中，我正在浏览器中运行它，并且可以正确地1看到结果，但是单击按钮时控制台出现错误：

“（未知网址）的HTTP错误响应：0未知错误”

在“网络”标签上：

PHP脚本：

让我们从主类开始

<?php
header('Access-Control-Allow-Origin: *');
header('Content-Type: application/json');
header('Access-Control-Allow-Methods: GET, POST, PUT, PATCH, DELETE, HEAD, OPTIONS');
header('Access-Control-Allow-Headers: *');

error_reporting(E_ALL);

class api {
    private $username ="...";
    private $password ="...";
    private $db="...";
    private $host = "...";

    public $conn;

    //Connection

    public function connection(){
        try{
            $this->conn = new PDO("mysql:host=$this->host;dbname=$this->db", $this->username, $this->password);
            $this->conn->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
            $this->conn->exec("SET CHARACTER SET utf8");

            return $this->conn;
        }
        catch(PDOException $e){
            return $e->getMessage();
        }

    }

    //Login

    public function login($conn, $user){
        $login = "SELECT username FROM login WHERE username=:user LIMIT 1";
        $execLogin = $this->conn->prepare($login);
        $execLogin->bindValue(":user", $user);
        $execLogin->execute();
        $res = $execLogin->rowCount();

        return $res;
        // if($res>0)
        // {
        //     return json_encode($res);
        // }
        // else{
        //     echo 0;
        // }
    }

}

?>

然后，执行登录功能（https://127.0.0.1/api/scripts/login.php）：

<?php
header('Content-Type: application/json');

require_once('../api.php');

//Getting username and password from Ionic
$user="brital";
$pass = json_decode($_POST['credentials']);

$newApi = new api();
$conn = $newApi->connection();
$res = $newApi->login($conn, $user);
echo $res;
?>

Answer 1

好像您使用的是https，我猜这是自签名证书吗？然后可能是这里提到的相同问题：angular and self-signed SSL cert - ERR_INSECURE_RESPONSE

Ionic / Angular的“ 0未知错误”可能有很多原因。正如提到的另一条评论一样，这可能是CORS问题，但看来您已经正确设置了标题。

您可以直接在Chrome中浏览URL（在您的情况下为“ https://127.0.0.1/api/scripts/login.php”）来确认这是证书问题。您是否收到错误“ NET :: ERR_CERT_AUTHORITY_INVALID”？

（临时）解决方案如链接中所述-转到不安全选项，因此Chrome记得记住您的自签名证书。正确的方法当然是使用真实的证书。

Angular 6 HttpClient和PHP错误（未知网址）的HTTP失败响应：0未知错误

1 个答案: