[php + javascript] php 배열 값을 javascript 변수에 담는 방법

javascript에서 php로 변수를 보내줄 때는 form이나 ajax 통신 등을 이용해야할 때가 많다...

반대로 php에서 javascript로 변수를 보내줄 때는 비교적 편리하다...

 

// 반환해 줄 php 배열 변수
$arr = array('apple', 'banana');

우선 이렇게 화면에 보내 줄 arr 변수가 있다고 하자

 

화면 단의 script에서 해당 변수를 써야한다면

require_once "위의 arr 변수가 있는 php 파일 경로";

// 생략...

<script>

let fruitArr = <?= $arr ?>;
console.log(fruitArr);
// 기대한 결과 값 ['apple', 'banana']

</script>

script 태그 안에서 <?= $arr ?> 또는 <?php $arr ?> 을 통해 담아주려고 했을 것이다.

근데 console을 확인하면 에러가 발생해 있고, 정상적으로 변수가 담겨 있지 않을 것이다.

Uncaught SyntaxError: Unexpected token '<' 에러 발생

개발자 모드에서 source를 열어보면 위와 같은 에러가 찍혀있다.

Array to string conversion in "경로"

배열을 문자열로 변환하는데 문제가 있다는 것이다...

 

해결 방법은 간단하다!

require_once "위의 arr 변수가 있는 php 파일 경로";

// 생략...

<script>

  let fruitArr = <?= json_encode($arr) ?>;
  console.log(fruitArr);  
  
</script>

바로 json_encode 함수를 이용해 변환해주는 것이다!

source를 봐도 배열이 잘 들어와 있고

콘솔을 보더라도 배열로 값이 잘 넘어온 것을 확인할 수 있다!!