2016-08-02 110 views
4

我試圖使用requireJS與谷歌,加上API,但得到當我點擊登錄按鈕谷歌加API錯誤gapi.loaded_0

這裏的錯誤是錯誤和截圖:

GET https://apis.google.com/_/scs/apps-static/_/js/k=oz.gapi.en.f5Li87Zolqg.O/m…sv=1/d=1/ed=1/am=AQ/RS=AGLTcCPR6xH_GlLdKZ8KMxaWNPWQokoYsg/cb=gapi.loaded_0

截圖:https://i.imgsafe.org/098c5b5634.png

,我使用此代碼:
gapi is not defined error comes when using with requirejs

注意:我在調用一個JavaScript文件中的gp.js並在其中定義它,這裏是第一行。

我screen.js文件

define(["facebook","fb","googleplus","gp"], function(facebook,fb,gapi,gp){ 
// some bunch other code will go here 

      $('#login').click(login); 

      // some other code will go here 

}); 

gp.js是包含以下代碼

//$('#login').click(login); 
    //$('#logout').click(logout); 
function logout(){ 
    gapi.auth.signOut(); 
    location.reload(); 
} 
function login() { 
    var myParams = { 
     'clientid' : '455646565646-ppqmgsfghfdhgfghqguj3i4ir70i.apps.googleusercontent.com', 
     'cookiepolicy' : 'single_host_origin', 
     'callback' : 'loginCallback', 
     'approvalprompt':'force', 
     'scope' : 'https://www.googleapis.com/auth/plus.login https://www.googleapis.com/auth/plus.me https://www.googleapis.com/auth/userinfo.email https://www.googleapis.com/auth/userinfo.profile' 
    }; 
    gapi.auth.signIn(myParams); 
} 

    window.loginCallback = function (result) { 
     if (result['status']['signed_in']) { 
      gapi.client.load('plus', 'v1', function() { 
       var request = gapi.client.plus.people.get(
        { 
         'userId': 'me' 
        }); 
       request.execute(function (resp) { 
        var email = ''; 
        if (resp['emails']) { 
         for (i = 0; i < resp['emails'].length; i++) { 
          if (resp['emails'][i]['type'] == 'account') { 
           email = resp['emails'][i]['value']; 
          } 
         } 
        } 


        var str = "Name:" + resp['displayName'] + "<br>"; 
        str += "Email:" + email + "<br>"; 
        str += "DOB:" + resp['birthday'] + "<br>"; 
        str += "Gender:" + resp['gender'] + "<br>"; 
        document.getElementById("profile").innerHTML = str; 
       }); 
      }); 
     } 
    } 

    onLoadCallback = function(){ 
    gapi.client.setApiKey('Sgtfjhygjhgjhg9U1nKaZ5H1MmwTuthspQPNqY'); 
    gapi.client.load('plus', 'v1',function(){}); 
} 

而我main.js放在這裏

require.config({ 
    shim: { 

     'gp' : { 
      deps: ['jquery','googleplus'], 


     }, 
     'googleplus' : { 
      deps: ['jquery'], 
      exports: 'gapi' 
     }, 


    }, 
    paths: { 
     'googleplus': 'https://apis.google.com/js/client.js?onload=onLoadCallback' 

    }, 

}) 
require(['gp']); 

爲什麼會發生這種情況,我該如何解決?

+0

你有沒有想過這個? – CamHart

回答

0

gs.js必須是一個模塊,如果你想使用一個模塊內定義的函數,該模塊必須返回該功能:

define(['jquery', 'googleplus'], function($, gapi) { 
    function logout(){ 
     gapi.auth.signOut(); 
     location.reload(); 
    } 
    function login() { 
     var myParams = { 
      'clientid' : '455646565646-ppqmgsfghfdhgfghqguj3i4ir70i.apps.googleusercontent.com', 
      'cookiepolicy' : 'single_host_origin', 
      'scope' : 'https://www.googleapis.com/auth/plus.login https://www.googleapis.com/auth/plus.me https://www.googleapis.com/auth/userinfo.email https://www.googleapis.com/auth/userinfo.profile' 
     }; 
     gapi.load('client:auth2', function() { 
      gapi.auth2.init(myParams).then(function() { 
       gapi.auth2.getAuthInstance().signIn().then(loginCallback); 
      }); 
     }); 
    } 

    var loginCallback = function() { 
     gapi.client.load('plus', 'v1', function() { 
      var request = gapi.client.plus.people.get(
       { 
        'userId': 'me' 
       }); 
      request.execute(function (resp) { 
       var email = ''; 
       if (resp['emails']) { 
        for (i = 0; i < resp['emails'].length; i++) { 
         if (resp['emails'][i]['type'] == 'account') { 
          email = resp['emails'][i]['value']; 
         } 
        } 
       } 


       var str = "Name:" + resp['displayName'] + "<br>"; 
       str += "Email:" + email + "<br>"; 
       str += "DOB:" + resp['birthday'] + "<br>"; 
       str += "Gender:" + resp['gender'] + "<br>"; 
       document.getElementById("profile").innerHTML = str; 
      }); 
     }); 

    } 

    gapi.client.setApiKey('Sgtfjhygjhgjhg9U1nKaZ5H1MmwTuthspQPNqY'); 

    return { 
     login: login, 
     logout: logout 
    }; 
}); 

現在你可以使用功能loginlogout其他模塊:

define(["jquery", "gp"], function($, gp){ 
    $('#login').click(gp.login); 
}); 

編輯:

我試圖重寫login功能基於https://developers.google.com/identity/sign-in/web/reference#gapiauth2initwzxhzdk19paramswzxhzdk20

+0

但我的問題與GET的空載https://apis.google.com//scs/apps-static//js/k=oz.gapi.en.f5Li87Zolqg.O/m...sv=1/d = 1/ed = 1/am = AQ/rs = AGLTcCPR6xH_GlLdKZ8KMxaWNPWQokoYsg/cb = gapi.loaded_0在這裏我得到404在網絡和 – Aryan

+0

當我正在嘗試你的代碼我得到這個錯誤無法讀取屬性'setApiKey'undefined – Aryan