-1

I'm not able to get .json data using AgGrid community edition. The file resides on a webserver, but it just hangs.

//These two works as expected
this.rowData$ = this.http
  .get<any[]>('https://www.ag-grid.com/example-assets/row-data.json');
this.http.get('https://www.ag-grid.com/example-assets/row-data.json').subscribe(data => {
  console.log(data.toString);
})
//For some reason exact same .json page on another location does not work
this.http.get('https://localhost/row-data.json').subscribe(data => {
  console.log(data.toString);
})

As long as I'm getting .json data from ag-grid.com, everythin works. If I try to get exact same .json data from localhost or any other open webpage domain, the http.get no longer retrives data. It just hangs (no error returned). Any suggestions on how to handle this?

In my opinion AgGrid should be able to retrieve .json data that resides on another server, no questions asked when using this lib? import { HttpClient } from '@angular/common/http';

Brage Mogstad
  • 1
  • 1
  • 1
    can you try using `http://` instead of `https://` for the localhost call, to see what happens? – Francisco Santorelli Mar 09 '23 at 13:12
  • I've tried both http, https & plain localhost, but no luck. I've copied the .json page to other website I manage, but the call is still not working. Ofcourse made sure these calls actually works in an browser, and returns a .json file as it should. My guess so far, is they blocked it, and it would work under enterprise setting. – Brage Mogstad Mar 10 '23 at 01:14

1 Answers1

0

First of all, you seem to be confusing ag-grid with the rest of your application. You appear to be blaming ag-grid for not being able to retrieve data from a particular url. The grid does not fetch the data from the url - your application does, via the angular HttpClient. So, if you fix your application, ag-grid will work.

That said, here's what I suspect is happening:

When you try to access http://localhost/...., it's likely that you are accessing the Angular app via the app's development server on port 4200, and your request for json data is not specifying a port, so it defaults to port 80. Probably, either you don't have a server running on port 80, or if you do, your request is probably being blocked by CORS.

Similarly, when you make a request to ag-grid.com, I assume that they have properly set up their server to provide CORS headers that allow your app to access it. When you attempt to access an api at another location, you are probably accessing a server that has not set up the proper CORS headers.

To understand this, search here on SO for "CORS", or take a look at how I answered a CORS question 4 or 5 years ago at https://stackoverflow.com/a/52048304/982341 (the answer should still be valid)

GreyBeardedGeek
  • 29,460
  • 2
  • 47
  • 67
  • Thanks, you are right I was blaming Ag-Grid for the HttpClient not fetching data. I'm rather new to Angular. Anyway, I was surprised to see a totally public, open browsable webpage that opened in Chrome and Edge could not be accessed, probably due to CORS limitations. I'm pretty sure the client side of the app is properly set up. The only domain I manage 100% is localhost, and its set up with MIIS. I read your post, and honestly, I feel like I this should be a check/unckeck a property in my MIIS server. I'm rather used to .asp & aspx .net server pages communicating with a backend db. – Brage Mogstad Mar 13 '23 at 15:20