繁体   English   中英

使用AJAX和PHP写入MySQL数据库时登录Facebook

[英]Login with Facebook while writing to a MySQL database in AJAX and PHP

在过去的一周中,我一直在尝试通过Facebook API使用登录名,并进一步了解MySQL。 在一些资源的帮助下,我已经成功地做到了。 但是,我现在必须使用AJAX将这两个项目合并为一个项目(因为我不想启动单独的页面,而是停留在同一页面中。

这是我的MySQL代码,就目前而言,它很完美,除了可以运行script.php(我相信我需要将其转换为AJAX):

    <!doctype html>
<html>
<head>
<meta charset="UTF-8">
</head>
<body>
  <form action="script.php" method="post">
<p>first name:
  <input name="namefirst" type="text" id="namefirst" maxlength="35">
</p>
<p>last name:
  <input name="namelast" type="text" id="namelast" maxlength="50">
</p>
<p>
  <label for="textarea">review:</label>
  <textarea name="text" maxlength="65535" id="text"></textarea>
</p>
<p><input type="submit">
</form>
</body>
</html>

这是script.php的代码:

<?php

$servername = "localhost";
$username = "name";
$password = "password";
$dbname = "db";
// Create connection
$conn = new mysqli($servername, $username, $password, $dbname);
// Check connection
if ($conn->connect_error) {
    die("Connection failed: " . $conn->connect_error);
} 


$firstname = filter_var(mysqli_real_escape_string($conn, $_POST["namefirst"]), FILTER_SANITIZE_STRING);
$lastname = filter_var(mysqli_real_escape_string($conn, $_POST["namelast"]), FILTER_SANITIZE_STRING);
$text = filter_var(mysqli_real_escape_string($conn, $_POST["text"]), FILTER_SANITIZE_STRING);


$sql = "INSERT INTO tabel (firstname, lastname, text)
VALUES('$firstname', '$lastname', '$text')";


if ($conn->query($sql) === TRUE) {
    echo "New record created successfully";
    echo "<br><br><br>" . $namefirst . "<br><br>" . $namelast . "<br><br>" . $review;
} else {
    echo "Error: " . $sql . "<br>" . $conn->error;
}

?>

现在,我正在尝试将该项目与该项目结合起来,后者使用Facebook的API进行登录并创建MySQL条目。

这是该代码(fbindex.php):

<?php
// Include FB config file && User class
require_once 'fbConfig.php';
require_once 'User.class.php';

if(isset($accessToken)){
    if(isset($_SESSION['facebook_access_token'])){
        $fb->setDefaultAccessToken($_SESSION['facebook_access_token']);
    }else{
        // Put short-lived access token in session
        $_SESSION['facebook_access_token'] = (string) $accessToken;

          // OAuth 2.0 client handler helps to manage access tokens
        $oAuth2Client = $fb->getOAuth2Client();

        // Exchanges a short-lived access token for a long-lived one
        $longLivedAccessToken = $oAuth2Client->getLongLivedAccessToken($_SESSION['facebook_access_token']);
        $_SESSION['facebook_access_token'] = (string) $longLivedAccessToken;

        // Set default access token to be used in script
        $fb->setDefaultAccessToken($_SESSION['facebook_access_token']);
    }

    // Redirect the user back to the same page if url has "code" parameter in query string
    if(isset($_GET['code'])){
        header('Location: ./');
    }

    // Getting user facebook profile info
    try {
        $profileRequest = $fb->get('/me?fields=name,first_name,last_name,email,picture');
        $fbUserProfile = $profileRequest->getGraphNode()->asArray();
    } catch(FacebookResponseException $e) {
        echo 'Graph returned an error: ' . $e->getMessage();
        session_destroy();
        // Redirect user back to app login page
        header("Location: ./");
        exit;
    } catch(FacebookSDKException $e) {
        echo 'Facebook SDK returned an error: ' . $e->getMessage();
        exit;
    }

    // Initialize User class
    $user = new User();

    // Insert or update user data to the database
    $fbUserData = array(
        'oauth_provider'=> 'facebook',
        'oauth_uid'     => $fbUserProfile['id'],
        'first_name'    => $fbUserProfile['first_name'],
        'last_name'     => $fbUserProfile['last_name'],
        'email'         => $fbUserProfile['email'],
        'picture'       => $fbUserProfile['picture']['url'],
    );
    $userData = $user->checkUser($fbUserData);

    // Put user data into session
    $_SESSION['userData'] = $userData;

    // Get logout url
    $logoutURL = $helper->getLogoutUrl($accessToken, $redirectURL.'logout.php');

    // Render facebook profile data
    if(!empty($userData)){
        $output  = '<h2 style="color:#999999;">Facebook Profile Details</h2>';
        $output .= '<div style="position: relative;">';
        $output .= '<img src="'.$userData['cover'].'" />';
        $output .= '<img style="position: absolute; top: 90%; left: 25%;" src="'.$userData['picture'].'"/>';
        $output .= '</div>';
        $output .= '<br/>Facebook ID : '.$userData['oauth_uid'];
        $output .= '<br/>Name : '.$userData['first_name'].' '.$userData['last_name'];
        $output .= '<br/>Email : '.$userData['email'];
    }else{
        $output = '<h3 style="color:red">Some problem occurred, please try again.</h3>';
    }

}else{
    // Get login url
    $loginURL = $helper->getLoginUrl($redirectURL, $fbPermissions);

    // Render facebook login button
    $output = '<a href="'.htmlspecialchars($loginURL).'">click here to login with facebook</a>';
}
?>
<html>
<head>
</head>
<body>
    <!-- Display login button / Facebook profile information -->
    <div><?php echo $output; ?></div>
</body>

随附的两个文档仅处理facebook登录API信息和SQL数据库。 我的问题是如何结合这两者,因此在成功登录Facebook之后,从index.php获得$ post而不离开页面?

好的,我将尝试引导您进入解决方案的路径(此刻,我将忽略ajax的问题​​,因为这可能会使它变得更加复杂:-))

