Google Drive API，无法通过 JS 打开标准共享对话框(x-frame-options 错误)

2022-01-10 00:00:00 google-drive-api javascript x-frame-options same-origin-policy

我有一个使用 Google Drive API 的 JavaScript 应用.我在这里阅读了如何打开标准共享对话框:https://developers.google.com/驱动器/网络/管理共享

I have a JavaScript app which uses the Google Drive API. I read how to open a standard sharing dialog here: https://developers.google.com/drive/web/manage-sharing

<head>
...
<script type="text/javascript" src="https://apis.google.com/js/api.js"></script>
<script type="text/javascript">
    init = function() {
        s = new gapi.drive.share.ShareClient('<MY_APP_ID>');
        s.setItemIds(["<MY_FILE_ID>"]);
    }
    window.onload = function() {
        gapi.load('drive-share', init);
    }
</script>
</head>
<body>
    <button onclick="s.showSettingsDialog()">Share</button>
</body>

似乎我做的一切都是正确的，当我点击我的 share 按钮时，对话框开始加载但无法加载.

Seems like I do everything right, when I click my share button, the dialog starts loading but it can't be loaded.

在我看到的控制台中:

Refused to display 'https://drive.google.com/share?...' in a frame
because it set 'X-Frame-Options' to 'SAMEORIGIN'.

我用谷歌搜索了这个错误，我发现在 SO 和其他网站中有一些类似的问题，但它们没有帮助.我猜谷歌不允许自己出现在非谷歌网站的框架中(因为SAMEORIGIN").

I've googled this error and I've seen that there are some similar questions in SO and other sites, but they don't help. I guess Google doesn't allow itself to be in a frame in a not-google-site (cause of "SAMEORIGIN").

如何在我的应用中打开共享对话框?

What can I do to open sharing dialog in my app?

推荐答案

在您的应用中启动 Google Drive 共享对话框"页面 这里 声明:

The "Launching the Google Drive sharing dialog in your app" page here states:

启动对话框的页面的 URL 必须具有相同的来源作为为应用注册的开放 URL.

The URL of the page that launches the dialog must have the same origin as the Open URL registered for the app.

如果您随后查看配置 Drive SDK"的说明这里，您可以看到打开 URL"部分显示为:

If you then look at the instructions to "Configure the Drive SDK" here, you can see that the "Open URL" section reads:

Open URL 有两点需要牢记:

There are two important things to keep in mind for the Open URL:

  • 确保为 Open URL 提供完全限定的域名 - localhost 不起作用.
  • 该网址必须属于您.应用注册完成后，您需要验证您对该 URL 的所有权，以便创建一个Chrome 网上应用店列表.如需更多信息，请参阅网站验证.

因此，您正在启动对话框的页面不与您在 Google Drive SDK 设置中为应用注册的打开 URL 具有相同的来源.因此，要解决您的问题，请更正 Open URL，使其具有正确的 URL，即与 Open URL 具有相同来源的 URL.请注意，您可以通过 https://console.developers.google.com/project<更改 Google Drive SDK 设置/a>.

Hence your page which is launching the dialog does not have the same origin as the Open URL registered for the app in you Google Drive SDK settings. So to fix your problem correct the Open URL so that it has the correct URL i.e. a URL with the same origin as the Open URL. Note that you can change the Google Drive SDK settings via https://console.developers.google.com/project.

以及确保正确设置打开 URL.您还需要将 Drive SDK 应用 ID 替换为MY_APP_ID".您可以按照以下说明找到 App ID:

As well as making sure the Open URL is set correctly. You'll also need to substitute your Drive SDK app ID for 'MY_APP_ID'. You can find the App ID by following these instructions:

  1. 转到 https://console.developers.google.com
  2. 点击您的项目
  3. 点击左侧的APIs and auth"
  4. 点击Drive SDK"设置齿轮图标
  5. 然后可以在Google Drive SDK"标题下找到App ID"，例如应用 ID:47XXXXXXX3

相关文章