Calling the php variable in JavaScript (numerical value of the php variable)

Question

I am planning to get the total number of visits to my site that I stored in the variable $total_visit in php, get the numerical value of this variable in javascript and put it in a moving counter. But when I call the value of the variable, my counter starts counting to infinity and exceeds the number of visits to my site.

The JavaScript code I wrote is as follows:

Start_Timer_one = 0;

var y = "<?php echo json_encode($total_visit); ?>";

function Counter1(oneN, TwoN) {
  document.getElementById(TwoN).innerHTML = Start_Timer_one++;

  Content_timer = setTimeout(function () {
    Counter1(oneN, TwoN);
  }, 1);

  if (Start_Timer_one > oneN) {
    clearTimeout(Content_timer);
  }
}
window.onload = Counter1(y, "test");

This is the php code I wrote to call the site statistics:

$time_zone = 12600;


$today = date("Y-m-d", time() + $time_zone);


$yesterday = date("Y-m-d", time() - 86400 + $time_zone);


$week_visit = 0;
$month_visit = 0;
$month_str = null;


$file_src = 'visit-stats.txt';
chmod($file_src, 0755);


$read_file = file_get_contents($file_src);
if (filesize($file_src) > 0 || $read_file != ''){
    $split_file = explode('|', $read_file);
    $modify = $split_file[31];
    
    if($modify != $today){
        $today_visit = 1;
        
        if($modify == $yesterday){
            $yesterday_visit = $split_file[0];
        } else{
            $yesterday_visit = 0;
        }
        
        $week_visit += $today_visit + $yesterday_visit;
        $month_visit += $today_visit + $yesterday_visit;
        
        for($i = 2; $i < 30; $i++) {
            $month_str .= $split_file[$i - 1];
            
            if($i < 29) {
                $month_str .= '|';
            }
            
            if($i < 8) {
                $week_visit += $split_file[$i - 1];
            }
            
            $month_visit += $split_file[$i - 1];
        }
        
        $total_visit = $split_file[30] + 1;
        $last_modify = $today;
    } 
    else{
        $today_visit = $split_file[0] + 1;
        $yesterday_visit = $split_file[1];
        $week_visit += $today_visit + $yesterday_visit;
        $month_visit += $today_visit + $yesterday_visit;
        
        for($i = 2; $i < 30; $i++) {
            $month_str .= $split_file[$i];
            
            if($i < 29) {
                $month_str .= '|';
            }
            
            if($i < 8) {
                $week_visit += $split_file[$i];
            }
            
            $month_visit += $split_file[$i];
        }
                            
        $total_visit = $split_file[30] + 1;
        $last_modify = $today;
    }
} 
else{
    $today_visit = 1;
    $yesterday_visit = 0;
    $week_visit = 1;
    $month_visit = 1;
    
    for($i = 2; $i < 30; $i++) {
        $month_str .= '0';
        
        if($i < 29) {
            $month_str .= '|';
        }
    }
    
    $total_visit = 1;
    $last_modify = $today; 
}


$file_src_handle = fopen($file_src, 'w+');
$visit_data = $today_visit . '|' . $yesterday_visit . '|' . $month_str . '|' . $total_visit . '|' . $last_modify;
fwrite($file_src_handle, $visit_data);
fclose($file_src_handle);


$config_array = array(
'user_time' => date("YmdHis", time() + $time_zone), 
'user_ip' => $_SERVER['REMOTE_ADDR'], 
'file_name' => 'visit-online.txt'
);
chmod($config_array['file_name'], 0755);


$online_file = file_get_contents($config_array['file_name']);


$online_file = explode("\r\n", $online_file);


foreach($online_file as $key=> $value){
    if(is_null($value) || $value == ''){
        unset($online_file[$key]);
    }
}


foreach($online_file as $key=> $value){
    $user_ip_time = explode("|", $value);
    if($user_ip_time[1] <= date("YmdHis", time() + $time_zone - 300)){
        unset($online_file[$key]);
    }
    
    if($user_ip_time[0] == $config_array['user_ip']){
        unset($online_file[$key]);
    }
}


$online = 1;
foreach($online_file as $online_users){
    $user_ip_time = explode("|", $online_users);
    if($user_ip_time[1] >= date("YmdHis", time() + $time_zone - 300)){
        $online++;
    }
}


$new_online = $config_array['user_ip'] . "|" . $config_array['user_time'] . "\r\n";
foreach($online_file as $key=> $value){
    $new_online .= $value . "\r\n";
}

          
$file_src_handle = fopen($config_array['file_name'], 'w+');
fwrite($file_src_handle, $new_online);
fclose($file_src_handle);


echo '<div class="visit-site text-center">
<div class="row">

<div class="col-xs-2 col-sm-2 visit-today">
<span id="visit-today" class="fas fa-user-check"></span><br>
today visit: <br>' . $today_visit . '
 </div>
 
 <div class="col-xs-2 col-sm-2 visit-yesterday">
 <span id="visit-today" class="fas fa-user-clock"></span><br>
yesterday visit:<br> ' . $yesterday_visit . '
</div>

<div class="col-xs-2 col-sm-2 visit-week">
<span id="visit-today" class="fas fa-user"></span><br>
week visit:<br> ' . $week_visit . '
</div>

<div class="col-xs-2 col-sm-2 visit-moon">
<span id="visit-today" class="fas fa-user-large"></span><br>
month visit:<br> ' . $month_visit . '
</div>

<div class="col-xs-2 col-sm-2 visit-total" id="visit-total">
<span id="visit-today" class="fas fa-eye"></span><br>
total visit :<br> ' . $total_visit . ' 
</div>

<div class="col-xs-2 col-sm-2 user-anline">
<span id="visit-today" class="fas fa-user-group"></span><br>
 online:<br> ' . $online . '
</div>

</div>
</div>
';    
?>

This code works correctly, but when I call the variables from the JavaScript side, the counter counts to infinity.

I put an image of the output of the above codes:

enter image description here

Answer 1

Quote from your comment:

my JS file is separate

...well in that case, it does not execute the PHP code, so your JS y variable will just be a string containing the raw PHP code, which is why it doesn't work as you expect.

You'd have to move that definition into an inline script in the .php file, and pass it to the other JS (e.g. via a function call, or by using it as a global, like you do now). PHP code is only executed within .php files.

N.B. Since you're expecting a number from the PHP variable, there's also no need to JSON-encode it or to enclose the output in quote marks in the JS - it's not a string, or a complex object.

E.g.

PHP file

<script>
  var y = <?php echo $total_visit; ?>;
</script>
<script src="yourJSFile.js"/>

JS File

Start_Timer_one = 0;

function Counter1(oneN, TwoN) {
  document.getElementById(TwoN).innerHTML = Start_Timer_one++;

  Content_timer = setTimeout(function () {
    Counter1(oneN, TwoN);
  }, 1);

  if (Start_Timer_one > oneN) {
    clearTimeout(Content_timer);
  }
}
window.onload = Counter1(y, "test");