您的fbindex.php执行以下操作:

  1. 检查用户是否使用Facebook登录-已经可以了
  2. 当不打印到fb的链接(或可能重定向到fb)时-已经可以了
  3. 登录时打印fb-userdata

现在,您需要改进步骤3-在这种情况下,您似乎需要用户提供其他信息-因此,只需将form移至步骤3,并删除名字/姓氏(已经由fb提供)。

当用户提交您的表单(基本上填充text字段)时,操作将指向script.php script.php的开头,不要忘了session_start()然后您就可以再次访问fb-userdata。

script.php修改如何获取数据

$firstname = $_SESSION['userData']['first_name'];
$lastname = $_SESSION['userData']['last_name'];
$text = filter_var(mysqli_real_escape_string($conn, $_POST["text"]), FILTER_SANITIZE_STRING);

并将其保存到数据库(您已经这样做了)

我建议您还保存oauth_uid这样您就可以确定当用户下次再次使用fb登录时是否已经在表中插入了该用户

如果此方法有效,您也可以使用ajax重写它-在这种情况下,您的formscript.php无效,而是将包含JavaScript的数据发送到script.php因此您将停留在同一页面上。 (j4i-在我的代码示例中,我也使用了jQuery

//include jquery

<form id="registerForm">
  <p>
    <label for="textarea">review:</label>
    <textarea name="text" maxlength="65535" id="text"></textarea>
  </p>
  <p><input type="submit"></p>
</form>

<script>
  $(document).ready(function(){
    $("#registerForm").submit(function(event) {
      event.preventDefault();
      var text = $("#text").val();

      $.ajax({
        type: "POST",
        url: "script.php",
        data: "text=" + text,
        success: function(){
          //is called when script.php is finished - do whatever you want now
        }
      });
    });
  });
</script>

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM