AJAX и иже с ним

Доброго времени суток, господа программисты. У меня следующая проблема: есть игра (в рамках проектной работы по одной дисциплине), написанная на голом js. По ТЗ мне осталось прикрутить последнюю фичу: сохранение рекордов в БД. Но у меня возникли проблемы с освоением AJAX. Возможно есть какие-то другие способы выцепить имя, которое выбрал пользователь и число очков из js и отдать на обработку серверу? Или наоборот обработать их в js? В общем, пришел я к следующему: нашел статейку на javascript . ru, посвященную модулю, облегчающему работу с AJAX. Это не очень-то помогло, но я по крайней мере понимаю, как это работает. В общем ниже приведу свой код. Собственно просьба: если не лень, набросайте как это примерно должно выглядеть применительно к моему проекту.index.php:
<!DOCTYPE html>
<html>
    <head>
        <meta charset = "utf-8">
        <style>
            @import"css/Game.css";
        </style>
    </head>
    <body link = '#ffffff' alink = '#ffffff' vlink = '#ffffff'> 
        <div id = "head">
            <font color = "#ffffff">Unleashed Challenge</font>
        </div>
        <div id = "glob">
                <canvas id='game-canvas' width='1000' height='500' style= "background-color: #ffffff">
                    Your browser doesn't support HTML5 Canvas.
                </canvas>
 
                <script src="js/jquery-2.0.3.js"></script>
                <script src="js/scriptjava.js"></script>
                <script src="js/dfwf.js"></script>
                <div id = 'leaders' style = 'font-size: 200%; color: #ffffff;'></div>                                                   
        </div>
        
        <div id = 'copyright' style = 'color: #ffffff;'><a href = 'leadersboard.php'>The Hall Of Fame</a></div>
        <style>
            body 
            {
                background-color: #483D8B;
            }
        </style>
    </body>
</html>
кусок игрового скрипта (оставил мои потуги отправки переменных на обработку серверу и основной игровой цикл).
function SendGet() {
    //отправляю GET запрос и получаю ответ
    $$a({
        type:'get',//тип запроса: get,post либо head
        url:'ajax.php',//url адрес файла обработчика
        data:{'name': x, 'score' : SCORE},//параметры запроса
        response:'text',//тип возвращаемого ответа text либо xml
        success:function (data) {//возвращаемый результат от сервера
            $$('result',$$('result').innerHTML+'<br />'+data);
        }
    });
}
 
 
 
 
function getXmlHttp(){
  var xmlhttp;
  try {
    xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
  } catch (e) {
    try {
      xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
    } catch (E) {
      xmlhttp = false;
    }
  }
  if (!xmlhttp && typeof XMLHttpRequest!='undefined') {
    xmlhttp = new XMLHttpRequest();
  }
  return xmlhttp;
}
 
function upd() 
{
  var xmlhttp = getXmlHttp()
  xmlhttp.open('GET', '/test.php', false);
  xmlhttp.send(x);
  if(xmlhttp.status == 200) 
  {
    alert(xmlhttp.responseText);
  }
}
 
