Visual Studio Code 上で SQL Database を操作するための便利な拡張機能

# この記事について

この記事では、Visual Studio Code 上で、以下のデータベースに接続して値を確認する方法について解説します。

- Azure SQL Database
- SQL Server

従来の開発では、`SQL Server Management Studio`や`Azure Data Studio`、`Azure ポータルの画面`など、コーディングを行う場所とは異なるアプリケーションを並行で起動する事例も多かったと思います。
`コーディング中にデータベースにアクセスしたくなり別のアプリを起動・切り替え`というようなことは正直面倒で無駄の時間につながります。
**Visual Studio Code のみで、コーディングだけでなく、データベースの値も確認できる**ことは、開発中に複数のアプリケーションを起動・行き来しなければならないというような、ちょっとした面倒を軽減させることが可能です。


# Visual Studio Code 拡張機能

今回利用する拡張機能は、こちらです。

- SQL Server (mssql)
    - https://github.com/Microsoft/vscode-mssql

![スクリーンショット 2020-10-06 12.58.15.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/348116/e7102fd7-c1d3-1a7a-a1f9-2ef38e840949.png)


# SQL Database に接続

SQL Server または SQL Database に接続する場合は、**SQL Server (mssql)** 拡張機能を使用します。
拡張機能をインストールすると、`SQL Server`タブが表示されるようになります。

![スクリーンショット 2020-10-06 16.16.37.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/348116/3f6be77d-ddb3-cadd-817a-6417304f3146.png)

## サーバー ファイアウォールの設定

SQL Database にはサーバー ファイアウォールの設定があります。
ここで、自身の端末の`クライアント IP`からの接続を許可しておく必要があります。
設定していない場合は、事前に設定しておきます。

![スクリーンショット 2020-10-06 16.20.26.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/348116/e0621710-e874-d0dd-e51d-186b87cbdb75.png)

![スクリーンショット 2020-10-06 16.21.40.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/348116/c02919a0-99e8-c184-fd2b-e9ce98d2afce.png)

## 接続プロファイルの作成

`Add Connection`を選択して、接続情報を作成します。今回は、SQL Database に接続します。

もし、以下のような表示が行われた場合は、現在開いているファイルの言語モードを SQL にする必要があるかどうかについて聞かれているので、Yes または No を選択してください。

![スクリーンショット 2020-10-06 16.04.08.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/348116/808100e4-ac72-883d-685d-1a16ee77b49a.png)

`サーバー名`または、`ADO.NET`の接続文字列を入力します。

![スクリーンショット 2020-10-06 16.07.34.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/348116/4880cba0-3139-4e67-39e2-70e72f00e99e.png)

SQL Database の場合、ADO.NET 接続文字列は Azure ポータルから簡単に取得できます。
ただし、**Password={your_password};** の部分は変更する必要があるため、設定したパスワードに書き換えてください。

![スクリーンショット 2020-10-06 16.11.44.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/348116/e82c2328-c701-d710-bc0d-73519cbe0e7a.png)

入力したら、Enter キーを押します。

![スクリーンショット 2020-10-06 16.14.02.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/348116/153cdb91-64ff-aa50-980b-06b76e4c7546.png)

`プロファイルとして保存する際の名前`の入力を求められます。任意の名前を設定してください。
入力したら、Enter キーを押します。

![スクリーンショット 2020-10-06 16.14.17.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/348116/00152416-fc46-d17d-ea11-1ca01d0bb090.png)

登録が正常に完了した場合、以下のように SQL Database に接続できるようになります。

![68747470733a2f2f71696974612d696d6167652d73746f72652e73332e61702d6e6f727468656173742d312e616d617a6f6e6177732e636f6d2f302f3334383131362f34616464393037382d643838322d663134342d636335312d3565333539353336353035612e706e67.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/348116/43300417-9ee6-50d9-42b4-654f90933560.png)


# クエリ実行

接続情報の部分を右クリックします。
`New Query`を選択します。

![スクリーンショット 2020-10-06 16.29.58.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/348116/7696bbdb-e3d5-569c-dcca-3d1a41c21ba9.png)

言語モードが **SQL** に設定されたタブが表示されます。
画面右下の部分に、SQL Database に接続できているかどうか表示されるため、確認しておきましょう。

![スクリーンショット 2020-10-06 16.32.11.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/348116/918dc764-8c68-2895-bea2-adba107105c2.png)

開いたタブの画面にて、クエリを作成します。
※画面は、CREATE TABLE 文の例です

クエリを作成したら、画面を`右クリック`または`[Ctrl] + [Shift] + [E] (macOS の場合は、[Command] + [Shift] + [E])`でクエリを実行します。

![スクリーンショット 2020-10-06 16.37.39.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/348116/8ddb2f36-5ce6-d678-ae4d-94e63c230a9d.png)

クエリの実行結果は、別タブで表示されるようになります。

![スクリーンショット 2020-10-06 16.38.12.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/348116/f9e5fa21-c390-481a-3f53-b1dfb69033d7.png)

SELECT や UPDATE などのクエリを実行できるため、プログラム側で実行するクエリの実行結果を、こちらの画面で簡単に確認できます。

# その他、便利機能

この拡張機能には、スペニットなど、便利なコマンドも用意されています。
詳細は、以下の記事を参照してください。

- [VSCodeでのSQL Server(MSSQL)の開発][1]


# データベースに接続できなくなった時の対処

## 接続中のはずなのに接続エラーになる場合

いったん、サーバーとの接続を切断し、再接続することをお勧めします。
サーバーを右クリックし、`Disconnect`を選択して接続を切断します。

![スクリーンショット 2020-10-06 18.25.10.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/348116/8e6e341f-59e1-048f-2cfe-954a8a4feca1.png)

切断後、`Connect`を選択して、再度データベースに接続してみてください。

![スクリーンショット 2020-10-06 18.26.54.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/348116/2971a10d-31ae-135c-3177-ab4da1a2d626.png)

## 接続プロファイルの情報が変更になった場合

SQL Server (mssql) 拡張機能で作成したプロファイル情報は、Visual Studio Code のユーザー設定情報(settings.json)の中に保存されています。
※settings.json の場所がわかっている方は、そのまま直接開いて編集を行ってください

`[Ctrl] + [,] (macOS の場合は、[Command] + [,])`で、ユーザー設定画面を開きます。

※Windows の場合は、メニューの \[ファイル\] -> \[ユーザー設定\] -> \[設定\] からでも遷移できます。
※macOS の場合は、メニューの \[Code\] -> \[基本設定\] -> \[設定\] からでも遷移できます。

\[ユーザー\] タブにて、`Mssql: Connection`を入力します。
該当するものが表示されるので、**setting.json で編集** リンクを選択します。

![スクリーンショット 2020-10-06 18.37.41.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/348116/a02b0ca4-8fbc-c96e-9009-26c61d733434.png)

`mssql.connections` 内にて、定義済みの接続プロファイル情報が表示されます。
必要に応じて書き換え・削除し、保存を行ってください。

![スクリーンショット 2020-10-06 18.40.15.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/348116/6972a910-d86e-2075-e507-8c0fc9854ca4.png)


# 参考情報

- [VSCodeでのSQL Server(MSSQL)の開発][1]

---
[1]:https://qiita.com/hmsnakr/items/0e9ccc94eeb3eb7f2e08