L'error CORS no era el meu codi

Veus un error CORS al navegador? No sempre vol dir que la teva configuració d'Express estigui malament. Aprèn a depurar tot el camí de la petició.

lunes, 27 de julio de 2026 • 5 min de lectura • Equip Q2BSTUDIO

Depuración de CORS en proxies inversos

Quan un equip de desenvolupament veu aquell molest missatge d'error CORS a la consola del navegador, la reacció instintiva és mirar cap al backend. 'Segur que alguna cosa falla en la configuració CORS de la meva API', es pensa. Tanmateix, la realitat pot ser molt diferent. He tingut l'oportunitat de depurar un escenari en el qual una aplicació frontend interactuava amb un servidor Express a través d'un proxy invers Apache. El navegador mostrava un error CORS, però en inspeccionar el flux complet em vaig adonar que la petició ni tan sols arribava al servidor Express. El problema no era al codi, sinó a la capa intermèdia.

Aquest tipus de situacions és més comú del que sembla. La política CORS l'imposa el navegador, no el servidor. Si un proxy, un balancejador de càrrega o un gateway retorna una resposta sense les capçaleres adequades (com Access-Control-Allow-Origin), el navegador ho interpreta com un error CORS, tot i que l'aplicació mai hagi vist la sol·licitud. Per això, quan apareix un error CORS al frontend, el primer que cal fer és rastrejar el recorregut complet: des del navegador fins al servidor final, passant per DNS, TLS, proxy invers i qualsevol altre intermediari.

En el meu cas, el flux era: Navegador → HTTPS → Apache (terminació TLS) → HTTP → Express. Apache gestionava el xifrat, per tant Express rebia la petició en text pla. El navegador, en enviar una sol·licitud HTTPS, esperava que la resposta inclogués capçaleres de seguretat i CORS correctes. Apache, ja sigui per no estar configurat per afegir Access-Control-Allow-Origin o per retornar un error 404 abans que la petició arribés a Express, provocava l'error. La lliçó: depurar únicament el missatge del navegador és insuficient; cal examinar cada salt de la cadena.

Un altre aspecte clau va ser la gestió de les capçaleres reenviades. Express necessita saber si la connexió original era segura. Per això, Apache ha d'incloure X-Forwarded-Proto: https i Express ha de confiar en el proxy mitjançant app.set('trust proxy', 1). Sense això, funcionalitats com les cookies segures (secure: true) fallen, i el backend pot pensar que tot és HTTP, generant inconsistències que també deriven en errors CORS o d'autenticació. Aquest tipus de detalls són crítics quan es despleguen aplicacions a mida en entorns cloud, on la infraestructura sol incloure proxies i balancejadors.

Des d'una perspectiva empresarial, entendre on es produeix realment un error estalvia hores de depuració i evita canvis innecessaris al codi. Moltes empreses subcontracten el desenvolupament dels seus sistemes, però després integren serveis externs com APIs de tercers, CDNs o gateways. Si l'equip no domina la ruta completa de la petició, qualsevol error CORS s'atribueix erròniament al backend, retardant lliuraments i augmentant costos. A Q2BSTUDIO, com a empresa de desenvolupament de programari i tecnologia, abordem aquests problemes amb un enfocament integral: des del cloud AWS/Azure fins a la capa de presentació, passant per la ciberseguretat i la intel·ligència artificial.

Per exemple, en un projecte recent d'un client, vam implementar un sistema d'agents IA que es comunicava amb una base de dades a través d'una API exposada mitjançant un proxy. Els errors CORS apareixien en fer peticions des del frontend React, i el client va pensar que era culpa de la configuració d'Express. No obstant, després de revisar el proxy, vam descobrir que un tallafoc corporatiu bloquejava certes capçaleres. La solució no va ser tocar el codi, sinó ajustar les regles del proxy i afegir les capçaleres adequades. Aquest tipus de coneixement només s'adquireix quan es té experiència en tota la pila tecnològica, una cosa que oferim a Q2BSTUDIO a través dels nostres serveis de ciberseguretat, BI/Power BI i desenvolupament d'agents IA.

La moral és clara: no assumeixis que un error CORS prové de la teva aplicació. La majoria de les vegades, el problema està en la infraestructura que envolta el teu codi: proxies mal configurats, capçaleres que no es reenvien, capes de seguretat que interfereixen, o fins i tot la manca de suport per a mètodes HTTP com OPTIONS (preflight). Quan treballem amb clients que necessiten aplicacions a mida, sempre incloem una fase de diagnòstic de la ruta de xarxa completa. Això inclou verificar que els proxies de cloud AWS/Azure estiguin configurats per gestionar CORS correctament, que els certificats TLS siguin vàlids i que les capçaleres de reenviament (com X-Forwarded-For i X-Forwarded-Proto) es propaguin sense problemes.

A més, en entorns on s'utilitzen agents IA o sistemes d'automatització, la comunicació entre frontend i backend sol ser tan complexa que un simple error de capçalera pot paralitzar tot el flux de dades. Per això, a Q2BSTUDIO combinem la nostra experiència en ciberseguretat amb el coneixement de Business Intelligence i Power BI per garantir que cada capa de l'arquitectura funcioni en harmonia. No es tracta només d'escriure codi net, sinó d'entendre com cada component interactua en l'ecosistema digital.

Per resumir: la propera vegada que vegis un error CORS al navegador, no t'afanyis a modificar el teu backend. Segueix el camí complet de la petició. Revisa els logs del proxy, comprova si la sol·licitud arriba al teu servidor, examina les capçaleres de resposta i assegura't que el proxy reenviï la informació de seguretat correctament. Si tot això sona complex, recorda que hi ha experts com els de Q2BSTUDIO que et poden ajudar a dissenyar i implementar solucions robustes, ja sigui en cloud AWS/Azure, amb aplicacions a mida o integrant intel·ligència artificial i agents IA. L'error CORS no era el teu codi; era el camí.

UNA PAUSA?

Juga una estona abans de marxar

ELS NOSTRES SERVEIS

Com et podem ajudar

Tens un projecte en ment?

Explica'ns la teva visió i la convertim en una solució de programari. Sigui quin sigui l'abast, fem realitat la teva idea.