Question

我有一个调用POST调用的按钮，该调用从服务器检索json响应。我想用这个json响应打开一个新的（chrome）浏览器选项卡。

这是我到目前为止的角度

$http.post(url,data)
  .then(function(res) {
    $scope.toJSON = angular.toJson(res.data);
    var blob = new Blob([$scope.toJSON], { type:"application/json;charset=utf-8;" });

    var downloadLink = angular.element('<a></a>');
    downloadLink.attr('href',window.URL.createObjectURL(blob));
    downloadLink.attr('target','_blank');
    downloadLink[0].click();
  })

此代码将打开一个包含json的新选项卡，但它似乎不会被识别为json。我的意思是我有一个chrome扩展（JSONView），它会自动打印任何json。但它似乎没有印刷这个。

如果重要，新标签页的网址就像这样

blob:chrome-extension://knecfkbfhnkfajaonlnodhpjpbbpjfcp/c3b7e4dc-8209-4d0f-8f79-d8ba25e960a2

我尝试了一系列不同的chrome扩展程序来查看json，它们都表现出相同的效果。扩展程序可能无法处理此“blob：chrome-extension：//”页面。

那么在新标签中打开json的正确方法是什么？

澄清我不想在页面上显示此内容。我想在新标签中打开它。我应该提一下，这是Chrome扩展程序中的代码，而不是标准网页

Answer 1

您可以使用<pre>元素和JSON.stringify()

，而不是使用扩展程序

＆＃13;

fetch("https://gist.githubusercontent.com/guest271314/ffac94353ab16f42160e/raw/aaee70a3e351f6c7bc00178eabb5970a02df87e9/states.json")
.then(response => response.json())
.then(json => {
  document.querySelector("pre").textContent = JSON.stringify(json, null, 2)
})

＆＃13;

<pre></pre>

＆＃13;

如何提供通过POST调用获取的json？

1 个答案: