Next.js の mysql2 を使用して TiDB に接続する
TiDB は MySQL 互換データベースであり、 mysql2は Node.js 用の人気のあるオープンソース ドライバーです。
このチュートリアルでは、Next.js で TiDB と mysql2 を使用して次のタスクを実行する方法を学習できます。
- 環境をセットアップします。
- mysql2 を使用して TiDB クラスターに接続します。
- アプリケーションをビルドして実行します。オプションで、基本的な CRUD 操作のサンプルコードスニペットを見つけることができます。
注記
このチュートリアルは、TiDB サーバーレスおよび TiDB セルフホストで動作します。
前提条件
このチュートリアルを完了するには、次のものが必要です。
- Node.js 18以降。
- ギット 。
- TiDB クラスター。
TiDB クラスターがない場合は、次のように作成できます。
- (推奨) TiDB サーバーレスクラスターの作成に従って、独自のTiDB Cloudクラスターを作成します。
- ローカル テスト TiDB クラスターをデプロイまたは本番TiDB クラスターをデプロイに従ってローカル クラスターを作成します。
サンプル アプリを実行して TiDB に接続する
このセクションでは、サンプル アプリケーション コードを実行して TiDB に接続する方法を説明します。
注記
完全なコード スニペットと実行手順については、 tidb-nextjs-vercel-クイックスタート GitHub リポジトリを参照してください。
ステップ 1: サンプル アプリ リポジトリのクローンを作成する
ターミナル ウィンドウで次のコマンドを実行して、サンプル コード リポジトリのクローンを作成します。
git clone git@github.com:tidb-samples/tidb-nextjs-vercel-quickstart.git
cd tidb-nextjs-vercel-quickstart
ステップ 2: 依存関係をインストールする
次のコマンドを実行して、サンプル アプリに必要なパッケージ ( mysql2
を含む) をインストールします。
npm install
ステップ 3: 接続情報を構成する
選択した TiDB デプロイメント オプションに応じて、TiDB クラスターに接続します。
クラスターページに移動し、ターゲット クラスターの名前をクリックして、その概要ページに移動します。
右上隅にある「接続」をクリックします。接続ダイアログが表示されます。
接続ダイアログの設定が動作環境と一致していることを確認してください。
エンドポイント タイプは
Public
に設定されますブランチは
main
に設定されています[接続先] は
General
に設定されていますオペレーティング システムが環境に一致します。
注記
Node.js アプリケーションでは、TLS (SSL) 接続を確立するときにデフォルトで組み込みのMozilla CA 証明書を使用するため、SSL CA 証明書を提供する必要はありません。
「パスワードの生成」をクリックして、ランダムなパスワードを作成します。
ヒント
以前にパスワードを作成したことがある場合は、元のパスワードを使用するか、 「パスワードのリセット」をクリックして新しいパスワードを生成できます。
次のコマンドを実行して
.env.example
をコピーし、名前を.env
に変更します。# Linux cp .env.example .env# Windows Copy-Item ".env.example" -Destination ".env"対応する接続文字列をコピーして
.env
ファイルに貼り付けます。結果の例は次のとおりです。TIDB_HOST='{gateway-region}.aws.tidbcloud.com' TIDB_PORT='4000' TIDB_USER='{prefix}.root' TIDB_PASSWORD='{password}' TIDB_DB_NAME='test'{}
のプレースホルダーを、接続ダイアログで取得した値に置き換えます。.env
ファイルを保存します。
次のコマンドを実行して
.env.example
をコピーし、名前を.env
に変更します。# Linux cp .env.example .env# Windows Copy-Item ".env.example" -Destination ".env"対応する接続文字列をコピーして
.env
ファイルに貼り付けます。結果の例は次のとおりです。TIDB_HOST='{tidb_server_host}' TIDB_PORT='4000' TIDB_USER='root' TIDB_PASSWORD='{password}' TIDB_DB_NAME='test'{}
のプレースホルダーを、 「接続」ウィンドウで取得した値に置き換えます。 TiDB をローカルで実行している場合、デフォルトのホスト アドレスは127.0.0.1
で、パスワードは空です。.env
ファイルを保存します。
ステップ 4: コードを実行して結果を確認する
アプリケーションを起動します。
npm run devブラウザを開いて
http://localhost:3000
にアクセスします。 (実際のポート番号については端末を確認してください。デフォルトは3000
です。)「RUN SQL」をクリックしてサンプルコードを実行します。
端末の出力を確認します。出力が次のような場合、接続は成功しています。
{ "results": [ { "Hello World": "Hello World" } ] }
サンプルコードスニペット
次のサンプル コード スニペットを参照して、独自のアプリケーション開発を完了できます。
完全なサンプル コードとその実行方法については、 tidb-nextjs-vercel-クイックスタートリポジトリを確認してください。
TiDB に接続する
次のコードは、環境変数で定義されたオプションを使用して TiDB への接続を確立します。
// src/lib/tidb.js
import mysql from 'mysql2';
let pool = null;
export function connect() {
return mysql.createPool({
host: process.env.TIDB_HOST, // TiDB host, for example: {gateway-region}.aws.tidbcloud.com
port: process.env.TIDB_PORT || 4000, // TiDB port, default: 4000
user: process.env.TIDB_USER, // TiDB user, for example: {prefix}.root
password: process.env.TIDB_PASSWORD, // The password of TiDB user.
database: process.env.TIDB_DATABASE || 'test', // TiDB database name, default: test
ssl: {
minVersion: 'TLSv1.2',
rejectUnauthorized: true,
},
connectionLimit: 1, // Setting connectionLimit to "1" in a serverless function environment optimizes resource usage, reduces costs, ensures connection stability, and enables seamless scalability.
maxIdle: 1, // max idle connections, the default value is the same as `connectionLimit`
enableKeepAlive: true,
});
}
export function getPool() {
if (!pool) {
pool = createPool();
}
return pool;
}
データの挿入
次のクエリは、単一のPlayer
レコードを作成し、 ResultSetHeader
オブジェクトを返します。
const [rsh] = await pool.query('INSERT INTO players (coins, goods) VALUES (?, ?);', [100, 100]);
console.log(rsh.insertId);
詳細については、 データの挿入を参照してください。
クエリデータ
次のクエリは、ID 1
による単一のPlayer
レコードを返します。
const [rows] = await pool.query('SELECT id, coins, goods FROM players WHERE id = ?;', [1]);
console.log(rows[0]);
詳細については、 クエリデータを参照してください。
データを更新する
次のクエリは、ID 1
のPlayer
に50
コインと50
グッズを追加します。
const [rsh] = await pool.query(
'UPDATE players SET coins = coins + ?, goods = goods + ? WHERE id = ?;',
[50, 50, 1]
);
console.log(rsh.affectedRows);
詳細については、 データを更新するを参照してください。
データの削除
次のクエリは、ID 1
のPlayer
レコードを削除します。
const [rsh] = await pool.query('DELETE FROM players WHERE id = ?;', [1]);
console.log(rsh.affectedRows);
詳細については、 データの削除を参照してください。
便利なメモ
- 接続プールを使用してデータベース接続を管理すると、接続の頻繁な確立と破棄によって生じるパフォーマンスのオーバーヘッドを軽減できます。
- SQL インジェクションを回避するには、 準備されたステートメントを使用することをお勧めします。
- 複雑な SQL ステートメントがあまり含まれないシナリオでは、 続編 、 TypeORM 、またはプリズマのような ORM フレームワークを使用すると、開発効率が大幅に向上します。
次のステップ
- ORM と Next.js を使用して複雑なアプリケーションを構築する方法の詳細については、 私たちの書店デモを参照してください。
- node-mysql2 ドライバーの使用法についてはnode-mysql2 のドキュメントから学びましょう。
- TiDB アプリケーション開発単一テーブルの読み取りベスト プラクティスについて取引 、 開発者ガイドの章 ( データの挿入など) データを更新する参照データの削除 SQLパフォーマンスの最適化ください。
- プロフェッショナルとしてTiDB 開発者コースを学び、試験合格後にTiDB 認定獲得します。
助けが必要?
不和またはサポートチケットを作成するについて質問してください。