javascript - Cors 请求阻止的 Firebase 函数

问题描述

我正在尝试在我的网站中使用 http 功能，但无法通过CORS.

这是我用来提交表单的 HTML 中的函数：

function uploadFile() {
      var file = document.getElementById("file_input").files[0];
      var pass = document.getElementById("pass").value;
      console.log(file + pass);
      // alert(file.name+" | "+file.size+" | "+file.type);
      var formdata = new FormData();
      formdata.append("file", file);
      formdata.append("password",pass);
      var ajax = new XMLHttpRequest();
      ajax.upload.addEventListener("progress", progressHandler, false);
      ajax.addEventListener("load", completeHandler, false);
      ajax.addEventListener("error", errorHandler, false);
      ajax.addEventListener("abort", abortHandler, false);
      ajax.open("POST", "https://us-central1-myAPPHERE.cloudfunctions.net/test"); 
       //ajax.setRequestHeader("Content-Type", "multipart/form-data");
      ajax.send(formdata);
    }

这是服务器端代码：

functions = require('firebase-functions');
var { performance } = require('perf_hooks');
var begin;
var Busboy;
var path;
var os;
var fs;
var init = false;
var cors;

exports.test = functions.https.onRequest((req, res) => {

  res.set('Access-Control-Allow-Origin', '*');

  if (req.method === 'OPTIONS') {
    res.set('Access-Control-Allow-Methods', 'POST');
    res.set('Access-Control-Allow-Headers', 'Content-Type');
    res.set('Access-Control-Max-Age', '3600');
    res.status(204).send('');
  } else {    
    if (init === false) {
      begin = require('./Include/process');
      Busboy = require('busboy');
      path = require('path');
      os = require('os');
      fs = require('fs');
      cors = require('cors')({ origin: true });
      init = true;
    }

    var c1 = performance.now();
    const busboy = new Busboy({ headers: req.headers });
    const fields = {};
    const tmpdir = os.tmpdir();
    const uploads = {};
    const fileWrites = [];
    var pass = '';

    busboy.on('file', (fieldname, file, filename) => {

      console.log(`Processed file ${filename}`);
      const filepath = path.join(tmpdir, filename);
      uploads[fieldname] = filepath;

      const writeStream = fs.createWriteStream(filepath);
      file.pipe(writeStream);

      const promise = new Promise((resolve, reject) => {
        file.on('end', () => {
          writeStream.end();
        });
        writeStream.on('finish', resolve);
        writeStream.on('error', reject);
      });
      fileWrites.push(promise);
    });

    busboy.on('field', function (fieldname, val, fieldnameTruncated, valTruncated, encoding, mimetype) {
      pass = val;
    });

    busboy.on('finish', function () {
      console.log('Done parsing form!');
      console.log(pass);
      console.log(uploads);

      begin.processCard(uploads['file'], pass, 2).then((s) => {
        res.end(`
        <!DOCTYPE html>
        <html>
           <body>
              PDF Cropped in ${performance.now() - c1}!!
              <img src="data:image/jpeg;base64,${s}" width="90%"></img> 
           </body>
        </html>
        `);
        // res.end(s)
      }).catch((err) => { res.end('Error: ' + err) });
    });
    busboy.end(req.body);
  }
});

尝试提交表单会记录此 CORS 错误： Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://us-central1-myAPPHERE.cloudfunctions.net/test. (Reason: CORS request did not succeed).

标签： javascriptnode.jsfirebasecorsgoogle-cloud-functions

const functions = require('firebase-functions'); //... const cors = require('cors')({ origin: true }); exports.test = functions.https.onRequest((req, res) => { cors(req, res, () => { //... Your code here }); });

javascript - Cors 请求阻止的 Firebase 函数

问题描述

解决方案

推荐阅读