Rx.js, handling Chrome Extension webrequest API callback functions

问题

I'm trying to use Rx.js to handle the flow of Chrome extension webrequest API.

Each webrequest addListener() call takes a mandatory callback function as the first parameter. This sends request objects to the function. However, the callback can return a webRequest.BlockingResponse that determines the further life cycle of the request.

I'm struggling to handle the blocking response as part of the observable.

This code works well for examining all image requests, for example

onBeforeRequestHandler = function() {

        var filteredURLs = ["http://*/*", "https://*/*"]; 
        var resourceTypes = ["image"]; 
        var filter = { urls: filteredURLs, types: resourceTypes };
        var options = ["blocking"];

        return Rx.Observable.create(observer => {
            var listener = chrome.webRequest.onBeforeRequest.addListener(
                function requestHandler(obj) {
                    observer.next(obj);
                },
                filter, options);
            return unsubscribe => {
                chrome.webRequest.onBeforeRequest.removeListener(listener);
            };
        });

};

I can then use all the Rx.js operators to manipulate the requests by doing this:

var source = onBeforeRequestHandler();
source.subscribe();

etc.

However, if during the course of working the images, I wish to cancel the request, I somehow need to return a blocking response object, like this {cancel:true} to the observable that is wrapping the chrome.webRequest.onBeforeRequest.addListener callback function.

At the moment I have no clue how to do this.

Any help much appreciated.

来源：https://stackoverflow.com/questions/48928351/rx-js-handling-chrome-extension-webrequest-api-callback-functions