将 HTML 输入文件作为 Firebase Cloud Function 的参数传递答案

【问题标题】：Passing HTML input file as the parameter of Firebase Cloud Function将 HTML 输入文件作为 Firebase Cloud Function 的参数传递
【发布时间】：2018-10-15 09:23:02
【问题描述】：

我是这个领域的新手，我在 2 天前开始使用 firebase 云功能。

对不起，我还是个学生，所以我可能无法清楚地理解一些文档。

我试图弄清楚参数是如何从我的客户端 javascript 传递到 firebase 云函数的。

我的云功能

exports.OCR = functions.https.onCall((req) => {
  const vision = require('@google-cloud/vision');
  // Creates a client
  const client = new vision.ImageAnnotatorClient();
  console.log(req);
  // Performs label detection on the image file
  client
    .documentTextDetection(req)
    .then((results) => {
      console.log("Entered");
      console.log(req);
      const fullTextAnnotation = results[0].fullTextAnnotation;
      console.log(fullTextAnnotation.text);
      return results[0].fullTextAnnotation.text;
    })
    .catch(err => {
      console.error('ERROR:', err);
      return "error";
    });
})

我正在使用 firebase 云功能和 Google Vision API。

其实我是这样尝试传递参数的

我的客户端 coe

document.getElementById("fileInput").click();
    var file = document.getElementById("fileInput");
    var fileInput = document.getElementById('fileInput');
    fileInput.addEventListener('change', function (e) {
        var file = e.target.files[0];
        // Do something with the image file.
        var tmppath = URL.createObjectURL(file);
        console.log(file);
        console.log(tmppath);
        //var url = "https://firebasestorage.googleapis.com/v0/b/recette-f3ef5.appspot.com/o/FB1.gif?alt=media&token=28727220-181c-440e-87ae-4808b5c9ba28";
        OCR(file)
        .then(function(result) {
            console.log(result);
        }).catch(function(err) {
            console.log(err);
        });
    });

它没有工作。触发函数时总是返回null。

那么，我的问题是如何将文件（HTML INPUT TAG）传递给我的云函数？

ps：当我尝试使用 node the_code.js 的代码时，它可以工作。

【问题讨论】：

如果您正在使用代码，您应该将其直接复制到问题中，以便于阅读和搜索。您可能还想阅读本文以完善您的问题：stackoverflow.com/help/how-to-ask
感谢您的建议！我改了！ @DougStevenson

标签： javascript html firebase google-cloud-platform google-cloud-functions

【解决方案1】：

根据 Google Cloud Node.js 库 documentation，documentTextDetection 函数应该接收这样的 JS 对象：

var image = {
  source: {imageUri: 'gs://path/to/image.jpg'}
};

vision.documentTextDetection(image).then(response => {
  // doThingsWith(response);
}).catch(err => {
  console.error(err);
});

您传递给OCR 函数的file 的结构可能与文档中定义的结构不同。

这有一些变体：

如果键是source，值应该是另一个包含 imageUri 或 filename 作为键和字符串作为值。

如果key是content，value应该是Buffer。

所以你的代码应该是这样的。

    console.log(tmppath);
    //var url = "https://firebasestorage.googleapis.com/v0/b/recette-f3ef5.appspot.com/o/FB1.gif?alt=media&token=28727220-181c-440e-87ae-4808b5c9ba28";
    image = {source: {imageUri: 'https://firebasestorage.googleapis.com/v0/b/recette-f3ef5.appspot.com/o/FB1.gif?alt=media&token=28727220-181c-440e-87ae-4808b5c9ba28'}}
    OCR(image)

请提供完整的错误消息和file..的描述。

【讨论】：