Back to forum

I am using Angular 8 along with webdatarocks, how to call or Read  REST API (JSON) with Basic Authorization.

Answered

Hi Webdatarocks Team,
I am using Angular 8 along with webdatarocks, how to call or Read  REST API (JSON) with Basic Authorization.
Also when I am trying to upload Local JSON I am getting error JSON data is invalid.
I am stuck here please help me.
Regards,
Rajeev

3 answers

Bigyan Chapagain ⋅ February 27, 2020

When it comes to Authorization, it is about your backend code.
However, I can help you with frontend part in Angular:
 
example.component.ts ==>
import { NgModule, Component, ViewChild } from ‘@angular/core’;
import { WebDataRocksPivot } from ‘../../../webdatarocks/webdatarocks.angular4’;

@Component({
  selector: “app-root”,
  templateUrl: “./registered-user.component.html”,
  styleUrls: [“./registered-user.component.scss”]
})

export class RegisteredUserComponent {
  @ViewChild(‘pivot1’) child: WebDataRocksPivot;
  pivotReport: any;
  constructor() {
  this.pivotReport = 
    {
      “dataSource”: {
          “dataSourceType”: “json”,
          “filename”: “http://…yourURL”
      },
      “grid”: {“type”:”flat”,
         “showTotals”:”off”,
         “showGrandTotals”:”off”
        }
    };
  }
}
 
example.component.html ==>
 
<wbr-pivot #pivot1 [toolbar]=”true”
          [width]=”‘100%'”
          [height]=”500″
          [report]= “pivotReport”
          
    >
    WebDataRocks will appear here
</wbr-pivot>
 
 
Also, make sure, your backend throws a perfect quickly usable json file.
Your json data shouldn’t be embedded like a seed embedded in cucumber.
It should be verily available outside. It should look something like this:
 
[

{
“id”: 2,
“firstName”: “Bigyan”,
“middleName”: null,
“lastName”: “Chapagain”,
“photo”: null,
“phone”: 54543
},
{
“id”: 3,
“firstName”: “a”,
“middleName”: null,
“lastName”: “b”,
“photo”: null,
“phone”: 43543
}
]
If your data is embedded inside other parameters, then I am afraid, it simply doesn’t work!

Rajeev ⋅ March 4, 2020

Thank you,
it is working with GET but not working with POST Method with basic auth.
As per my observation i did’t find specific method for get and Post but direct JSON is reading.
If you have any solution for POST Method with basic auth please share.
 
Thank you.

Bigyan Chapagain ⋅ March 5, 2020

So far as I know, there is no such thing as POST in these kinds of Pivot Tables. To Post anything, you need to be able to type in a text box (or any other kind of input like radiobutton, boolean check box etc.) and there must be a submit button. Pivot Tables don’t allow that. Pivot tables are just used to display data. So naturally there is GET, no POST.

Correct me if I am wrong.

Move up