JavaScript不会在新窗口中首次加载

时间:2016-07-12 13:34:40

标签: javascript google-picker

我有一个html文件,其中包含按照教程(https://developers.google.com/picker/docs/

实施的google选择器api

我通过点击调用windows.open()的按钮在新窗口中打开该html文件

但不知何故,我第一次打开它时,没有任何表现。我必须关闭窗口,然后再次单击打开它的按钮。

任何帮助?

1 个答案:

答案 0 :(得分:0)

您提供的pastebin代码没有帮助,所以我只是举个例子。

<强> openwindow.html

//HTML page with a button that opens the googlepicker.html
<body>
<script src="js/scripts.js"></script>
<FORM> 
//fill in your appropriate URL
<INPUT type="button" value="New Window!" onClick="window.open('http://localhost:8000/googlepicker.html','window name','width=400,height=400')"> 
</FORM>
</body>

<强> googlepicker.html

使用Google Picker sample

中的代码

       

<script type="text/javascript">

  // The Browser API key obtained from the Google Developers Console.
  var developerKey = 'xxxxxxxYYYYYYYY-12345678';

  // The Client ID obtained from the Google Developers Console. Replace with your own Client ID.
  var clientId = "1234567890-abcdefghijklmnopqrstuvwxyz.apps.googleusercontent.com"

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

  var pickerApiLoaded = false;
  var oauthToken;

  // Use the API Loader script to load google.picker and gapi.auth.
  function onApiLoad() {
    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 picking user Photos.
  function createPicker() {
    if (pickerApiLoaded && oauthToken) {
      var picker = new google.picker.PickerBuilder().
          addView(google.picker.ViewId.PHOTOS).
          setOAuthToken(oauthToken).
          setDeveloperKey(developerKey).
          setCallback(pickerCallback).
          build();
      picker.setVisible(true);
    }
  }

  // A simple callback implementation.
  function pickerCallback(data) {
    var url = 'nothing';
    if (data[google.picker.Response.ACTION] == google.picker.Action.PICKED) {
      var doc = data[google.picker.Response.DOCUMENTS][0];
      url = doc[google.picker.Document.URL];
    }
    var message = 'You picked: ' + url;
    document.getElementById('result').innerHTML = message;
  }
</script>

       

<!-- The Google API Loader script. -->
<script type="text/javascript" src="https://apis.google.com/js/api.js?onload=onApiLoad"></script>

当您点击该按钮时,它会打开一个googlepicker.html的窗口。希望有所帮助。