JSON AJAX Post 403 forbidden error.

<?php

 //insert data

$servername = "localhost";
$[https://www.commentcamarche.net/contents/1347-wsh-objet-wshnetwork username] = "**********";
$password = "";
$dbname = "**********";

 $nom = $_POST["nom"];
 $age = $_POST["age"];
 $le_commentaire = $_POST["le_commentaire"];

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

$sql = "INSERT INTO commentaire(nom,age,le_commentaire)
 VALUES ('$nom', '$age','$le_commentaire')";


if (mysqli_query($conn, $sql)) {
  // output data of each row
   header('Location: http://localhost/index.html');
} else {
  echo "Error: " . $sql . "<br>" . mysqli_error($conn);
}

$conn->close();

//************************************************************************

  //SELECT DATA

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

$sql = "SELECT nom, age, le_commentaire FROM commentaire";
$result = $conn->query($sql);

if ($result->num_rows > 0) {
  // output data of each row
  
    
   $data = array('nom' => $row[nom],'age' => $row[age],'le_commentaire' => $row[le_commentaire] );                  

    echo json_encode($data);
  
} else {
  echo "0 results";
}
$conn->close();


?>

$.ajax({
   url: urlAjx,
   type: 'POST',
   dataType:'json',
   success: function(data) {
     alert(data[0]); // alerts first string
  },error: function(err){
      console.log('Erreur Ajax',err);
     alert("erreur ajax");
  }

});



      var vcomm;
     var commentaire;   
     vcomm = document.getElementById("VOS COMMENTAIRE");

    

        onload=function addcomm(){
            
            console.log("ajout");
            commentaire = document.createElement('p')
            vcomm.appendChild(commentaire);
            
            commentaire.innerHTML="commentaire"; /* la j'ai envie dajouter mes donné stoker dans l'ARRAY.*/
        }

//script
//*********************************************************
//declaration des variable  
    var nav;
    var navdesign= document.createElement("div");
    var fixeddesign=0;
 //////////////////////////////////////////////////////   

    var nav1= document.getElementById("nav1");
    var nav2= document.getElementById("nav2");
    var nav3= document.getElementById("nav3");
    var nav4= document.getElementById("nav4");

    nav1.onmouseover = function(){
        designover(nav1);
    }
    nav2.onmouseover = function(){
        designover(nav2);
    }
    nav3.onmouseover = function(){
        designover(nav3);
    }
    nav4.onmouseover = function(){
        designover(nav4);
    }

    nav1.onmouseout = function(){
        designout(nav1);
    }
    nav2.onmouseout = function(){
        designout(nav2);
    }
    nav3.onmouseout = function(){
        designout(nav3);
    }
    nav4.onmouseout = function(){
        designout(nav4);
    }

    nav1.onclick = function(){
        designclick(nav1);
    }
    nav2.onclick = function(){
        designclick(nav2);
    }
    nav3.onclick = function(){
        designclick(nav3);
    }
    nav4.onclick = function(){
        designclick(nav4);
    }


// céation du div design
    function designover(nav){
    nav.appendChild(navdesign);
    navdesign.style.position="relative";
    navdesign.style.height=7 +"px";
    navdesign.style.width=100 +"%";
    navdesign.style.background="rgba(0,186,255,0.5)";
    navdesign.style.bottom= 29.9 +"px";
    navdesign.style.borderBottomRightRadius= 100 +"%";
    navdesign.style.borderBottomLeftRadius= 100 +"%";}
////////////////////////////////////////////////////////
//suppression du div 
   function designout(nav){nav.removeChild(navdesign);}
 ///////////////////////////////////////////////////////      
//pour appareil tactile    
    function designclick(nav){
    fixeddesign=1;
    nav.appendChild(navdesign);
    navdesign.style.position="relative";
    navdesign.style.height=7 +"px";
    navdesign.style.width=100 +"%";
    navdesign.style.background="rgba(0,186,255,3)";
    navdesign.style.bottom= 29.9 +"px";
    navdesign.style.borderBottomRightRadius= 100 +"%";
    navdesign.style.borderBottomLeftRadius= 100 +"%";

    }
   //*******************************************************
   //barre de navigaion intelligente
   var body= document.getElementById("body");
    document.onscroll= function(){
    var a = body.scrollTop;
    var cible = document.getElementById("nav");
    
    if(a >= 101){
      cible.style.position= "fixed";
      cible.style.top= 0;
    } 
    else{
      cible.style.position= "static";
     }
    }
    //*******************************************************
    //design click lien reseau sociaux
    function clickdesign(cible){
    cible.style.background="black";
    cible.style.opacity= 60 + "%";
    }
    //*******************************************************
    
    document.onscroll= function() {
        
        var element= document.getElementById("body");
        var scrollUp= document.createElement("div");
        element.appendChild(scrollUp);
        var a = body.scrollTop;
        
        scrollUp.style.borderRadius= 50+"%";
        scrollUp.style.background= "black";
        scrollUp.style.position="fixed";
        scrollUp.style.top=78+"%";
        scrollUp.style.left=88+"%";
        scrollUp.style.width=70+"px";
        scrollUp.style.height=70+"px";

      if(a >= 400){
        console.log("ok");
        //scrollUp.style.opacity=100 +"%";
        scrollUp.style.visibility= "visible";
    } 
    else{
      //scrollUp.style.opacity=0 +"%";
      console.log("non");
      scrollUp.style.visibility= "hidden";
     }
  

    }  


    //******************************************************************





     /*$.ajax({
  type: 'POST',
  dataType: "json",
  url:'test.php',
  
  success: function(data)
  {
   try {
      data = JSON.parse(data);
      console.log(data);
    }catch(e) {}
    console.log(data);
  }
});*/

  $.ajax({
   url: ("test.php"),
   type: 'POST',
   dataType:'json',
   success: function(data) {
     alert(data[0]); // alerts first string
  },error: function(err){
      console.log('Erreur Ajax',err);
     alert("erreur ajax");
  }

});



      var vcomm;
     var commentaire;   
     vcomm = document.getElementById("VOS COMMENTAIRE");

    

        onload=function addcomm(){
            
            console.log("ajout");
            commentaire = document.createElement('p')
            vcomm.appendChild(commentaire);
            
            commentaire.innerHTML="commentaire";
        }

<!DOCTYPE html>


<html id="body" lang='en' >
<head>
    <meta charset="UTF-8" /> 
    <title>
        Le babezien
    </title>
    
    <link rel="stylesheet" href="design.css" >

    <link rel="shortcut icon" href="babezien2.png">    

    

 

<body >
<header style="background-image: url('usthb.jpg');"> 
      
<center>
       <img id="icone" src="le babezien.jpg">
    </center>
</header>

<nav id="nav" >
 
  <a href="" class="navchoice" id="nav1"><b>ACCUEIL</b> </a>
  <a href="" class="navchoice" id="nav2"><b>NOS ARTICLE</b></a>
  <a href="" class="navchoice" id="nav3"><b>CONTACT</b></a>
  <a href="" class="navchoice" id="nav4"><b>INFO</b></a>

</nav>
<article > 
<center>

  
    <div class="presontArt">
        <p class="gauche"> Edition N°1 <b>Le Babezien</b> </p>
    <p class="droite">21/12/2019 <img id="timeArt"  src="time.jpg"> </p></div>
    <img class="firstimg" class="ilsr" src="3.jpg">
    <img class="ilsr" src="4.jpg">
    <img class="ilsr" src="5.jpg">
    <img class="ilsr" class="lastimg" src="6.jpg">
    <div class="presontArt" >
       </center> 
       <a href="" style="margin-left:10px;margin-right: 80%;background-color: rgba(90,90,90);color: white;text-decoration: none; ">telecharger le pdf </a> 
    
    </div>
    <p style="display: flex;background:rgba(1,1,1,0.2);margin-right: 67%;border-radius: 20px;margin-left: 5px; " ">AJOUTER UN COMMENTAIRE:</p>
    
    <div class="encadrageCommentaire">      

      <form  action="test.php" method="post">

       <div class="commentaire"> <p >nom:                </p><input  type="texte" name="nom"></div>
       <div class="commentaire"><p>age:                  </p><input type="texte" name="age"></div>
       <div class="commentaire"><p>commentaire:   </p><input style="min-height: 70px;" type="texte" name="le_commentaire"></div>
        <input style="background:rgba(1,1,1,0.2);width: 12%;margin-left: 85%; border-radius:0 0 5px 0;" type="submit" name="valider">
        
      </form>
    </div>
    
    <div id="VOS COMMENTAIRE" class="encadrageCommentaire">
      <p>
        
      </p>

    </div>

    
</article>

<aside>
    	
    	
	</aside>

 <footer >
  <div class="LigneHonrizontalFooter" ></div>
  <div style="display: flex;padding-top: 10px;justify-content: center; border-height:40px; ">
      <p><b>SUIVEZ Le Babezien</b></p>
    <a onclick="clickdesign(this)" href="https://www.facebook.com/Le-babezien-104889507687360/?__tn__=%2Cd%2CP-R&eid=ARC0wVBmgp6HR37Lc_GMHCaHVkq8l3GSztM-1JFCEA9yPn8KDTcS6ikhW4si7-1a1Cdr-B1slTl1QQpV"><img src="footer-icon-facebook.png"><p> facebook</p></a> 
    <a onclick="clickdesign(this)"><img src="footer-icon-youtube.png"><p> youtube</p></a>     
    <a onclick="clickdesign(this)"><img src="footer-icon-instagram.png"><p> instagram</p></a>   
    </div>
</footer>



</body>
<script type="text/javascript">
var urlAjx = "<?php echo site_url('test.php'); ?>";
</script>
<script type="text/javascript" src="jquery-3.5.1.js"></script>
 <script src="le babezien.js"></script>



</html>

console.log("ereur ajax")

success success: function(data) {
     alert(data[0]); 
  }

$data = array('nom' => $row[nom],'age' => $row[age],'le_commentaire' => $row[le_commentaire] );                  
    
    echo json_encode($data);