Safari - WebInspector Network Tab - An error occurred trying to load the resource

Question

I am seeing the error in the image below in Safari's Developer Tools (Network Tab) for the XHR/Fetch. The response body is not visible. It always throws the red text 'An error occurred trying to load the resource'. My initial thought was that the devtool wouldn't support fetch as opposed to XHR. But Safari 12 supports it.

OS: MacOS High Sierra Browser: Safari 12 & Technology Preview 66

Does this have something to do with the response headers? XSS or something else? PS: the same response body is visible in chrome dev tool.

Answer 1

The browser's error message describes the requirements for this request to complete successfully.

The server must grant access to the requested resource to your remote domain by sending a Access-Control-Allow-Origin response header.

In Safari 12, select the row in the network tab. The response will be displayed in the main area. Above it will be a few tabs. Select the Headers tab and take a look in the request part of the displayed data for some request info. For details on the request data, take a look under "Request Data". If applicable, there will be a small arrow there that you can press to see the full content of the request.

Answer 2

On the right of the menu bar with preview there is response with an arrow next to it click on that and switch it to JSON that should do the trick.

Answer 3

if you cant find "the right of the menu bar with preview there is response with an arrow",you will need zoom out first.