function update()
{
  initializeImages();
 
//Бонусы
if (bonus_exists && player.x > 408 && player.x < 432 && pl_plat) {
  
  addScore('bonus_t2');
  bonus_exists = false;
}
 
if (SCORE > bonus_ns) {
  bonus_exists = true;
  bonus_rand = Math.random();
  bonus_ns += (bonus_rand * 15000);
}
 
 
 
 
 
//ИИ
  for (var i = 0; i < enemies.length; i++)
  {
    if (enemies[i].x < player.x - 10)
    {
          enemies[i].x += enemies[i].spd;
          draw(player.right, player.of);      
    }
    if (enemies[i].x > player.x - 10 && enemies[i].x < player.x + 10 && player.y > 385)
          player.hp--;
    if (enemies[i].x > player.x + 10)
    {
          enemies[i].x -= enemies[i].spd;
          draw(player.right, player.of);  
    }
  }
if (player.hp === 0) {
  drawBackground();
  context.save();
  context.textBaseline = 'center';
  context.fillStyle = "#FFF";
  context.font = "italic 75pt Old English Text MT";
  context.fillText('GAME      OVER', 80, 300);
  context.restore();
  //pause(10000);
  throw new Error();
}
 
 
//Проверка на платформы
var pd1, top1;
for (var i = 0; i < platformData.length; ++i) 
    {
      pd1 = platformData[i];
      top1 = calculatePlatformTop(pd1.track);
      if (player.y == top1 - 8 || player.y == top1 - 7 || player.y == top1 - 6 || player.y == top1 - 5 || player.y 
 
== top1 - 4 || player.y == top1 - 3)
      {
        if (player.x >= pd1.left && player.x <= pd1.left + pd1.width)
        {
          pl_plat = true;
          break;
        }
        else
          pl_plat = false;
      }
    }
 
 
 
 
 
//Jump
if (spdY)
{
  if (player.y > 0) 
  {
    player.y -= spdY;
    draw (player.right, player.of);
    spdY -= 2;
    
  }
  else {
    player.y = 2;
    spdY = 0;
    player.air = true;
  }
}
else
{
  player.jump = false;
}
  
 
 
  //Персонаж
if (keys[85])
{
  if (player.level == 1 && MONEY >= 30000)
    {
      player.level++;
      MONEY -= 50000;
      player.pl_img.src = 'pic/person2.png';
      player.plr_img.src = 'pic/personr2.png';
      player.speed *= 3;
    }
}
 
 
  if (keys[38] || keys[32]) 
    {
      if(!player.air)
      {
        player.air = true;
        player.jump = true;
        pl_plat = false;
        spdY = 20;
        draw(player.right, player.of);
      }
    }
  if (player.y < 410 && !pl_plat)
  {
 
    {
 
      player.air = true;
      player.y += gravity;
      draw(player.right, player.of);
      player.velY = 0;
    }
  }
  else 
  {
    countJ = 0;
    player.air = false;
  }
 
 
    if (keys[39]) 
    {
        // right arrow
        player.right = true;
        
         if (player.x < 985)
         {
          player.x += player.speed;
          draw(player.right, player.of);      
         }
    }     
    if (keys[37]) 
    {         
        // left arrow   
        player.right = false;
        if (player.x > 0)
        {      
          player.x -= player.speed;
          draw(player.right, player.of);         
        }
    }
if (keys[70])
    // 'f'
{
    if (player.right) 
    {
      player.of = 1;
      for (var i = 0; i < enemies.length; i++)
      {
        if (enemies[i].x < player.x + 50 && enemies[i].x > player.x + 10 && player.y > 400)
        {
          enquant--;
          addScore('kill_t1');
          enemies.splice(i, 1);
          if (enquant <= 4) 
          {
            rand1 = Math.random();
            rand2 = Math.random();
            randomX = rand1 * (1000 * rand2);
            if (randomX < player.x + 100 && randomX > player.x - 100)
              randomX += 400;
            rand1 = Math.random();
            randomSPD = rand1 * 5.5;
            if (randomSPD < 3)
              randomSPD++;
            enemy2 = new enemy(randomX, 400, randomSPD, 'pic/enemy1.png');
            enemies.push(enemy2);
            rand1 = Math.random();
            rand2 = Math.random();
            randomX = rand1 * (1000 * rand2);
            if (randomX < player.x + 100 && randomX > player.x - 100)
              randomX += 400;
            rand1 = Math.random();
            randomSPD = rand1 * 5.5;
            if (randomSPD < 3)
              randomSPD++;
            enemy2 = new enemy(randomX, 400, randomSPD, 'pic/enemy1.png');
            enemies.push(enemy2);
            enquant += 2;
          }
        }
      }
    }
    else
    {
      player.of = 2;
      for (var i = 0; i < enemies.length; i++)
      {
        if (enemies[i].x > player.x - 50 && enemies[i].x < player.x - 10 && player.y > 400)
        {
          enquant--;
          addScore('kill_t1');
          enemies.splice(i, 1);
          if (enquant <= 4) 
          {
            rand1 = Math.random();
            rand2 = Math.random();
            randomX = rand1 * (1000 * rand2);
            if (randomX < player.x + 100 && randomX > player.x - 100)
              randomX += 400;
            rand1 = Math.random();
            randomSPD = rand1 * 5.5;
            if (randomSPD < 3)
              randomSPD++;
            enemy2 = new enemy(randomX, 400, randomSPD, 'pic/enemy1.png');
            enemies.push(enemy2);
            rand1 = Math.random();
            rand2 = Math.random();
            randomX = rand1 * (1000 * rand2);
            if (randomX < player.x + 100 && randomX > player.x - 100)
              randomX += 400;
            rand1 = Math.random();
            randomSPD = rand1 * 5.5;
            if (randomSPD < 3)
              randomSPD++;
            enemy2 = new enemy(randomX, 400, randomSPD, 'pic/enemy1.png');
            enemies.push(enemy2);
            enquant += 2;
          }
        }
  }
    draw(player.right, player.of);
    setInterval('player.of = 0', 1);
    }
    
  }
 
  draw(player.right, player.of);
  setInterval('addScore("second")', 2500);
  requestAnimationFrame(update);
  context.save();
  context.textBaseline = 'center';
  context.fillStyle = "#FFF";
  context.font = "italic 24pt Old English Text MT";
  context.fillText('SCORE: ' + Math.round(SCORE) + '     Money: ' + MONEY, 25, 32);
  context.font = "italic 15pt Old English Text MT"
  context.fillText('Next Bonus:' + Math.round(bonus_ns) + '       ' + spdY, 25, 75); 
  context.restore();
  SendGet();
}
 
 
document.body.addEventListener("keydown", function(e) {
    keys[e.keyCode] = true;
});
 
