Question

我尝试编写VSTS扩展程序，生成报告并提供以CSV格式下载数据的链接。

我有一个保存为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中，由于内容安全策略阻止了操作：

内容安全策略：页面的设置阻止了加载数据资源：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;

看起来我应该使用不同的方法来正确完成这项任务，而不是我采取的方法，但我不知道从哪里开始。对于那些非常关注在SO中监控VSTS标签并提供有用信息的人来说，先发制人地大声疾呼，谢谢！

Answer 1

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

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

这方面的一个主要缺点是根据我的知识不能设置文件名。

内容安全策略阻止从VSTS扩展

1 个答案: