0

我正在尝试编写一个生成报告并提供将数据下载为 CSV 的链接的 VSTS 扩展。

我有一个正在保存到 CSV 的字符串：

$("#downloadReportButton".click(function () {
  var csvString = getCSV()
  var a = window.document.createElement('a')
  a.href = 'data:attachment/csv,' + encodeURI(csvString)
  a.download = 'test.csv'
  document.body.appendChild(a)
  a.click()
  document.body.removeChild(a)
)}

这在 Chrome 中按预期工作，但在 Firefox 中，由于内容安全策略，该操作被阻止：

内容安全策略：该页面的设置阻止了在 data:attachment/csv,%22Repository%22,%22... (“frame-src * tfs:”) 处加载资源。

我对 CSP 完全陌生，但实际上我不确定问题出在哪里。根据 frame-src 政策（这似乎适用于我在 VSTS 的 iframe 中呈现的内容），我不确定为什么会被阻止：

frame-src * tfs:;

在我看来， frame-src 允许*，换句话说，允许任何内容，或者tfs:

我看不出有script-src任何问题：

script-src 'unsafe-inline' *.visualstudio.com https://cdn.vsassets.io *.ensighten.com *.microsoft.com *.google-analytics.com 'nonce-bbKMGh5rKZ1WElrqfMYBVQ==';

这是我从标题中看到的完整 CSP：

default-src 'none'; font-src *.visualstudio.com *.vsassets.io *.microsoft.com *.sharepointonline.com; style-src 'unsafe-inline' *.visualstudio.com cdn.vsassets.io; connect-src *.visualstudio.com wss://*.visualstudio.com *.vsassets.io *.blob.core.windows.net; img-src http: https: blob: data:; script-src 'unsafe-inline' *.visualstudio.com https://cdn.vsassets.io *.ensighten.com *.microsoft.com *.google-analytics.com 'nonce-bbKMGh5rKZ1WElrqfMYBVQ=='; child-src * tfs:; frame-src * tfs:; media-src *.visualstudio.com *.vsassets.io *.microsoft.com *.sharepointonline.com;

看来我应该使用不同的方法来正确完成此任务，而不是我采用的方法，但我不确定从这里去哪里。先发制人地向 Microsoft 的一些人大喊，他们非常擅长监视 SO 中的 VSTS 标签并提供有用的信息，谢谢！

4

1 回答 1

0

而不是 hacky 锚解决方案，我应该只是window.open用编码的内容调用：

$("#downloadReportButton".click(function () {
  var csvString = getCSV()
  var attachment = 'data:attachment/csv,' + encodeURI(csvString)
  window.open(attachment)
)}

这样做的一个主要缺点是我无法设置文件名。

于 2017-12-13T16:47:31.333 回答