JavaScript回调函数执行了2次

Question

users can sign in to my system using google sign in so when use pressing google sign in button his account will be create in mysql database my problem is every users account created two time when user trying to sign in by google in other words function of create account executed two time for every user here is my html code

<a id="gp_login" href="javascript:void(0)" onclick="javascript:googleAuth()">Login using Google</a>

this is javascript code

function gPOnLoad(){
     // G+ api loaded
     document.getElementById('gp_login').style.display = 'block';
}
function googleAuth() {
    gapi.auth.signIn({
        callback: 'gPSignInCallback',
        clientid: '636950137786-j3siaftgshtf9iamovisf603pplv7jf1.apps.googleusercontent.com',
        cookiepolicy: "single_host_origin",
        requestvisibleactions: "http://schema.org/AddAction",
        scope: "https://www.googleapis.com/auth/plus.login email https://www.googleapis.com/auth/user.phonenumbers.read https://www.googleapis.com/auth/user.birthday.read"
    })
}

function gPSignInCallback(e) {
    if (e["status"]["signed_in"]) {
        gapi.client.load("plus", "v1", function() {
            if (e["access_token"]) {
                getProfile()
            } else if (e["error"]) {alert(e['error'])
                console.log("There was an error: " + e["error"])
            }
        })
    } else {alert(e["error"]);
        console.log("Sign-in state: " + e["error"])
    }
}

function getProfile() {
    //var e = googleData.getBasicProfile();

   var e = gapi.client.plus.people.get({
       userId: "me"
    });
    e.execute(function(e) {
        if (e.error) {alert(e.message)
            console.log(e.message);
            return
        } else if (e.id) {var msgs=JSON.stringify(e);
           alert(e.displayName);
   update_user_data(e);



           // save profile data
        }
    })
}(function() {
    var e = document.createElement("script");
    e.type = "text/javascript";
    e.async = true;
    e.src = "https://apis.google.com/js/client:platform.js?onload=gPOnLoad";
    var t = document.getElementsByTagName("script")[0];
    t.parentNode.insertBefore(e, t)
})()

function update_user_data(response) 
{
    // var dataString = JSON.stringify(response);
var email=response.emails[0]['value'];
var  displayName=response.displayName;

//ar 

      $.ajax({
            type: "POST",

            data: {email:email,displayName:displayName},
            url: 'Save.php?id=check_user',
            success: function(msg) {


        var array = msg.split(',');
            var email =array[0];alert(email);
    var password = array[1];alert(password);
    $('#username').val(email);$('#password').val(password);
document.getElementById("modal4c").click();
            },
               error: function(XMLHttpRequest,textStatus,errorThrown) {//alert(JSON.stringify(msg));

            }
      });
}

update_user_data() function is to insert account into mysql database but this function is called twice per user.

Answer 1

Not sure why you function runs twice but, one way to ensure a function runs only once would be make some global flag like this

runOnce = false;

function gPSignInCallback(e) {
  if(runOnce) return;
  runOnce = true;
  // ... rest of the function
}

If you want to avoid global vars you could return a closure like this

 function update_user_data(e){
   var runOnce = false
   return function(){
     if(runOnce) return;
     runOnce = true;
     // ... rest of the function
   }
 }

And call it like this update_user_data()(e)