20

I'm using CORS to fetch some data from an API. All was working well until Chrome update launched a day ago.

Now after an OPTIONS request the subsequent request always returns with no response data.

If I click a button quickly twice it will show on the second request (the same one) since it's not making the pre-flight call.

I've re-installed and disabled all extensions, no idea what's going on here.

Is anyone else experiencing this?

EDIT note that the no response is directly from the devtools. It's just a n Ajax call. And even though it's not displaying any response data it's all working correctly. For instance if I do a console.log(res) in the code it's all good. It's strictly Chrome not showing any response and strictly following an OPTIONS (CORS) request.

EDIT Also note that everything is working and displaying perfectly fine in Firefox/Firebug.

EDIT Chrome Version 56.0.2924.87 (64-bit)

EDIT I'm just lost here. The app is working perfectly fine so it makes a bit hard to even know where to star debugging. It seemed to happen literally the day after Chrome popped up a green update icon. After that update I was seeing nil.

I checked some of my other apps and actually it works there! So I was thinking it might be related to some combination of plugin/Chrome not playing nicely. I tried reverting back a lot to many versions but not luck. Weird thing is that it's only following an OPTIONS request. I'm guessing it's something simple like an encoding type, but no idea where.

EDIT Also tried following some of the leader here with no luck: View AJAX response content in Chrome developer tools?

EDIT I have been able to narrow this down to an issue with vue-resource plugin. Works fine with axios. Fiddle is here: https://jsfiddle.net/tpnucv5m/

Community
  • 1
  • 1
Rob
  • 10,851
  • 21
  • 69
  • 109
  • Have you checked in the devtools console to see what’s getting logged there? Also it could help if you’re able to post some code that can be used to reproduce the problem. – sideshowbarker Feb 11 '17 at 05:24
  • The no response is directly from the devtools. It's just a n Ajax call. And even though it's not displaying any response data it's all working correctly. For instance if I do a `console.log(res)` it's all good. It's strictly Chrome not showing any response and strictly following an OPTIONS (CORS) request. – Rob Feb 11 '17 at 05:31
  • Which version of Chrome? (Please consider editing your question to add the exact version from chrome://chrome/) – sideshowbarker Feb 11 '17 at 13:28
  • What is the outputted request returning if you requesting it directly without any Ajax call and what is the response code returning. In case if the OPTIONS request returns a 204 the response will be empty. – Yoram de Langen Feb 20 '17 at 06:43
  • To reiterage @YoramdeLangen the app works perfectly fine. If I make a request with no "authorization" header, it will not do the pre OPTIONS request and it will give a response which I can magically see. I can even see the response of the OPTIONS request itself. But the request immediately following the OPTIONS request just gives me that message in the chome console. – Rob Feb 23 '17 at 12:52
  • @YoramdeLangen Also console shows the OPTIONS response is indeed 200, not a 204. – Rob Feb 23 '17 at 13:08
  • Is there any redirect happening after the OPTIONS? I guess not, because if so in Chrome 56 you would see a “Response for preflight is invalid (redirect)” error message in the console. But not in Chrome 57+ though—because this was changed after Chrome 56 https://chromium.googlesource.com/chromium/src/+/eaeb7a5f8e9432594d8bcc09956c1f50e8f0ba66. So just to be sure, if possible can you try your app in current Chrome Beta (which I think is now at Chrome 58) and see if you observe the same behavior? – sideshowbarker Feb 23 '17 at 21:33
  • +1 Same problem here using Chrome 56.0.2924.87 (64-bit) on mac, along with a Vue+Laravel app using CORS. All was working perfectly until recent chrome update. Response data still working correctly on FF and Safari – Nolan Lawrence Feb 28 '17 at 00:16
  • 1
    I've managed to narrow this down to vue-resource plugin. Works fine with adxos, you can check my fiddle here. https://jsfiddle.net/tpnucv5m/ @nolan-lawrence – Rob Feb 28 '17 at 04:32
  • have you tried uninstalling and reinstalling chrome completely and reinstalling the plugin? Sometimes that works when issues like that come up for me. – Coding Tutorials Hotspot Mar 01 '17 at 23:56

2 Answers2

12

A quick fix, until the module is updated, is to comment out this line in dist/vue-resource.common.js:

xhr.responseType = 'blob';

It should be somewhere around line ~1054

Ibrahim
  • 2,034
  • 15
  • 22
  • This worked for me. Awaiting module update for proper fix. – Nolan Lawrence Feb 28 '17 at 23:40
  • 2
    This seems to be the answer. I've created an issue already with the pagekit guy, but not sure if this is getting implemented yet. https://github.com/pagekit/vue-resource/issues/566 – Rob Mar 03 '17 at 13:26
5

I know this is not a solution (do not upvote), but right click the OPTIONS XHR and REPLAY XHR. It will resend the Ajax call and now there will be an answer.

I presume there is some async issue with the plugin.

SNEILΛ
  • 180
  • 1
  • 4