我想在平台上每5秒回复一次在线用户数量。它是用会话制作的。这是PHP函数,当我刷新页面时它正在工作。我想通过AJAX调用此函数来显示数据而不刷新页面。此函数位于index.php
文件中:
function users_online() {
global $con;
$session = session_id();
$time = time();
$time_out_in_seconds = 30;
$time_out = $time - $time_out_in_seconds;
$query = "SELECT * FROM users_online WHERE session = '$session'";
$send_query = mysqli_query($con, $query);
$count = mysqli_num_rows($send_query);
if($count == NULL) {
mysqli_query($con, "INSERT INTO users_online(session, time) VALUES('$session','$time')");
} else {
mysqli_query($con, "UPDATE users_online SET time = '$time' WHERE session = '$session'");
}
$users_online_query = mysqli_query($con, "SELECT * FROM users_online WHERE time > '$time_out'");
echo $count_user = mysqli_num_rows($users_online_query);
}
整个index.php:
<?php
include("includes/header.php");
//include("functions.php");
function users_online() {
global $con;
$session = session_id();
$time = time();
$time_out_in_seconds = 30;
$time_out = $time - $time_out_in_seconds;
$query = "SELECT * FROM users_online WHERE session = '$session'";
$send_query = mysqli_query($con, $query);
$count = mysqli_num_rows($send_query);
if($count == NULL) {
mysqli_query($con, "INSERT INTO users_online(session, time) VALUES('$session','$time')");
} else {
mysqli_query($con, "UPDATE users_online SET time = '$time' WHERE session = '$session'");
}
$users_online_query = mysqli_query($con, "SELECT * FROM users_online WHERE time > '$time_out'");
echo $count_user = mysqli_num_rows($users_online_query);
}
$message_obj = new Message($con, $userLoggedIn);
if(isset($_GET['u']))
$user_to = $_GET['u'];
else {
$user_to = $message_obj->getMostRecentUser();
if($user_to == false)
$user_to = 'new';
}
if($user_to != "new")
$user_to_obj = new User($con, $user_to);
if(isset($_POST['post_message'])) {
if(isset($_POST['message_body'])) {
$body = mysqli_real_escape_string($con, $_POST['message_body']);
$date = date("Y-m-d H:i:s");
$message_obj->sendMessage($user_to, $body, $date);
}
}
if(isset($_POST['post'])){
$uploadOk = 1;
$imageName = $_FILES['fileToUpload']['name'];
$errorMessage = "";
if($imageName != "") {
$targetDir = "assets/images/posts/";
$imageName = $targetDir . uniqid() . basename($imageName);
$imageFileType = pathinfo($imageName, PATHINFO_EXTENSION);
if($_FILES['fileToUpload']['size'] > 10000000) {
$errorMessage = "Sorry your file is too large";
$uploadOk = 0;
}
if(strtolower($imageFileType) != "jpeg" && strtolower($imageFileType) != "png" && strtolower($imageFileType) != "jpg") {
$errorMessage = "Sorry, only jpeg, jpg and png files are allowed";
$uploadOk = 0;
}
if($uploadOk) {
if(move_uploaded_file($_FILES['fileToUpload']['tmp_name'], $imageName)) {
//image uploaded okay
}
else {
//image did not upload
$uploadOk = 0;
}
}
}
if($uploadOk) {
$post = new Post($con, $userLoggedIn);
$post->submitPost($_POST['post_text'], 'none', $imageName);
}
else {
echo "<div style='text-align:center;' class='alert alert-danger'>
$errorMessage
</div>";
}
}
?>
<script>
function loadUsersOnline() {
$.get("index.php?onlineusers=result", function(data){
$(".usersonline").text(data);
});
}
setInterval(function(){
loadUsersOnline();
},5000);
</script>
<div class="user_details column">
<a href="<?php echo $userLoggedIn; ?>"> <img src="<?php echo $user['profile_pic']; ?>"> </a>
<div class="user_details_left_right">
<a href="<?php echo $userLoggedIn; ?>">
<?php
echo $user['first_name'] . " " . $user['last_name'];
?>
</a>
<br>
<?php echo "Posts: " . $user['num_posts']. "<br>";
echo "Likes: " . $user['num_likes']. "<br>";
?>
<p>Users Online: <span class='usersonline'></span><?php users_online(); ?></p>
</div>
</div>
<!-- I called the function above and that'the way it works by refreshing the page but the ajax script should work between spans -->
<div class="main_column column">
<form class="post_form" action="index.php" method="POST" enctype="multipart/form-data">
<textarea name="post_text" id="post_text" placeholder="Got something to say?"></textarea>
<input type="submit" name="post" id="post_button" value="Post">
<div class="file-drop-area">
<span class="fake-btn">Choose files</span>
<span class="file-msg js-set-number">or drag and drop files here</span>
<input type="file" name="fileToUpload" id="fileToUpload" class="file-input">
</div>
<script src="assets/js/index.js"></script>
</form>
<div class="posts_area"></div>
<!-- <button id="load_more">Load More Posts</button> -->
<img id="loading" src="assets/images/icons/loading.gif">
</div>
<div class="user_details column">
<h4>Popular</h4>
<div class="trends">
<?php
$query = mysqli_query($con, "SELECT * FROM trends ORDER BY hits DESC LIMIT 9");
foreach($query as $row) {
$word = $row['title'];
$word_dot = strlen($word) >= 14 ? "..." : "";
$trimmed_word = str_split($word, 14);
$trimmed_word = $trimmed_word[0];
echo "<div style'padding: 1px'>";
echo $trimmed_word . $word_dot;
echo "<br></div><br>";
}
?>
</div>
</div>
<div class="user_details column" id="conversations">
<h4>Conversations</h4>
<div class="loaded_conversations">
<?php echo $message_obj->getConvos(); ?>
</div>
<br>
<a href="messages.php?u=new">New Message</a>
</div>
<script>
var userLoggedIn = '<?php echo $userLoggedIn; ?>';
$(document).ready(function() {
$('#loading').show();
//Original ajax request for loading first posts
$.ajax({
url: "includes/handlers/ajax_load_posts.php",
type: "POST",
data: "page=1&userLoggedIn=" + userLoggedIn,
cache:false,
success: function(data) {
$('#loading').hide();
$('.posts_area').html(data);
}
});
$(window).scroll(function() {
//$('#load_more').on("click", function() {
var height = $('.posts_area').height(); //Div containing posts
var scroll_top = $(this).scrollTop();
var page = $('.posts_area').find('.nextPage').val();
var noMorePosts = $('.posts_area').find('.noMorePosts').val();
if ((document.body.scrollHeight == document.body.scrollTop + window.innerHeight) && noMorePosts == 'false') {
//if (noMorePosts == 'false') {
$('#loading').show();
var ajaxReq = $.ajax({
url: "includes/handlers/ajax_load_posts.php",
type: "POST",
data: "page=" + page + "&userLoggedIn=" + userLoggedIn,
cache:false,
success: function(response) {
$('.posts_area').find('.nextPage').remove(); //Removes current .nextpage
$('.posts_area').find('.noMorePosts').remove(); //Removes current .nextpage
$('.posts_area').find('.noMorePostsText').remove(); //Removes current .nextpage
$('#loading').hide();
$('.posts_area').append(response);
}
});
} //End if
return false;
}); //End (window).scroll(function())
});
</script>
</div>
</body>
</html>
答案 0 :(得分:0)
当您使用AJAX提取数据时,您似乎取回了index.php
的内容,然后将其复制到范围中。您的index.php
不包含对get变量的检查,并且函数永远不会被调用。因此,在index.php
的顶部添加这样的一行,在<?php
后面的下一行, include("includes/header.php");
之前添加:
if ( array_key_exists( "onlineusers", $_GET ) &&
"result" == $_GET[ "onlineusers" ] ) {
echo users_online();
exit();
}
另外,请注意,我建议你查看COUNT()
MySQL函数来简化你的查询,你的MySQL服务器会感谢你没有为每个查询不必要地请求完整的表: / p>
$users_online_query = mysqli_query($con, "SELECT COUNT( * ) FROM users_online WHERE time > '$time_out'");
到目前为止,除了所有其他评论者之外,我还建议在此应用程序中认真考虑性能问题。根据您期望拥有的用户数量,服务器上的负担可能会很大。另一方面,一些精心调整的缓存设置可以创造奇迹。例如,将AJAX URL上的到期时间设置为5秒允许所有中继站将该数字缓存5秒,因此即使您有10k用户同时请求相同的内容,其中大多数将由某个地方的缓存提供服务。 / p>