Home > Net >  Angular can't parse huge JSON
Angular can't parse huge JSON

Time:03-01

I have an app made in angular with nativescript, the problem I have is, when I receive the data from the back end, I receive it like an error:

Angular code:

   return await this._clientesService
            .getFromBackend()
            .toPromise()
            .then(async (res: any) => {
                return res.data
            })

My service code:

getFromBackend() {
        return this._http.get(`${ConfigService[ConfigService.ACTIVE_SERVER]}clientes?get-all=true&vendedor=${ConfigService.SELECTED_VENDEDOR_ID}`)
    }

The error:

JS: ERRORRR {
JS:   "headers": {
JS:     "normalizedNames": {},
JS:     "lazyUpdate": null
JS:   },
JS:   "status": 200,
JS:   "statusText": "OK",
JS:   "url": "http://172.16.0.229:8000/api/clientes?get-all=true&vendedor=999",
JS:   "ok": false,
JS:   "name": "HttpErrorResponse",
JS:   "message": "Http failure during parsing for http://172.16.0.229:8000/api/clientes?get-all=true&vendedor=999",
JS:   "error": {
JS:     "error": {},
JS:     "text": "{\"data\":[{\"cliente\":0,\"digito\":0,\"cli_pessoa\":0,\"nome\":null,\"ruc\":null,\"email\":null,\"cidade\":null,\"rg\":null,\"fone\":null,\"endereco\":null,\"condV\":1},{\"cliente\":5911,\"digito\":59115,\"cli_pessoa\":2,\"nome\":null,\"ruc\":\"3671157 8\",\"email\":null,\"cidade\":\"HERNANDARIAS\",\"rg\":null,\"fone\":null,\"endereco\":null,\"condV\":1},{\"cliente\":47174,\"digito\":471741,\"cli_pessoa\":2,\"nome\":null,\"ruc\":\" -\",\"email\":null,\"cidade\":\"C D E \",\"rg\":null,\"fone\":null,\"endereco\":null,\"condV\":1},{\"cliente\":54543,\"digito\":545430,\"cli_pessoa\":2,\"nome\":\" ADOLFO BENITEZ\",\"ruc\":\...

I returned those datas from my back end made in Laravel 5.7:

return response()->json([
    "data" => ClientResource::collection($res),
    "query" => $request->cliente,
    "current_page" => $res->currentPage(),
    "last_page" => $res->lastPage(),
], 200);

The problem is that I had 60.000 records on my database and when I return 10 or 50 it's work, but when I return more of that it doesn't work and I don't know why,

In postman it work perfectly, I have this issue only in my angular application

I already try adding

{responseType: 'text'}

on my http.get, it's work but when I do JSON.parse() throws an error

JS: ERRORRR SyntaxError: Unexpected token , in JSON at position 58756

I already confirm my returned JSON with a JSON validator and is valid

All of that It's look like I have some error with my json but I don't because I got the same error if I return my json values in null, this is my json returned:

{
"data": [
    {
        "cliente": 13277,
        "digito": 132779,
        "cli_pessoa": 2,
        "nome": " ",
        "ruc": "1182263-5",
        "email": null,
        "cidade": "PDTE FRANCO",
        "rg": null,
        "fone": "0973-504455",
        "endereco": null,
        "condV": 1
    },
    {
        "cliente": 14539,
        "digito": 145390,
        "cli_pessoa": 2,
        "nome": " ",
        "ruc": null,
        "email": null,
        "cidade": "MAYOR OTA O",
        "rg": null,
        "fone": "0983589662",
        "endereco": null,
        "condV": 1
    },
    {
        "cliente": 55231,
        "digito": 552315,
        "cli_pessoa": 2,
        "nome": " ",
        "ruc": null,
        "email": null,
        "cidade": "PDTE FRANCO",
        "rg": null,
        "fone": null,
        "endereco": null,
        "condV": 1
    },
    {
        "cliente": 58235,
        "digito": 582351,
        "cli_pessoa": 2,
        "nome": " ",
        "ruc": " 0",
        "email": null,
        "cidade": "C D E ",
        "rg": null,
        "fone": null,
        "endereco": null,
        "condV": 1
    },
    {
        "cliente": 6891,
        "digito": 68912,
        "cli_pessoa": 2,
        "nome": " ",
        "ruc": null,
        "email": null,
        "cidade": "HERNANDARIAS",
        "rg": null,
        "fone": "0983652354",
        "endereco": null,
        "condV": 1
    }
],
"query": null,
"current_page": 5,
"last_page": 11608

}

can someone help me on this ?

CodePudding user response:

I think your data is too large and somehow either your backend or angular limiting it. You should never return this type of huge data.

Try to limit selected fields in your Laravel Collection, or paginate them.

CodePudding user response:

Try to save all JSON in txt file and try online tools for parse. May be you have some string fields with special character causing issue white parsing the data

  • Related