如何在Angular应用中获取edge://policy/chrome://policy的JSON数据

你无法通过Angular应用的HttpClient或者普通网页环境的JS接口直接获取chrome://policy/edge://policy页面的策略JSON数据。 #

原因说明 #

• chrome://、edge://属于浏览器内部特权协议，普通网页的运行环境受浏览器安全沙箱限制，没有权限访问这类协议下的任何资源，直接发起请求会被安全策略拦截。
• 政策页面的导出功能是浏览器内置UI提供的本地操作，没有对外暴露可被第三方网页调用的公开接口。

可行实现方案 #

方案1：用户手动上传导出的JSON文件（适配普通网页场景） #

你可以在Angular应用中增加文件上传入口，引导用户手动完成以下操作：

1. 打开edge://policy（Edge浏览器）或chrome://policy（Chrome浏览器）页面
2. 点击页面上的「导出政策」按钮，保存本地JSON文件
3. 将导出的JSON文件上传到你的Angular应用

你可以通过FileReader API读取上传的文件内容，解析为JSON对象后直接用于表格组件渲染，核心示例代码如下：

// 组件模板中添加文件选择input
// <input type="file" accept=".json" (change)="onFileSelected($event)">

onFileSelected(event: Event) {
  const input = event.target as HTMLInputElement;
  if (input.files?.length) {
    const reader = new FileReader();
    reader.onload = (e) => {
      const policyJson = JSON.parse(e.target?.result as string);
      // 后续处理policyJson，渲染到表格
    };
    reader.readAsText(input.files[0]);
  }
}

方案2：基于浏览器扩展实现（仅适配扩展场景） #

如果你的应用依托浏览器扩展提供服务，可以利用扩展的特权权限调用chrome.policy系列API直接获取策略数据，再将数据传递给Angular页面使用，该方案不适用于普通公网网页场景。 #

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