Accesso ai dati dall'API privata (con credenziali di autenticazione di base) utilizzando Angular JS

Question

Accesso ai dati dall'API privata (con credenziali di autenticazione di base) utilizzando Angular JS

#1 da (1 voti)

0

Mi è stato assegnato il compito di connettere un'app di Angularjs esistente a un servizio di terze parti tramite API utilizzando le credenziali di autenticazione di base ricevute dal sito Web di terze parti. Non sono così esperto con Angular e API come vorrei, anche se sono abbastanza familiare da poter ricercare e trovare le mie soluzioni.

Ho creato una copia locale dell'app sul mio computer e ho connesso correttamente l'applicazione a un'altra API che non richiede autenticazione (JSONplaceholder), ma una volta passato a testare l'API privata sto correndo in 401 errori con il seguenti:

Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.

Ho cercato il problema per un paio di giorni e credo che il problema sia probabilmente dovuto al fatto che sto cercando di accedere ai dati da localhost. Non sto trovando molti casi documentati là fuori che discutono utilizzando Angular's ngResource / $ http per connettersi a un'API di terze parti protetta utilizzando l'autenticazione di base, quindi sto iniziando a chiedermi se sto abbaiando dall'albero sbagliato con il mio approccio.

Attualmente faccio parte di un team di sviluppo composto da due persone senza responsabile senior o lead, non ho avuto molto successo nel trovare la giusta direzione per portare a termine questo progetto, quindi gradirei qualsiasi tipo di assistenza con la seguente domanda.

Perché i dati di JSONplaceholder sono accessibili da localhost senza problemi, ma una chiamata all'API privata genera errori 401? (Anche con le credenziali nell'intestazione). Non sono entrambe le richieste dell'origine incrociata?

api angularjs

posta user218568 01.03.2016 - 18:22

fonte

1 risposta

Leggi altre domande sui tag api angularjs

Consigli per organizzare le modifiche al codice in GIT impostazione automatica dei membri della classe come la classe operativa dei server Photon

score 1 · Answer 1

Suppongo che tu stia facendo una richiesta GET all'API privata.

Ciò che hai incontrato è la protezione CORS ed è implementata dal browser per motivi di sicurezza, che probabilmente conosci ora dopo i tuoi giorni di ricerca:)

Comunque, l'API JSONplaceholder probabilmente ha un * nella sua risposta per i diritti di controllo degli accessi, che dovresti essere in grado di verificare costruendo manualmente la tua richiesta http con qualcosa come Fiddler o cURL. Una stella significa "A tutti è consentito l'accesso incrociato a questa risorsa". E sembrerebbe che l'API privata non lo imponga, tuttavia dovrebbe funzionare anche se lo si esegue da localhost, poiché il browser ignora i problemi CORS da localhost. Lo stai servendo attraverso un server web e non direttamente dal tuo filesystem, giusto? (http: // vs. file: //).

Devi contattare i proprietari delle API private per sapere come preferiscono accedere alle loro API. Se sei sfortunato, devi usare un server proxy proxy CORS, o vedere se servono jsonp (Anche se non consiglierei mai jsonp - di nuovo, sicurezza :)).

Ho fatto una risposta abbastanza simile a quella che penso che devi fare qui: Tentativo di effettuare una richiesta AJAX di un dominio incrociato su un server che non possiedo - spero che sarà utile.

Modifica; dai commenti:

La nostra app comunica con un'API basata su PHP che recupera i dati dai siti Web dei clienti. Questo dovrebbe essere considerato 'Costruisci o installa il tuo proxy CORS di cui ti fidi' come hai detto nell'altra domanda

No. La tua app viene eseguita nel browser. Il browser applica un modello di sicurezza per evitare che i prelievi cross-site provengano da un dominio diverso da quello di hosting. Per disabilitare questo, il server di destinazione deve dirti che va bene così. Tuttavia, puoi evitarlo con 'CORS proxy'ing', il che significa che, invece di inviare una richiesta GET al server di destinazione dal browser, devi inviare una richiesta GET dal tuo browser al tuo server, che poi inoltrerà la richiesta GET OTTENERE la richiesta al server di destinazione, in modo che il server funzioni effettivamente come un proxy. Con questo approccio, il browser invierà solo richieste GET al tuo server HTTP, e il tuo server sarà sempre considerato affidabile dal browser, poiché è anche quello che ha servito la tua "app" in primo luogo.