最新消息: 电脑我帮您提供丰富的电脑知识,编程学习,软件下载,win7系统下载。

Angular 6,在HttpClient请求之后,始终返回错误消息“ [[url here]的Http错误响应:0未知错误”]

IT培训 admin 3浏览 0评论

Angular 6,在HttpClient请求之后,始终返回错误消息“ [[url here]的Http错误响应:0未知错误”]

我是Angular的新手,我正尝试使用angular 6 HttpClient发出请求,但它给了我响应

ERROR 
{…}
​
error: error { target: XMLHttpRequest, isTrusted: true, lengthComputable: false, … }
​
headers: Object { normalizedNames: Map(0), lazyUpdate: null, headers: Map(0) }
​
message: "Http failure response for http://localhost:8088/home: 0 Unknown Error"
​
name: "HttpErrorResponse"
​
ok: false
​
status: 0
​
statusText: "Unknown Error"
​
url: "http://localhost:8088/home"
​
<prototype>: Object { … }
vendor.js:43414:33

我已经在expressjs中编写了后端,并且添加了标头以允许跨源访问

我怎么知道这是特定于角度的问题,1.用Java编写测试代码以对服务器进行http调用(有效)。2.我直接从浏览器拨打了电话,并在其中得到了预期的响应。

Express App:

app.all('*', function(res,req,next){
    res.header('Access-Control-Allow-Origin','http://localhost:4200');
    res.header('Access-Control-Allow-Credentials',true);
    res.header('Access-Control-Allow-Methods','PUT, GET, POST, DELETE, OPTIONS');
    res.header('Access-Control-Allow-Headers','Content-Type');
    next();
});

app.listen(portNumber,(error)=>{
    if (error) throw error
    console.log("Now listening on port "+portNumber+" for server : localhost")
})

app.get("/home",(req,res)=>{
    res.status(400);
    res.send({name:"colin",age:10});
})

Angular App:

ngOnInit() {
    this.getData();
  }

  getData() {
    const httpOptions = {
      headers: new HttpHeaders({
        'Content-Type':  'application/json',
        'Access-Control-Allow-Origin': '*'
      })
    };
    let data = this.httpClient.get('http://localhost:8088/home', httpOptions).subscribe();
    console.log(data);
  }

我用Java编写的测试(我编写此测试是为了确保它不只是服务器问题):

try
            {
            link = "http://localhost:8088/home";
            link = link.replaceAll("\\s","%20"); // replace all space with %20 that is recognizable by http
            URL url = new URL(link);
            HttpURLConnection conn = (HttpURLConnection) url.openConnection();
            conn.setRequestMethod("GET");
            try
            {
                rd =  new BufferedReader(new InputStreamReader(conn.getInputStream()));
            } catch (ConnectException e)
            {
                e.printStackTrace();
            }

            String line;
            while ((line = rd.readLine()) != null) {
                result.append(line);
            }
            rd.close();
        } catch (IOException e) {
            e.printStackTrace();
        }
        System.out.println(result.toString());

还有回应?

{"name":"colin","age":10}
回答如下:

您的响应在调用的异步回调中:

Angular 6,在HttpClient请求之后,始终返回错误消息“ [[url here]的Http错误响应:0未知错误”]

我是Angular的新手,我正尝试使用angular 6 HttpClient发出请求,但它给了我响应

ERROR 
{…}
​
error: error { target: XMLHttpRequest, isTrusted: true, lengthComputable: false, … }
​
headers: Object { normalizedNames: Map(0), lazyUpdate: null, headers: Map(0) }
​
message: "Http failure response for http://localhost:8088/home: 0 Unknown Error"
​
name: "HttpErrorResponse"
​
ok: false
​
status: 0
​
statusText: "Unknown Error"
​
url: "http://localhost:8088/home"
​
<prototype>: Object { … }
vendor.js:43414:33

我已经在expressjs中编写了后端,并且添加了标头以允许跨源访问

我怎么知道这是特定于角度的问题,1.用Java编写测试代码以对服务器进行http调用(有效)。2.我直接从浏览器拨打了电话,并在其中得到了预期的响应。

Express App:

app.all('*', function(res,req,next){
    res.header('Access-Control-Allow-Origin','http://localhost:4200');
    res.header('Access-Control-Allow-Credentials',true);
    res.header('Access-Control-Allow-Methods','PUT, GET, POST, DELETE, OPTIONS');
    res.header('Access-Control-Allow-Headers','Content-Type');
    next();
});

app.listen(portNumber,(error)=>{
    if (error) throw error
    console.log("Now listening on port "+portNumber+" for server : localhost")
})

app.get("/home",(req,res)=>{
    res.status(400);
    res.send({name:"colin",age:10});
})

Angular App:

ngOnInit() {
    this.getData();
  }

  getData() {
    const httpOptions = {
      headers: new HttpHeaders({
        'Content-Type':  'application/json',
        'Access-Control-Allow-Origin': '*'
      })
    };
    let data = this.httpClient.get('http://localhost:8088/home', httpOptions).subscribe();
    console.log(data);
  }

我用Java编写的测试(我编写此测试是为了确保它不只是服务器问题):

try
            {
            link = "http://localhost:8088/home";
            link = link.replaceAll("\\s","%20"); // replace all space with %20 that is recognizable by http
            URL url = new URL(link);
            HttpURLConnection conn = (HttpURLConnection) url.openConnection();
            conn.setRequestMethod("GET");
            try
            {
                rd =  new BufferedReader(new InputStreamReader(conn.getInputStream()));
            } catch (ConnectException e)
            {
                e.printStackTrace();
            }

            String line;
            while ((line = rd.readLine()) != null) {
                result.append(line);
            }
            rd.close();
        } catch (IOException e) {
            e.printStackTrace();
        }
        System.out.println(result.toString());

还有回应?

{"name":"colin","age":10}
回答如下:

您的响应在调用的异步回调中:

发布评论

评论列表 (0)

  1. 暂无评论