Skip to content

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

Gildas edited this page Apr 28, 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-frames.js
  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.

const { content, title, filename } = await singlefile.getPageData({
  removeHiddenElements: true,
  removeUnusedStyles: true,
  removeUnusedFonts: true,
  removeImports: true,
  removeScripts: true,
  compressHTML: true,
  removeAudioSrc: true,
  removeVideoSrc: true,
  removeAlternativeFonts: true,
  removeAlternativeMedias: true,
  removeAlternativeImages: true,
  groupDuplicateImages: true
});
  1. If you need to bypass CORS or other network security restrictions you need to 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. The function should support request headers. The Response object returned asynchronously must support the properties status and headers, and the method 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 ;)

Clone this wiki locally