时间戳

首页 > 解决方案 > 我无法在网络扩展中使用 express 和 fetch

javascript - 我无法在网络扩展中使用 express 和 fetch

问题描述

我正在尝试使用一些 NPM 库（例如 sqlite3 和 express）构建 Web 扩展。我使用 browserify 生成了一个捆绑脚本，并在脚本标签中需要它，但是当我打开扩展程序时，它显示一条错误消息，说http.ServerResponse is undefined(for express) 和 stream is undefined(for sqlite3)

清单.json：

{

  "manifest_version": 2,
  "name": "jpfShortener",
  "version": "1.0",
  "browser_action": {
    "default_title": "jpfShortener",
    "default_popup": "menu/jpfShortener.html"
},
  "content_security_policy":  "script-src 'self' 'unsafe-eval'; object-src 'self'",

  "icons": {
    "48": "icons/48.png"
  },

  "permissions": [
    "<all_urls>"
  ],

  "content_scripts": [
    {
      "js": ["menu/jpfShortener.js"],
      "matches": ["<all_urls>"]
    }
  ]

}

html的头部：

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>jpfShortener</title>
    <link rel="stylesheet" href="jpfShortener.css"/>
    <script src="../bundleScripts/bundle.js" defer></script>
    <script src="../server.js" defer></script> 
    <script src="../short.js" defer></script> 
</head>

短.js：

document.getElementById("shortbtn").onclick = function() {short()};

function short() {

  var data = { url: document.getElementById("url").value };

  fetch("/addLink", {
    method: "POST",
    body: JSON.stringify(data),
    headers: { "Content-Type": "application/json" }
  })
    .then(res => res.json())
    .then(res => {
      console.log(JSON.stringify(res));
    })
    .catch(err => console.log(err));

  document.getElementById("url").value = "";
  document.getElementById("url").focus();
};

server.js：

onload = function(){
  console.log("teseeeete");
  const bodyParser = require("body-parser");
  const express = require("express");
  const fs = require("fs");
  const sqlite3 = require("sqlite3").verbose();
  var app = express();

app.use(bodyParser.urlencoded({ extended: true }));
app.use(bodyParser.json());

var listener = app.listen("8080", () => {
  console.log(`Your app is listening on port ${listener.address().port}`);
});

const dbFile = "data/jpfshortener.db";
const exists = fs.readFileSync(dbFile);

const db = new sqlite3.Database(dbFile);

...

app.post("/addLink", (req, res) => {

  //some code
  
});

...

};

我也尝试捆绑我的server.js并将其添加到，content_scripts但它没有用。

另外，我无法获取“/addLink”，它找不到网址。我相信这是因为 mozilla 和 google 临时网络扩展的服务不像 localhost 那样像服务器一样工作。

作为一个普通的节点应用程序，它工作得很好。

有任何想法吗？

标签： javascripthtmlnode.jsfirefox-addon-webextensions

解决方案

推荐阅读