AJAX를 사용하여 데이터베이스와 대화식으로 통신할 수 있습니다.
AJAX 데이터베이스 인스턴스
다음 예에서는 웹 페이지가 AJAX를 통해 데이터베이스에서 정보를 읽는 방법을 보여줍니다.
이 자습서에서 사용된 웹 사이트 테이블 SQL 파일: website.sql.
예시 설명 - MySQL 데이터베이스
위의 예에서 우리가 사용한 데이터베이스 테이블은 다음과 같습니다.
mysql> 웹사이트에서 * 선택;+----+---------------+--------- ------+-------+---------+| 아이디 | URL |+----+--------- ------+---------------+-------+--------- -+| 1 | https://www.google.cm/ | Taobao | 13 | http://www.codercto.com/ 4 | 웨이보 | 20 | 페이스북 | | 미국 |+----+---------------+------------ - -+-------+---------+5행 세트(0.01초)
예시 설명 - HTML 페이지
사용자가 위의 드롭다운 목록에서 사용자를 선택하면 "showSite()"라는 함수가 실행됩니다. 이 함수는 "onchange" 이벤트에 의해 트리거됩니다.
test.html 파일 코드:
< ! HTML > <html> <머리> < 메타 문자셋 = " utf-8 " > <title> 코더 튜토리얼 ( codercto.com ) </title> <스크립트> 함수 쇼사이트 ( str ) { 만약에 ( str == " " ) { document.getElementById ( " txtHint " ) . innerHTML = " " ; 만약에 ( 창 . XMLHttpRequest ) { // IE7+, Firefox, Chrome, Opera, Safari 브라우저 실행 코드 xmlhttp = 신규 XMLHttpRequest ( ) } 또 다른 { // IE6, IE5 브라우저 실행 코드 xmlhttp = 신규 ActiveXObject ( " Microsoft.XMLHTTP " ) } xmlhttp.onreadystatechange = 함수 ( ) { 만약에 ( xmlhttp . ReadyState == 4 && xmlhttp . status == 200 ) { document.getElementById ( " txtHint " ) . innerHTML = xmlhttp . } xmlhttp 열기 ( " GET " , " getsite_mysql.php ? q = " + str , true ) xmlhttp } < / script > </ 머리 > <본문> <양식> < 선택 이름 = " 사용자 " onchange = " showSite(this.value) " > < 옵션 value = " " > 웹사이트 선택: </ 옵션 > < 옵션 값 = " 1 " > 구글 </ 옵션 > < 옵션 값 = " 2 " > Taobao </ 옵션 > < 옵션 값 = " 3 " > 코더 튜토리얼 </ 옵션 > < 옵션 값 = " 4 " > 웨이보 </ 옵션 > < 옵션 값 = " 5 " > 페이스북 </ 옵션 > </select> </form> <br> < 사업부 id = " txtHint " > < b > 웹사이트 정보가 여기에 표시됩니다... </ b > </ div > </body> </html> showSite() 함수는 다음 단계를 수행합니다.
웹사이트가 선택되었는지 확인하세요.
XMLHttpRequest 객체 생성
서버 응답이 준비되면 실행되는 함수 만들기
서버의 파일에 요청 보내기
URL 끝에 추가된 매개변수(q)에 유의하세요(드롭다운 목록의 내용 포함).
PHP 파일
위에서 JavaScript를 통해 호출되는 서버 페이지는 "getsite_mysql.php"라는 PHP 파일이다.
"getsite_mysql.php"의 소스 코드는 MySQL 데이터베이스에 대해 쿼리를 실행하고 결과를 HTML 테이블로 반환합니다.
getsite_mysql.php 파일 코드:
<?php $q = isset ( $_GET [ " q " ] ) ? intval ( $_GET [ " q " ] ) : ' ' if ( 비어 있음 ( $ q ) ) { 에코 ' 웹사이트를 선택 하세요 . ' ; $ con = mysqli_connect ( ' localhost ' , ' root ' , ' 123456 ' ) if ( ! $콘 ) { die ( ' 연결할 수 없습니다: ' . mysqli_error ( $ con ) ) } // 데이터베이스 선택 mysqli_select_db ( $con , " test " ) ; // 중국어 문자 깨짐을 방지하도록 인코딩 설정 mysqli_set_charset ( $ con , " utf8 " ) ; $ sql = " SELECT * FROM 웹 사이트 id = ' " . $ q . " ' " ; " <table border='1'><tr><th>ID</th><th>웹사이트 이름</th><th>웹사이트 URL</th><th>Alexa 순위</th><th> 국가</th></tr> " ; while ( $row = mysqli_fetch_array ( $result ) ) { 에코 " <tr> " 에코 " <td> " . $ row [ ' id ' ] " </td> " ; " <td> " . $ row [ ' 이름 ' ] " </td> " ; " <td> " . $ row [ ' URL ' ] " </td> " ; " <td> " . $ row [ ' 알렉사 ' ] " </td> " ; " <td> " . $ row [ ' 국가 ' ] 에코 " </tr> " } 에코 " </table> " ; mysqli_close ( $ con ) ; 설명: 쿼리가 JavaScript에서 PHP 파일로 전송되면 어떤 일이 발생합니까?
PHP는 MySQL 데이터베이스에 대한 연결을 엽니다.
선택한 사용자 찾기
HTML 테이블을 생성하고 데이터로 채운 다음 "txtHint" 자리 표시자를 다시 보냅니다.
