本地HTML页面调用JS函数及SQL存储过程问题求助

• 排查函数定义与加载：
  • 确认formFields函数的代码位置：如果是外部JS文件，检查Page2的HTML里是否用<script>标签正确引入，且引入顺序在调用该函数的代码之前
  • 如果函数写在Page2的<script>标签内，不要把它嵌套在其他函数（比如window.onload）里，否则会因作用域问题无法被外部访问
• 替代方案：直接获取URL参数
  Page1表单用GET方法传值的话，无需自定义formFields，直接用原生API拿OPEID：

  const opeid = new URLSearchParams(window.location.search).get('OPEID');
  

• 使用ES模块（import/export）必须满足两个要求：
  1. 引入JS文件时，给<script>标签加type="module"属性：

     <script type="module" src="your-external-script.js"></script>
     

  2. 必须通过本地服务器访问HTML，不能直接双击打开（file://协议）——浏览器对本地文件的跨域限制会阻止模块加载

• 是否需要本地服务器？是，必须用：
  除了ES模块的要求，后续的接口请求也需要HTTP协议支持，本地服务器可以用这些简单工具快速搭建：
  • Node.js：安装http-server后，在项目目录执行http-server
  • Python3：执行python -m http.server
  • VS Code：安装Live Server插件，右键HTML文件选择"Open with Live Server"
• 当前脚本属于客户端脚本：所有在浏览器中运行的JS都是客户端代码，客户端代码无法直接连接本地SQL Server——浏览器的安全机制禁止前端直接访问本地数据库，这是你方案里的核心错误

客户端JS不能直接操作数据库，必须通过服务端中间层：

1. 编写服务端接口：用Node.js/.NET/Python等后端语言写一个接口，由服务端代码连接SQL Server并执行存储过程
2. 客户端请求接口：Page2的JS通过fetch或AJAX调用该接口，传入OPEID参数
3. 渲染结果：服务端返回存储过程的执行结果后，客户端JS把数据渲染到表格中

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