AJAX 数据库

在 web 开发中，我们经常需要与数据库交互来获取或存储数据。AJAX 技术可以帮助我们在不刷新整个页面的情况下，通过异步请求与数据库进行交互。

连接数据库

在使用 AJAX 与数据库交互之前，我们首先需要建立一个连接。通常情况下，我们会使用后端语言如 PHP 或 Node.js 来处理数据库连接和查询，并通过 AJAX 请求发送数据到后端。

使用 PHP 连接数据库

// www.javascriptcn.com code example
<?php
$servername = "localhost";
$username = "username";
$password = "password";
$dbname = "myDB";

// 创建连接
$conn = new mysqli($servername, $username, $password, $dbname);

// 检查连接
if ($conn->connect_error) {
    die("连接失败: " . $conn->connect_error);
}
echo "连接成功";
?>

使用 Node.js 连接数据库

// www.javascriptcn.com code example
const mysql = require('mysql');

const connection = mysql.createConnection({
  host: 'localhost',
  user: 'username',
  password: 'password',
  database: 'myDB'
});

connection.connect((err) => {
  if (err) {
    console.error('连接失败: ' + err.stack);
    return;
  }
  console.log('连接成功');
});

发送查询请求

一旦连接建立好，我们就可以通过 AJAX 发送查询请求到后端，从数据库中获取数据。

使用 AJAX 发送查询请求

// www.javascriptcn.com code example
$.ajax({
  url: 'get_data.php',
  method: 'GET',
  success: function(data) {
    console.log('获取数据成功: ' + data);
  },
  error: function(xhr, status, error) {
    console.error('获取数据失败: ' + error);
  }
});

发送写入请求

除了获取数据，我们也可以通过 AJAX 发送写入请求到后端，向数据库中插入或更新数据。

使用 AJAX 发送写入请求

// www.javascriptcn.com code example
$.ajax({
  url: 'insert_data.php',
  method: 'POST',
  data: { name: 'John', age: 30 },
  success: function(data) {
    console.log('写入数据成功: ' + data);
  },
  error: function(xhr, status, error) {
    console.error('写入数据失败: ' + error);
  }
});

通过以上章节的学习，你已经了解了如何使用 AJAX 与数据库进行交互。在实际项目中，你可以根据需要进一步扩展和优化这些技术。