Vue.js外部config.json文件保护与IIS访问权限配置咨询

之前你遇到的规则误伤问题，本质是图省事开了“一刀切拦截所有.json后缀文件”的粗粒度规则——没有区分请求是用户直接导航访问，还是前端代码的异步读取，所以才会出现Vue应用自己也拿不到配置的问题。完全可以通过精细化配置同时满足三项核心要求，以下都是可直接落地的实操方案：

方案1：IIS精准配置请求拦截规则，替代全局.json拦截 #

• 彻底废弃“拦截所有.json后缀文件”的全局规则，单独针对独立配置文件设置细粒度拦截逻辑
• 拦截判定逻辑：

  当用户通过浏览器直接导航访问config.json时，请求头中的Accept字段会包含text/html（代表用户在地址栏输入地址、点击外链直接访问的场景），对这类请求直接返回403/404阻断

• 放行覆盖范围：

  Vue应用在业务代码中通过fetch/axios发起的配置读取请求，属于XHR/Fetch类型的异步请求，请求头中的Accept字段通常为application/json, text/plain, */*，不会触发拦截规则，可正常读取文件内容

• 管理员操作不受影响：修改配置文件是直接在服务器本地磁盘操作，不经过HTTP请求环节，随时可以调整内容，不需要改代码或重新发布应用

方案2：配置文件移出公开Web根目录，通过内部接口转发读取 #

• 不要把config.json直接放在站点对外的Web根目录（如wwwroot）下，把文件移动到站点目录外的非公开路径（如和站点文件夹同级的App_Configs目录），这类路径下的文件默认不会被IIS对外提供静态访问，用户就算猜到文件名、输入对应路径也根本无法触达
• 在站点路由层增加一个轻量的专用读取入口，比如配置规则：当收到路径为/app/config的请求时，程序自动从那个非公开路径读取config.json的内容，以JSON格式返回给前端
• Vue侧只需要把原来请求/config.json的地址替换成/app/config即可，业务逻辑不需要做其他改动
• 管理员修改配置时，直接编辑非公开路径下的文件即可，不需要走前端打包、站点发布的流程，操作成本最低

方案3：自定义非公开配置路径，增加轻量请求校验 #

• 如果担心配置路径被恶意扫描器爬取，可以把原来的config.json改成无规律的非公开文件名（比如vue_runtime_7f3k2d.conf）放在Web根目录下
• 给IIS的静态文件处理规则增加简单校验：只有请求带前端业务代码约定的固定请求头标识时，才返回对应文件内容；用户直接在浏览器输地址访问时，因为不带这个约定标识，直接被拦截
• 这套逻辑同样不影响管理员本地修改文件内容，同时能避免配置文件被恶意批量爬取

所有方案都没有破坏“配置文件独立、不打进前端构建包”的核心特性，不会出现改配置还要重新build项目、重新部署站点的问题

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