How to prevent CORB errors with Backbone and Node.js/Hapi?

Question

An update to Chrome in the past few days is causing some of the API calls from my SPA (Backbone.js) to my server (Node.js running Hapi) to be blocked with a CORB error. I am doing prototyping so no authentication is currently in place.

In backbone I am using the model url property and I do not see a way to specify header and payload type.

url: function () {
     return 'http://localhost:4000/api/getSpotPrices/' + energy.type);
}

Do I need to change settings in Hapi to prevent this from occurring?

[Update] I added a CORS setting to my Hapi configuration and set it to wildcard:

server.route({
    config: {
        cors: {
            origin: ['*']
        }
    },
    method: 'GET',
    etc...
}

And now Chrome throws the error:

The 'Access-Control-Allow-Origin' header contains multiple values 'http://localhost:63342, *', but only one is allowed.

So, without the CORS configuration CORB blocks my service call. With the CORS configuration setting CORS complains about too many entries in the header entry.

I never had or seen corb error before and I'm not sure if it's directly related to backend. In this question https://stackoverflow.com/questions/50873764/cross-origin-read-blocking-corb there are some relevant answers. Have you checked it already? — metoikos, Mar 08 '19 at 10:56
Yes I have. Thank you. I suspect this is due to the Chrome update two days ago. It appears to be pathological as I have two other, almost identical, API calls which succeed before this one fails. Same URL, same port, similar JSON payload. — Not a machine, Mar 08 '19 at 15:03
I am using plain JSON in the payload and the content validates perfectly. — Not a machine, Mar 08 '19 at 15:17
I updated my OP with additional information. I'm about ready to go crazy with this! — Not a machine, Mar 08 '19 at 23:10

score 1 · Answer 1 · answered Mar 09 '19 at 21:33

1

Do you have any additional headers in your request. That might cause this problem.

Here is my cors config that I am using with my react frontend.

cors: {
    origin: ['list of domains that white listed, no need for wildcard for me'],
    credentials: true, // for preflight request
    // these are the additional headers that i am using through my client code
    additionalHeaders: ['cache-control', 'x-requested-with', 'x-csrf-token', 'set-cookie'] 
},

answered Mar 09 '19 at 21:33

metoikos

1,315
11
18

No, I made sure I just had the one header until I enable OIDC authentication. Is your setting on a per route basis or for all your services? – Not a machine Mar 11 '19 at 00:43
For all services this is base server config. – metoikos Mar 11 '19 at 07:15
Would you be willing to paste your base server config example? The online docs are pretty comprehensive but are sorely lacking in working examples. – Not a machine Mar 11 '19 at 16:36
Well here is my base server setup https://github.com/metoikos/hapi-moon, I am just adding custom plugins and routes to this setup. – metoikos Mar 11 '19 at 20:36

score 0 · Answer 2 · answered Mar 11 '19 at 16:35

In was able to use Fiddler to root cause the issue. My Node/Hapi side of things was working correctly. However, I had previously installed a CORS plug-in on Chrome and it was injecting a subsequent wildcard into my Access-Control-Allow-Origin header. Hence, the multi-valued header. Once I disabled the CORS button on my Chrome plug-in the header was as expected.

How to prevent CORB errors with Backbone and Node.js/Hapi?

2 Answers2