js 변수 값 php로 전달하기

js 변수 값 php로 전달하기

snake game에 db를 추가하는 업데이트를 진행하는 와중 javascript에서 전역변수로 선언된 score 값을 php로 어떻게 보내야할 지 고민을 했다.

js나 php나 이제 막 배우는 와중이라서 라이브러리들도 잘 몰라서, 조금 막막했지만 javascript와 php 사이에 html을 낑겨 넣으니 어떻게 구현할 수는 있었다.

form의 action에 인자를 넘길 때, 해당 form 태그 안에 존재하는 input의 value 값을 통해서 인자가 전달되는 점에서 착안하여 인자를 넘기기 위한 용도의 input 태그를 만들었다. type으로 hidden을 주면 화면에 출력되지 않는다. username은 인자의 이름을 지정하기 위한 용도이고, id는 js에서 해당 element를 선택하기 위한 용도이다.

<form name="Form" method="POST" action="process.php">
    <button class='buttons' id='startBtn' type='button'>START</button>
    <button class='buttons' id='restartBtn' type='button'>RESTART</button>
    <button class='buttons' id='submitBtn' type="submit" onclick="submitScore()">SUBMIT</button>
    <input type="hidden" id="username" name="username">
    <input type="hidden" id="score" name="score">
</form>

submit 버튼을 click 했을 때, 실행되는 javascript 코드에서 document.getElementById().value를 이용하여 직접 value 값을 전달하면 process.php action 시, js에 있던 변수 값을 인자로 전달해줄 수 있다.

function submitScore(){
    var username = prompt("What is your name?");
    document.getElementById('username').value = username;
    document.getElementById('score').value = score;
}