Skip to content

How to integrate SingleFile library code in "custom" environments?

Gildas edited this page Jul 6, 2022 · 30 revisions
  1. Execute the scripts below ideally before any other script (e.g. before the HTML document is parsed).

    • in the top window:

      • lib/single-file-bootstrap.js
    • in frames and the top window:

      • lib/single-file-hooks-frames.js
      • lib/single-file-frames.js

      You can omit these scripts in you don't need to save frames.

  2. Execute the script below in the top window, before saving the page.

    • lib/single-file.js
  3. Execute the script below in the top window to get the saved page. See here for more information about the syntax https://github.com/gildas-lormeau/SingleFile/wiki/How-to-integrate-the-API-of-SingleFile-into-an-extension. The complete list of options can be found here: https://github.com/gildas-lormeau/SingleFile/blob/master/src/extension/core/bg/config.js.

const { content, title, filename } = await singlefile.getPageData({
  removeHiddenElements: true,
  removeUnusedStyles: true,
  removeUnusedFonts: true,
  removeImports: true,
  blockScripts: true,
  blockAudios: true,
  blockVideos: true,
  compressHTML: true,
  removeAlternativeFonts: true,
  removeAlternativeMedias: true,
  removeAlternativeImages: true,
  groupDuplicateImages: true
});
  1. In order to bypass CORS or other network security restrictions you can call singlefile.init() before calling singlefile.getPageData() and pass an object as parameter with a fetch property. The value of this property is a function which implements fetch (typically based on APIs available in the environment). The function must accept a URL string as first parameter and should support optional request headers passed as second parameter (see https://developer.mozilla.org/en-US/docs/Web/API/fetch#syntax). The Response object returned asynchronously must support the properties status (see https://developer.mozilla.org/en-US/docs/Web/API/Response/status) and headers (see https://developer.mozilla.org/en-US/docs/Web/API/Response/headers), and the method arrayBuffer() (see https://developer.mozilla.org/en-US/docs/Web/API/Response/arrayBuffer).

  2. Remember the code is under AGPL and that you must use the same license for your project if you want to integrate this code ;)