Anyone have an idea how to use this with firebase functions?

[iamgoodbytes]

We could run this, but I'm not sure we should be using the request and response object or not? Thanks for any pointers!

exports.helloWorld = functions.https.onRequest((request, response) => {
    // response.send("Hello from Firebase!");
    app.use('/', proxy());
});

[urbantumbleweed]

+1

[urbantumbleweed]

This is my starting point.

const express = require('express');
const functions = require('firebase-functions');

const app = express();
app.use('/', proxy());

export default functions.https.onRequest(app);

I don't seem to be hitting the endpoint from the application. I am using config that is something like:

{
      useCORS: true,
      allowTaint: true,
      ignoreClasses: get(request, 'imageGeneration.ignoreClasses', []),
      ignoreElements: (element) => {
        const toIgnore = get(request, 'imageGeneration.ignoreClasses', []);
        const elementClasses = element.classList;
        const shouldIgnore = intersection(toIgnore, elementClasses);
        switch (true) {
          case shouldIgnore.length > 0:
            return true;
          default:
            return false;
        }
      },
      backgroundColor: null,
      width: get(request, 'pdfOptions.pageWidth', DEFAULT_CANVAS_PAGE_WIDTH),
      height: get(request, 'pdfOptions.pageHeight', DEFAULT_CANVAS_PAGE_HEIGHT),
      scale: 4.1666, // result of 300 dpi/ 72 dpi
      onclone: null,
      logging: false, // can be switched fon for debugging
      removeContainer: true,
      proxy: 'firebase-endpint-url/html2canvasProxy',
    };

Does anyone have thoughts?

[hanglooakshay]

This is my starting point.

const express = require('express');
const functions = require('firebase-functions');

const app = express();
app.use('/', proxy());

export default functions.https.onRequest(app);

I don't seem to be hitting the endpoint from the application. I am using config that is something like:

{
      useCORS: true,
      allowTaint: true,
      ignoreClasses: get(request, 'imageGeneration.ignoreClasses', []),
      ignoreElements: (element) => {
        const toIgnore = get(request, 'imageGeneration.ignoreClasses', []);
        const elementClasses = element.classList;
        const shouldIgnore = intersection(toIgnore, elementClasses);
        switch (true) {
          case shouldIgnore.length > 0:
            return true;
          default:
            return false;
        }
      },
      backgroundColor: null,
      width: get(request, 'pdfOptions.pageWidth', DEFAULT_CANVAS_PAGE_WIDTH),
      height: get(request, 'pdfOptions.pageHeight', DEFAULT_CANVAS_PAGE_HEIGHT),
      scale: 4.1666, // result of 300 dpi/ 72 dpi
      onclone: null,
      logging: false, // can be switched fon for debugging
      removeContainer: true,
      proxy: 'firebase-endpint-url/html2canvasProxy',
    };

Does anyone have thoughts?

Did you solve it though?

[Shafiyyah]

Hi, I have tried using the library on firebase. Even though it has been 3 years since the last comment. Here is my working code:

Firebase Function Code:

const functions = require('firebase-functions');

const express = require('express'); // Rest API

var proxy = require('html2canvas-proxy');

var app = express();

app.use("/", proxy());

exports.app = functions.region('asia-east1').https.onRequest(app);

On the web code:

async Print () {
    let options= {
      allowTaint: false,
      useCORS: false,
      proxy: 'https://your function endpoint',
      logging: false
    }
    const table = document.getElementById("table");
    let filename = `${this.quotationID}_Quotation.png`
    await html2canvas(table, options).then(function(canvas) {
      var link = document.createElement('a');
      // console.log(this.quotationID)
      link.setAttribute('download', filename);
      link.href = canvas.toDataURL()
      link.click();
    });
  }

The documentation needs a bit of fixing on the web part. I just found out, from this fork https://github.com/zeusstl/html2canvas-proxy-nodejs