What is the cause of the get request error?

A

Adel Khalitov2019-02-16 22:21:42

Angular

Adel Khalitov, 2019-02-16 22:21:42

I implemented the client part in angular, nodejs backend.
The request looks like this

getHTTP(url) {
    return this.http.get(url).subscribe((data) => {
      console.log(data);
    }, (error) => {
      console.log("Error", error);
    });
  }

The request, before reaching the server, tries to open the page localhost:4200/getLeadList
Although, logically, it should send a get request to the backend node, take information from the database, and then return the data.
Here is the error code:

Error HttpErrorResponse {headers: HttpHeaders, status: 200, statusText: "OK", url: "http://localhost:4200/getLeadList", ok: false, …}error: {error: SyntaxError: Unexpected token < in JSON at position 0
    at JSON.parse (<anonymous>)
    at XMLHtt…, text: "<!doctype html>
↵<html lang="en">
↵<head>
↵  <meta…script" src="main.js"></script></body>
↵</html>
↵"}error: SyntaxError: Unexpected token < in JSON at position 0
    at JSON.parse (<anonymous>)
    at XMLHttpRequest.onLoad (http://localhost:4200/vendor.js:26888:51)
    at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (http://localhost:4200/polyfills.js:2781:31)
    at Object.onInvokeTask (http://localhost:4200/vendor.js:72332:33)
    at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (http://localhost:4200/polyfills.js:2780:60)
    at Zone.push../node_modules/zone.js/dist/zone.js.Zone.runTask (http://localhost:4200/polyfills.js:2553:47)
    at ZoneTask.push../node_modules/zone.js/dist/zone.js.ZoneTask.invokeTask [as invoke] (http://localhost:4200/polyfills.js:2856:34)
    at invokeTask (http://localhost:4200/polyfills.js:4102:14)
    at XMLHttpRequest.globalZoneAwareCallback (http://localhost:4200/polyfills.js:4139:21)message: "Unexpected token < in JSON at position 0"stack: "SyntaxError: Unexpected token < in JSON at position 0↵    at JSON.parse (<anonymous>)↵    at XMLHttpRequest.onLoad (http://localhost:4200/vendor.js:26888:51)↵    at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (http://localhost:4200/polyfills.js:2781:31)↵    at Object.onInvokeTask (http://localhost:4200/vendor.js:72332:33)↵    at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (http://localhost:4200/polyfills.js:2780:60)↵    at Zone.push../node_modules/zone.js/dist/zone.js.Zone.runTask (http://localhost:4200/polyfills.js:2553:47)↵    at ZoneTask.push../node_modules/zone.js/dist/zone.js.ZoneTask.invokeTask [as invoke] (http://localhost:4200/polyfills.js:2856:34)↵    at invokeTask (http://localhost:4200/polyfills.js:4102:14)↵    at XMLHttpRequest.globalZoneAwareCallback (http://localhost:4200/polyfills.js:4139:21)"__proto__: Errortext: "<!doctype html>
↵<html lang="en">
↵<head>
↵  <meta charset="utf-8">
↵  <title>CleanupCRM</title>
↵  <base href="/">
↵
↵  <meta name="viewport" content="width=device-width, initial-scale=1">
↵  <link rel="icon" type="image/x-icon" href="favicon.ico">
↵</head>
↵<body>
↵  <app-root></app-root>
↵<script type="text/javascript" src="runtime.js"></script><script type="text/javascript" src="polyfills.js"></script><script type="text/javascript" src="styles.js"></script><script type="text/javascript" src="vendor.js"></script><script type="text/javascript" src="main.js"></script></body>
↵</html>
↵"__proto__: Objectheaders: HttpHeaderslazyInit: ƒ ()lazyUpdate: nullnormalizedNames: Map(0) {}__proto__: Objectmessage: "Http failure during parsing for http://localhost:4200/getLeadList"name: "HttpErrorResponse"ok: falsestatus: 200statusText: "OK"url: "http://localhost:4200/getLeadList"__proto__: HttpResponseBase

Reply

Answer the question

In order to leave comments, you need to log in

3 answer(s)

A

Adel Khalitov, 2019-02-17
@SaveLolliPoP

I solved the problem, thanks to spnq and my time spent.
The problem is this.
No need to insert headers, as this adds unnecessary lines of code to the response, which then need to be processed.
I had a handler for any get request

app.get('*', function(req, res) {
    res.sendFile(path.join(__dirname, '/dist/cleanupCRM/index.html'));
});

, which stood before the main one, which was supposed to process my get(/getLeadList)

router.get('/getLeadList', function(req, res) {
    console.log('Дошло');
    db.Lead.find({}).then(function(leads) {
        console.log(leads);
        res.send(leads);
    });
});

The sequence was like this:

app.get('*', function(req, res) {
    res.sendFile(path.join(__dirname, '/dist/cleanupCRM/index.html'));
});
app.use('/', router);

This sequence was the problem.
It is necessary to change the sequence where my custom requests are initially processed, and after the processing of all the rest.

app.use('/', router);
app.get('*', function(req, res) {
    res.sendFile(path.join(__dirname, '/dist/cleanupCRM/index.html'));
});

S

spnq, 2019-02-16
@spnq

Try this.http.get(url, {responseType: 'text'})

A

Alyosha Russkikh, 2019-02-17
@SobakaRty

Wrong algorithm
Do as you were told above