I have been tasked with connecting an existing Angularjs app to a third party service via API using Basic Auth credentials I got from the third party website. I am not as experienced with Angular and APIs as I would like, although I am familiar enough that I can research and find my own solutions.
I've created a local copy of the app to my computer and have successfully connected the application to another API that needs no authentication (JSONplaceholder), but once I switched to testing the private API I am running into 401 errors with the following:
Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.
I've been researching the problem for a couple of days and I believe the problem is probably due to me trying to access the data from localhost. I'm not finding a lot of documented cases out there that discuss using Angular's ngResource/$http to connect to a protected third party API using Basic Auth so I am starting to wonder if I am barking up the wrong tree with my approach.
I am currently part of a two man development team with no senior or lead dev in charge, I have not had much success in finding the right direction to take this project so I would appreciate any assistance with the following question.
Why is the data from JSONplaceholder accessible from localhost without a problem but the a call to the private API throw 401 erros? (Even with credentials in the header). Aren't both cross origin Requests?