Dovrei evitare di usare CORS se possibile?

Se esegui il back-end SOLO riceve richieste dal tuo client, assicurati di poter avere sia il client che il server sulla stessa origine e ciò semplificherà la tua implementazione in quanto non è necessario configurare CORS sul server web.
CORS è necessario per motivi di sicurezza, quindi non preoccuparti delle prestazioni, devi abilitare il tuo back-end per elaborare richieste di altre origini come già sai.

È possibile prevenire errori di preflight da specifici indirizzi IP e porte che è il modo consigliato di ospitare più servizi di interfaccia, con una prima configurazione condizionale per gestire le richieste pre-volo.

In relazione alla tua domanda, dipenderà da quali sono gli obiettivi all'interno della tua applicazione. Dato che entrambi i servizi sono ospitati sullo stesso IP attraverso diverse porte, i problemi CORS verranno comunque ricevuti come IP e la porta deve corrispondere.

L'hosting di entrambi i servizi sulla stessa macchina probabilmente ridurrebbe la latenza, che ospitarli sulla stessa porta e sullo stesso IP .. sarebbe rovinoso di un'architettura client / server e se il server API è in ascolto su una porta .. potrebbe bloccare l'accesso della SPA al funzionamento.

La risposta breve è che le persone non si renderanno conto molto all'interno dell'esperienza utente fino a quando il sistema non si ridimensionerà, tuttavia potrebbe non essere possibile avere il server API sulla porta 4200 con l'accesso client anche su 4200, sarà probabilmente necessario per utilizzare un'altra porta (cioè 80) per la SPA, ovvero porte separate, quindi ci sarebbe ancora CORS. Direi che l'opzione migliore sarebbe disabilitare gli errori CORS da tutti i computer durante la prototipazione e quindi ridurli all'IP SPA.

Come piccola nota aggiuntiva è necessario essere espliciti con l'IP, come se si usasse "localhost", in quanto l'IP SPA farà riferimento all'host locale del proprio computer e non al localhost del server che ospita il server API.

Per lo sviluppo di localhost, avere entrambi sullo stesso server è molto più semplice a causa del fatto che l'origine è la stessa. Inoltre, per i test del browser headless, questo semplifica la configurazione necessaria per testare con successo. Lo stesso vale per le app per dispositivi mobili che utilizzano le visualizzazioni Web. L'overhead è in generale meno generico, ma la mancanza di parità tra gli ambienti richiederà alcuni lavori architettonici:

Every Heroku app runs in at least two environments: on the Heroku platform (we’ll call that production) and on your local machine (development). If more than one person is working on the app, then you’ve got multiple development environments - one per machine, usually. Usually, each developer will also have a test environment for running tests.

This separation keeps changes from breaking things. You write code and check the site in development, but you run your tests in the test environment to keep them from overwriting your development database. Similarly, you might have broken features in your development environment most of the time, but you only deploy working code to production.

Unfortunately, this approach breaks down as the environments become less similar. Windows and Macs, for instance, both provide different environments than the Linux stack on Heroku, so you can’t always be sure that code that works in your local development environment will work the same way when you deploy it to production.

The solution is to have a staging environment that is as similar to production as is possible. This can be achieved by creating a second Heroku application that hosts your staging application. With staging, you can check your code in a production-like setting before having it affect your actual users. As you already deploy with git, setting up and managing these multiple remote environments is easy.

Riferimenti

• Come per correggere l'errore CORS (Cross Origin Request Security) in Firefox, Chrome e IE

• Il browser non riconosce Access-Control-Allow-Origin se è un dominio IDN - Microsoft Edge Development

• Note sulla versione - Anteprima della tecnologia Safari - Safari - Sviluppatore Apple

• Rilevamento dei browser senza testa

• appium numero # 2003

• Gestione di più ambienti per un'app | Heroku Dev Center