本文介绍了在与requirejs一起使用时未定义gapi错误的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我正在尝试使用requireJS加载google API文件,但出现错误,有人认为我可以低估Google通话之前正在加载GP文件
I am trying to load google API files with requireJS, but getting an error of,One think I can understated that GP file is loading before the google's call
"gp.js:23 Uncaught ReferenceError:未定义gapi"
这是
gp.js文件
function logout()
{
gapi.auth.signOut();
location.reload();
}
function login()
{
var myParams = {
'clientid' : '900278902057-ppqm358qrhki089danipqguj3i4ir70i.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);
}
function loginCallback(result)
{
if(result['status']['signed_in'])
{
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 += "Image:" + resp['image']['url'] + "<br>";
// str += "<img src='" + resp['image']['url'] + "' /><br>";
// str += "URL:" + resp['url'] + "<br>";
str += "Email:" + email + "<br>";
str += "DOB:" + resp['birthday'] + "<br>";
str += "Gender:" + resp['gender'] + "<br>";
document.getElementById("profile").innerHTML = str;
});
}
}
function onLoadCallback()
{
gapi.client.setApiKey('AIzaSyBy08qpAjR9U1nKaZ5H1MmwTuthspQPNqY');
gapi.client.load('plus', 'v1',function(){});
}
以及requirejs文件-main.js
require.config({
shim: {
'jquery': {
exports: '$'
},
/* 'backbone': {
deps: ['jquery', 'underscore'],
},*/
'googleplus' : {
deps: ['jquery'],
exports: 'gapi'
},
},
paths: {
'jquery': '//code.jquery.com/jquery-1.11.0.min',
'googleplus': 'https://apis.google.com/js/plus.js?onload=init',
}
})
require(['gp']);
和html按钮
<input type="button" value="Login" onclick="login()" />
<input type="button" value="Logout" onclick="logout()" />
当我在没有requireJS的情况下尝试时,相同的代码可以完美地工作,但问题是我必须使用requireJS
the same code works perfectly when I try without requireJS, but the thing is I have to do with requireJS
推荐答案
gp.js 必须是一个模块.
define(['jquery', 'googleplus'], function($, gapi) {
# your code
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;
});
});
}
};
$('#login').click(login);
$('#logout').click(logout);
});
并修改模板:
<input type="button" value="Login" id="login" />
<input type="button" value="Logout" id="logout" />
由于gapi.signIn
方法要求在全局名称空间中使用回调函数,因此loginCallback
函数必须是全局的.
Because gapi.signIn
method require callback function in global namespace, loginCallback
function must be global.
这篇关于在与requirejs一起使用时未定义gapi错误的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!