1

我知道这已经被问过很多次了，我已经浏览了无数关于这个问题的线程，但似乎没有解决方案适用于我的案例。使用谷歌驱动器文件选择器，在选择过程中，我一直在控制台中收到此错误：

无法在“DOMWindow”上执行“postMessage”：提供的目标来源（“https://docs.google.com”）与收件人窗口的来源（“https://develop.uninettunouniversity.net”）不匹配

尽管出现错误，选择器第一次工作正常，但如果我第二次打开它，选择一个文件并单击“选择”按钮不会关闭对话框。拾取的文件返回回调后，要关闭对话框，用户必须点击右上角的“取消”或“x”按钮。我不确定控制台错误和选择器对话框问题是否相关。

我已经阅读了所有这些：

我是 google google drive 文件选择器和 google drive API，这是源代码，它几乎是“按原样”从 google drive picker 文档中的在线示例中获取的：

 <script type="text/javascript" src="https://apis.google.com/js/api.js"></script>
 <script>
        // The Browser API key obtained from the Google API Console.
        // Replace with your own Browser API key, or your own key.
        var developerKey = 'xxxxxxxxxxxxxxxxxxxxxxxxxxxxx';

        // The Client ID obtained from the Google API Console. Replace with your own Client ID.
        var clientId = "xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx"

        // Replace with your own project number from console.developers.google.com.
        // See "Project number" under "IAM & Admin" > "Settings"
        var appId = "xxxxxxxxxxxxxxxx";

        // Scope to use to access user's Drive items.
        var scope = ['https://www.googleapis.com/auth/drive.file'];

        var pickerApiLoaded = false;
        var oauthToken;

        // Use the Google API Loader script to load the google.picker script.
        function loadPicker() {
            gapi.load('auth', { 'callback': onAuthApiLoad });
            gapi.load('picker', { 'callback': onPickerApiLoad });
        }

        function onAuthApiLoad() {
            window.gapi.auth.authorize(
                {
                    'client_id': clientId,
                    'scope': scope,
                    'immediate': false
                },
                handleAuthResult);
        }

        function onPickerApiLoad() {
            pickerApiLoaded = true;
            createPicker();
        }

        function handleAuthResult(authResult) {
            if (authResult && !authResult.error) {
                oauthToken = authResult.access_token;
                createPicker();
            }
        }

        // Create and render a Picker object for searching images.
        function createPicker() {
            if (pickerApiLoaded && oauthToken) {
                var view = new google.picker.View(google.picker.ViewId.DOCS);
                view.setMimeTypes("image/png,image/jpeg,image/jpg");
                var picker = new google.picker.PickerBuilder()
                    .enableFeature(google.picker.Feature.NAV_HIDDEN)
                    .enableFeature(google.picker.Feature.MULTISELECT_ENABLED)
                    .setAppId(appId)
                    .setOAuthToken(oauthToken)
                    .addView(view)
                    .addView(new google.picker.DocsUploadView())
                    .setDeveloperKey(developerKey)
                    .setCallback(pickerCallback)
                    .build();
                picker.setVisible(true);
            }
        }

        // A simple callback implementation.
        function pickerCallback(data) {
            if (data.action == google.picker.Action.PICKED) {
                var fileId = data.docs[0].id;
                alert('The user selected: ' + fileId);
            }
        }
  </script>
  <div>
        <button type="button" onclick="loadPicker()">Load google drive picker</button>
  </div>

  • 授权的 javascript 源和重定向 uri 包含在 google 控制台中，所有 uri 都在 SSL 下。

  • 我已启用选择器和 google drive api

  • 我试图注释掉 setDeveloperKey() 和 setAPPid() 没有效果

  • 范围包含在开发者控制台 oauth 同意屏幕部分中

  • 我没有收到上述许多问题中常见的 cors 错误或“无效的 x-frame-options 标头”

  • 我尝试在加载 API 时将 API 密钥作为参数包含在内，例如：

    src="https://apis.google.com/js/api.js?key=xxxxxxxxxxxxxxxxxxx"

  • 源由本地 html 服务器 (IIS) 提供服务，我在生产服务器上遇到了同样的问题。两者都在 SSL 下。

  • 我已经按照文档中的建议尝试了 picker.setOrigin(window.location.protocol + '//' + window.location.host )

4

0 回答 0