使用 JQUERY Ajax 将 JavaScript 值传递给 PHP（值来自 Facebook Javascript SDK）答案

【问题标题】：Pass JavaScript value to PHP using JQUERY Ajax (Values are from Facebook Javascript SDK)使用 JQUERY Ajax 将 JavaScript 值传递给 PHP（值来自 Facebook Javascript SDK）
【发布时间】：2014-11-13 13:16:56
【问题描述】：

首先，我要感谢您花时间阅读我的帖子。

我正在尝试将 Facebook Javascript SDK 添加到网页中，当用户登录时，用户数据将使用 php 保存到 mysql 中。

我几乎可以弄清楚如何在 MYSQL 中插入 PHP 变量数据，但由于这是我第一次使用 Javascript 语言，所以我是全新的 :(

简而言之，我真正期待的是有人在一个简单的网页中向我展示以下内容：

1- 网页启动并检查用户是否已登录 Facebook，以及用户是否已登录应用程序（授予应用程序访问用户基本个人资料和电子邮件的权限）

2- 如果用户未登录 Facebook，用户将被重定向到 Facebook 登录页面，或者如果用户尚未授予应用程序权限，则请求必要的权限。

3- 如果用户通过了前两个阶段（用户成功连接），页面将显示以下消息“Hello Dear $User_Facebook_Name”。

$User_Facebook_Name 是从 Facebook Javascript SDK 由 Javascript 传递的 PHP 变量

我不想使用提交按钮将 Javascript 变量传递给 PHP（网站页面不刷新）。

我更喜欢使用 Facebook Javascript SDK、PHP、Jquery(Ajax) 来解决这个问题。

到目前为止，我有以下代码，页面显示消息，但使用 Facebook Javascript SDK，如下所示：

FB.api(uid, function(info) {

$('#welcome').html("亲爱的你好" + info.name);

index.php

<html>
<head>

  <script type="text/javascript" src="js/jquery-1.11.1.min.js"></script>
  <script type="text/javascript" src="js/myscript.js"></script>
  
</head>
  
<body>
  
  <div id="fb-root"></div>
  
  Hello dear <?php> echo "$user_Facebook_Name"; ?>
  
</body>
</html>

myscript.js

      window.fbAsyncInit = function() {
        FB.init({
          appId      : 'App_ID',
          xfbml      : true,
          version    : 'v2.1'
        });
	
	
	
	//Next, find out if the user is logged in
			
	FB.getLoginStatus(function(response) {

  if (response.status === 'connected') {
    // the user is logged in and has authenticated your

    var uid = response.authResponse.userID;
    var accessToken = response.authResponse.accessToken;
	
	
	FB.api(uid, function(info) {
    
	$('#welcome').html("Hello dear " + info.name );
	
      });
	
	
	
  } else if (response.status === 'not_authorized') {
    // the user is logged into Facebook, 
    // but has not authenticated your app
	
	var oauth_url = 'https://www.facebook.com/dialog/oauth/';
      oauth_url += '?client_id=App_ID'; //Your Client ID
      oauth_url += '&redirect_uri=' + 'http://website.com/'; //Send them here if they're not logged in
      oauth_url += '&scope=email,user_friends';

      window.top.location = oauth_url;
	
	
	
	
	
  } else {
    // the user isn't logged in to Facebook.
	
  }		//Response.status
 });	// Get login status		
}; //FB Async
	  


	  
	  
// Load the JavaScript SDK Asynchronously
      (function(d, s, id){
         var js, fjs = d.getElementsByTagName(s)[0];
         if (d.getElementById(id)) {return;}
         js = d.createElement(s); js.id = id;
         js.src = "//connect.facebook.net/en_US/sdk.js";
         fjs.parentNode.insertBefore(js, fjs);
       }(document, 'script', 'facebook-jssdk'));

任何帮助将不胜感激，并提前感谢您。

【问题讨论】：

标签： javascript php jquery ajax facebook

【解决方案1】：

我不是 100% 确定我理解您的问题，但您似乎在说，一旦您想要将某些内容提交回服务器（PHP 代码），您就想要通过jQuery's $.ajax() 方法异步执行？如果是这样，您仍然可以使用提交按钮而不刷新页面。只需将事件侦听器连接到按钮以在单击时发出 AJAX 请求

HTML：

<form id="theForm">
    <input type="text" id="textBox" name="textBox" value="textBox" />
    <input type="text" id="userName" name="userName" value="userName" />
    <input type="button" id="submitBtn" value="Submit" />
</form>

JS：

$('#submitBtn').on('click', function() {
    var formData = $('#theForm').serialize();
    $.ajax({
        url: 'something.php',
        data: formData,
        success: function (data) {},
        error: function() {}
    })
});

更好的是，如果您希望将数据序列化为对象数组而不是查询字符串，则可以改用.serializeArray()。但是 PHP 应该能够从查询字符串中读取所有值，只要您有与表单元素相关联的名称。然后，您从 PHP 发回的任何内容都将包含在您的成功函数的数据变量中。这将在没有页面刷新的情况下执行。

如果您根本不想使用按钮，我想您可以使用 setTimeout()，这样它就会每 X 毫秒发送一个 AJAX 请求，或者以某种方式检查您的页面上是否进行了更改，但这可能会得到相当复杂。我会说在这一点上保持简单。

编辑：从您的评论中获得更多信息后，答案比上面更简单。尽管如此，您所做的只是在您的 FB.api() 函数中发出 AJAX 请求：

FB.api(uid, function(info) {    
    $('#welcome').html("Hello dear " + info.name );    
    $.ajax({
        url: 'something.php',
        data: info,
        success: ... ,
        error: ...
    });
});

从那里，您只需从 PHP 中的表单变量中获取变量。我的 PHP 有点生疏了，但我相信它会类似于 $_POST["info"]。尝试在不刷新页面的情况下重新显示它是完全没有意义的，因为页面中已经有了变量。将用户名发送到服务器的唯一目的是将其保存在数据库中。您已经通过 API 将其显示在页面上。

【讨论】：

嗨，迈克，感谢您的回答。我想要做的是我有这行代码： $('#welcome').html("Hello Dear" + info.name);它显示一条 Javascript 消息：您好亲爱的 'user_Facebook_Name' 我想通过并在 php 中显示它。
所以您从 Facebook API 获得了一个用户名，并且您想将其发送到服务器以显示它？
是的，正是:) 在同一页面中。而且我不想刷新页面，例如我不想转到另一个页面。
以更简单的方式，这就是我想要帮助的：在网页中，我们有这个 Javascript 变量：var Name = "Mike";现在我想在同一页面中使用这个 php 代码： echo $Name;结果将是迈克。所有都在同一页面中，无需刷新或转到另一个页面。
非常感谢 Mike，这不是确切的答案，但我认为你是对的，现在我有点了解整个过程，唯一的事情是我有点了解 Ajax。再次感谢您的帮助和支持，希望您玩得开心，非常感谢您的帮助。