Node.js 项目：同步请求获取服务地址并生成配置文件
在这个方案中，我们使用 sync-request 模块在 Node.js 项目中同步获取服务地址，然后根据返回的配置信息生成 config.json 文件。
安装依赖
首先，确保已安装必要的依赖：
npm install sync-request fs-extra path
代码示例
const fs = require('fs-extra'); // node 的 fs 工具封装
const path = require('path'); const request = require('sync-request'); // 发送同步请求获取服务地址的响应
const response = request('GET', 'http://127.0.0.1:4523/m2/5234134-4901301-default/246701762'); // 解析响应体
const data = JSON.parse(response.getBody('utf8')); // 配置文件路径
const configPath = path.join('./', 'public', 'config.json'); // 写入配置文件 fs.writeFileSync(configPath, JSON.stringify(data));
说明
- 通过
sync-request发送一个同步的 GET 请求来获取配置数据。 - 获取的响应数据通过
JSON.parse进行解析。 - 使用
fs-extra的writeFileSync方法，将解析后的配置数据写入到public/config.json文件中。 - 配置文件生成后，可以在项目中直接引用和使用。
Vue 项目：通过 node-fetch 获取服务地址并生成配置文件
在 Vue 项目中，我们使用 node-fetch 库发送请求来获取配置信息，并将其保存为 config.json 文件。然后在项目构建时引用该文件。
安装依赖
npm install node-fetch fs path
代码示例
import fs from "fs";
import path from "path";
import fetch from "node-fetch";
function syncFetch(url) { const response = fetch(url).then(res => res.json()); return response;}
(async () => {
const configData = await syncFetch("http://127.0.0.1:4523/m2/5234134-4901301-default/246701762");
const configPath = path.join("./", "public", "config.json");
fs.writeFileSync(configPath, JSON.stringify(configData));
})();
修改 package.json
在项目的 package.json 文件中，修改 dev 或 build 脚本，在构建前先生成配置文件：
{
"scripts": {
"dev": "node build.js && vite",
"build": "node build.js && vue-cli-service build"
}
}
说明
- 通过
node-fetch发起一个异步的请求来获取服务端的配置信息。 - 使用
fs模块将获取到的配置信息写入public/config.json文件中。 - 在
package.json中修改打包命令，使得在构建前先请求配置信息并生成config.json文件。 - 在前端代码中通过
import语句直接引用public/config.json配置信息：
总结
通过以上步骤，您可以在 Node.js 和 Vue 项目中实现：
- 使用同步请求获取配置信息。
- 根据返回的数据动态生成
config.json文件。 - 在项目构建过程中引用该配置文件，实现灵活的配置管理。
注意事项
- 同步请求：在 Node.js 中，我们使用
sync-request来处理同步请求，这样可以确保配置文件在生成之前获取到必要的数据。Vue 项目中使用node-fetch发送异步请求，但通过async/await确保请求完成后再执行后续操作。 - 配置文件路径：确保配置文件路径正确，且前端能够访问到生成的
config.json文件。一般情况下，放在public目录下比较合适。 - 打包脚本：通过修改
package.json脚本，确保在打包前先执行生成配置文件的操作，以避免缺失配置。
通过这种方式，您可以在开发过程中灵活地管理项目配置，并根据需求自动更新服务端返回的配置信息。
