如何在HTML/JavaScript页面中导入并调用Node.js模块

浏览器里跑的前端JS和Node.js服务端代码是两个完全隔离的运行环境，你不可能直接在HTML的脚本里导入调用Node端的自定义模块。你写的books本身是服务端的路由处理逻辑，正确的调用方式是先把这个逻辑封装成可访问的HTTP接口，前端再发网络请求调用接口拿结果。

第一步：补全Node端服务，暴露接口 #

你现在贴的books只是个单独的处理函数，没有挂到Web服务上根本没法被外部访问。先装最常用的Express做服务框架，顺便修下你原代码里async/await和.then混用、异常捕获失效的bug：

1. 先在Node项目目录跑命令装依赖：

   npm i express
   

2. 写服务入口文件（比如叫server.js）：

   const express = require('express');
   // 替换成你自己项目里db实例的引入路径
   const { db } = require('./db-config');
   const app = express();
   const PORT = 3000;
   
   // 本地开发用的跨域配置，不然前端端口和后端不一致会被浏览器拦截
   app.use((req, res, next) => {
     res.header('Access-Control-Allow-Origin', '*');
     next();
   });
   
   // 把你的books逻辑挂到GET /books接口上
   app.get('/books', async (req, res) => {
     const booksRef = db.collection('Books');
     try {
       const snapshot = await booksRef.get();
       const data = snapshot.docs.map(doc => ({
         id: doc.id,
         ...doc.data()
       }));
       console.log(data);
       return res.status(200).json(data);
     } catch (error) {
       return res.status(500).json({ general: "Something went wrong, please try again" });
     }
   });
   
   app.listen(PORT, () => {
     console.log(`服务已启动，访问地址 http://localhost:${PORT}`);
   });
   

3. 跑node server.js启动服务，浏览器直接开http://localhost:3000/books能看到返回的书籍JSON数据就说明后端配置没问题了。

第二步：改前端代码发请求调用 #

把你原来HTML里的script部分改了就行，不需要额外引什么module.js，直接用原生fetch调接口：

<script>
async function funs_del(a) {   
  alert('start');
  try {
    // 调用刚才启动的后端接口
    const response = await fetch('http://localhost:3000/books');
    const booksList = await response.json();
    // 这里拿到的就是你books模块返回的数据，后续业务逻辑直接写在这里
    console.log('书籍列表：', booksList);
  } catch (err) {
    console.error('请求接口失败：', err);
  }
  alert('stop');
}
</script>

注意事项 #

• 别白费功夫尝试在前端直接import/require你写的Node模块，浏览器没有Node运行时的核心API，你用的服务端数据库SDK、文件操作这类接口在浏览器里根本跑不起来，强行引只会报一堆undefined错误。
• 跨域问题只在本地开发的时候会碰到，上线之后把前端静态资源和后端服务部署到同个域名下就不用配跨域头了。
• 你原来的代码在async函数里用.then写法，外层的try catch根本捕获不到promise的异常，出错会直接挂进程，改成统一await写法稳很多。

内容的提问来源于stack exchange，提问作者loganayaki