jquery - XHR freezes iPad, no status 200, but it does have a response size

Question

This issue is hard to explain, so I'm going to do my best.

I have this webapp which was built on Laravel with a jQuery frontend. I know it's kind of legacy, and plans are to rebuild the frontend to React, but this is what is is for now.

The case is as follows:

1. jQuery opens up a screen and does an XHR request for a HTML-table
2. Initially this goes well
3. I change my filters and reload the table
4. I can see the request being made in the network tab, but it keeps pending
5. After a few seconds I see a response size of a few Kb, but no status
6. The browser hangs until you force-close the browser

The request that was made does the following on the server-side:

1. Initiate an object's query
2. Apply filters from the query-vars
3. Fetch and put them in a Collection (default Laravel get()->method)
4. Loop them in a blade-file to a <table>...</table>

Additional info:

• There are no errors on the client or the server side
• This happens only on iPad's, on several browsers (Safari / Chrome / Firefox) and only on this screen (this app consists of 100's of screens built the same way)
• The expected behaviour is that after a while the request gives you a 200 and a response size. This only gives a response size, without any status - so it's still waiting for something
• When I open the URL in a separate tab on my iPad, after force-quitting the browser, it works. Within a second I have the data on my screen
• I've tried using fetch instead of XHR, but no luck
• Problem is not bound to a single device, it's appearing on several real iPads and can be reproduced on a simulator
• Laravel v8.0

Answer 1

等待大神答复