Next.js で mysql2 を使用して TiDB に接続する
TiDB は MySQL 互換のデータベースであり、 マイSQL2 Node.js 用の人気のあるオープンソース ドライバーです。
このチュートリアルでは、Next.js で TiDB と mysql2 を使用して次のタスクを実行する方法を学習します。
- 環境を設定します。
- mysql2 を使用して TiDB クラスターに接続します。
- アプリケーションをビルドして実行します。オプションで、基本的な CRUD 操作用のサンプルコードスニペット見つけることができます。
注記
このチュートリアルは、 TiDB Cloud Serverless および TiDB Self-Managed で機能します。
前提条件
このチュートリアルを完了するには、次のものが必要です。
- Node.js 18以降。
- ギット 。
- TiDB クラスター。
TiDB クラスターがない場合は、次のように作成できます。
- (推奨) TiDB Cloud Serverless クラスターの作成に従って、独自の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 クラスターに接続します。
- TiDB Cloud Serverless
- TiDB Self-Managed
クラスターページに移動し、ターゲット クラスターの名前をクリックして概要ページに移動します。
右上隅の「接続」をクリックします。接続ダイアログが表示されます。
接続ダイアログの構成が動作環境と一致していることを確認します。
接続タイプは
Public
に設定されていますブランチは
main
に設定されています接続先は
General
に設定されていますオペレーティング システムは環境に適合します。
注記
Node.js アプリケーションでは、TLS (SSL) 接続を確立するときに Node.js がデフォルトで組み込みの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
です。)サンプル コードを実行するには、 [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 ステートメントがあまり含まれないシナリオでは、 続編 、 タイプORM 、 プリズマなどの ORM フレームワークを使用すると、開発効率が大幅に向上します。
次のステップ
- ORM と Next.js を使用して複雑なアプリケーションを構築する方法の詳細については、 書店デモ参照してください。
- node-mysql2 のドキュメントから node-mysql2 ドライバーの使用方法について詳しく学びます。
- 開発者ガイドのデータを挿入 、 データの更新 、 データを削除する 、 単一テーブル読み取り 、 取引 、 SQLパフォーマンスの最適化などの章で、 TiDB アプリケーション開発のベスト プラクティスを学習します。
- プロフェッショナルTiDB 開発者コースを通じて学び、試験に合格するとTiDB 認定獲得します。
ヘルプが必要ですか?
不和またはスラック 、またはサポートチケットを送信するについてコミュニティに質問してください。