title: Update WebExtension webRequest.onBeforeRequest listener URL settings from separate script
body: <p>I am currently creating a WebExtension in which I register a listener on the web requests being made, as such:</p>
  
  <p><em>main.js</em>:</p>
  
  <pre><code>chrome.webRequest.onBeforeRequest.addListener(main_function, {urls: sites}, ["blocking"]);
  </code></pre>
  
  <p>where <code>sites</code> is an array containing a list of URLs loaded from a settings page.</p>
  
  <p>Upon changing these settings, which live in separate HTML and JavaScript files, I want to update the aforementioned listener to now contain the new list of sites.</p>
  
  <p>I'm having trouble getting access to this listener from the Settings JavaScript file, as</p>
  
  <pre><code> onBeforeRequest.removeListener(callback)
  </code></pre>
  
  <p>requires the original callback as an argument.</p>
  
  <p>Does anyone know how I can, from a different JavaScript file, update this listener?</p>
  
  <p>Example of problem (3 files):</p>
  
  <p>manifest.json:</p>
  
  <pre><code>{
      ...
      "permissions": ["webRequest", "webRequestBlocking", "storage"],
      "background: { "scripts": ["main.js"] },
      "options_ui": { "page":"settings.html" }
  }
  </code></pre>
  
  <p>where settings.html in turn loads settings.js.</p>
  
  <p>main.js:</p>
  
  <pre><code>/* I wont type out the code to load this array from settings. You will have to imagine it being loaded */
  all_urls = ["http://www.google.com", "http://www.stackoverflow.com"];
  
  function example_callback() {
      console.log("Hello World!");
  }
  
  chome.webRequest.onBeforeRequest.addListener(example_callback, {urls: all_urls}, ["blocking"]);
  </code></pre>
  
  <p>settings.js:</p>
  
  <pre><code>/* Again, imagine that the settings are edited by this file and saved to storage. */
  all_urls = ["https://www.google.com"];
  
  /* This is where the problem lies. Listener cannot be removed, as callback is not available in this file */
  chrome.webRequest.onBeforeRequest.removeListener(); // Wont work
  chrome.webRequest.onBeforeRequest.addListener(example_callback, {urls: all_urls}, ["blocking"]);
  </code></pre>