无法对数据或 Blob 源使用"save button (by google drive)"

Question

我会将文档保存到谷歌云端硬盘，这个文档是在我的网络应用程序的客户端实时创建的，使用谷歌云端硬盘保存按钮，但根本不起作用。

这是我从那里获取的保存静态文件的示例： https://developers.google.com/drive/v3/web/savetodrive 和工作

<script src="https://apis.google.com/js/platform.js" async defer></script>
<div class="g-savetodrive"
   data-src="//example.com/path/to/myfile.pdf"
   data-filename="My Statement.pdf"
   data-sitename="My Company Name">
</div>

是的，它只是有效，

但是如果我尝试使用数据或 blob 字段设置 data-src，它无法保存或出现错误

<div class="g-savetodrive"
   data-src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAKCAYAAABmBXS+AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsQAAA7EAZUrDhsAAAAjSURBVChTY/y/7uR/BgKACUrjBSNc0f8AU/yKQAp+/vzJAABYKgl8odPr0gAAAABJRU5ErkJggg=="
   data-filename="My Statement.pdf"
   data-sitename="My Company Name">
</div>

在这里尝试"实时"版本：https://jsbin.com/horopel/edit?html,js,console,output

blob 是一回事，不起作用，有什么解决方案吗？如果 Reactjs 解决方案更好，但欢迎任何想法。

Answer 1

答：保存按钮不支持 blob 源。

直接从您链接的文档

对不同服务器上的文件的请求受跨源约束 资源共享 (CORS( 限制。

1.data-src URL 可以从与托管按钮的域相同的域、子域和协议提供。

确保在页面和数据之间使用匹配协议 源。

要在 http 和 https 同时提供同一页面时提供文件， 指定没有协议的资源，例如 data-src="//example.com/files/file.pdf"，它使用适当的 基于托管页面访问方式的协议。

如您所见，它必须是一个文件。 您不能只向它发送文件本身的字符串值。 您是否考虑过通过Google驱动器API直接将文件上传到流中？