是否可以在浏览器中拦截非ajax请求？

Question

Is it possible to intercept HTTP requests in browser with JavaScript which aren't done through XMLHttpRequest object (ajax)?

I'm mocking an API server with ember-cli-mirage , which is using pretender . I need to add file upload (images) to the app. Mocking upload is no issue since it's done by ajax. But I'm unable to intercept the GET request caused by image tag (non-ajax request) since pretender is only intercepting requests done through XMLHttpRequest and therefore can't return "uploaded" data.

Is there anyway I could also intercept non-ajax requests?

If not: What should be considered best practice then? This is what I've considered so far:

1. Retrieving images through ajax so I could easily intercept the request. Eg I could treat them as ember-data models having base64 encoded image data as an attribute. But I'm not sure about the trade-off. I'm afraid that this will cause performance issues and possible memory-leaks cause of image size (> 1MB).
2. Passthrough requests for images and handling them in express server coming with ember-cli. But then mocking file upload would only work if app is served by ember-cli. And not being able to deploy development builds would be a big trade-off.

Answer 1

I think the only way to do this is to use a service worker .

The service workers fetch event can intercept any kind of request. However browser support is not very well yet.

Answer 2

您也许可以使用Wireshark来嗅探数据