document.body.addEventListener("*****", function(e) {
    keys[e.keyCode] = false;
});
 
window.addEventListener("load",function(){
    update();
});
ajax.php
<?php
if(isset($_GET['name'])) {
    $link = mysql_connect('localhost', 'root', '123')
        or die('Can not connect to mysql: ' . mysql_error());
    mysql_select_db('unleashedchallenge') 
        or die('Database error');
    mysql_query("INSERT INTO user VALUES ($_GET['name'], $_GET['score'])");
    $query = 'SELECT hscore FROM user WHERE $_GET["name"] = user_name';
    $result = mysql_query($query) or die('Select fault: ' . mysql_error());
    if (isset($_GET['score']))
    {
        if ($result < $_GET['score'])
        {
            $query1 = 'UPDATE user SET hscore = $_GET["score"] WHERE $_GET["name"] = user_name';
            mysql_query($query1);
        }
    }
}
?>
З.Ы. игра залита на бесплатный хостинг: игра. Управление: стрелки, f - оружие, u - апгрейд (30к денег).
14 ответов

У вас в PHP-скрипте GET переменные принимаются. А ведь Ajax'ом передаются POST переменные.Тем более когда у Вас jQuery подключен, проще слать на сервер так:
$.post('handle.php', {'data': 'some_data'}, function(data, status) {
  alert(data);
})
Я конечно не знаю, может быть можно слать и GET запросы. Но вроде нет.


Razip, функция sendGet основного скрипта отправляет данные на сервер методом get...


Temptation, не знал честно говоря. Да и зачем использовать GET? У них ограниченная длина.Попробуйте мой способ, заместо того что с сайта javascript. Только $.get заместо $.post. Я не понимаю какой смысл использовать сторонний плагин если у Вас подключен jQuery в котором есть такая возможность.
function sendGet() {
$.get('handle.php', {'name': x, 'score' : SCORE}, function(data, status) {
  alert(data); //вывод того что пришло с сервера в ответ
});
}


Razip, окей, я попробую, один вопрос: alert(data) - то, что возвращает сервер?


Temptation, да.


В базе данных изменений не обнаружено. Я просто не понимаю где косяк. Вчера я несколько методов и разных вариаций одной и той же функции перепробовал, но ни черта не получается.


Данные приходят на сервер?Temptation,
mysql_query("INSERT INTO user VALUES ($_GET['name'], $_GET['score'])")
До VALUES идут колонки в которые нужно вставлять данные. К примеру:
mysql_query("INSERT INTO user(`name`, `score`) VALUES($_GET['name'], $_GET['score'])")


Razip, выполнение ajax.php не начинается в принципе.


Temptation, пробовали самостоятельно вызывать функцию для теста?


И, кстати, если инсертом вставляется запись, которая покрывает все колонки, то явным образом указывать эти самые колонки не требуется.


Как узнали что файл не выполняется? Что возвращает сервер?


Razip, а что Вы под этим подразумеваете?


Temptation, ну я же не знал сколько у Вас колонок в БД. Перебираю все варианты.


вставил в начале ajax.php до проверки на иссет создание строки для ввода.
<?php
echo "<form> <input type = 'text'>  </form>";
if(isset($_POST['name'])) {
...