大綱 資料庫系統 Database System 1. 資料庫及 SQL 導論 2. 網頁資料庫 3. 雲端建站 結合資料庫及雲端的網頁設計 1 資料庫簡介 甚麼是資料庫? 資料庫 (Database) 為相關資料的集合 關聯式資料庫 (Relational Database) 為以關聯表格 (Re

Transcription

1 大綱 資料庫系統 Database System 1. 資料庫及 SQL 導論 2. 網頁資料庫 3. 雲端建站 結合資料庫及雲端的網頁設計 1 資料庫簡介 甚麼是資料庫? 資料庫 (Database) 為相關資料的集合 關聯式資料庫 (Relational Database) 為以關聯表格 (Relation) 集合的資料庫 資料庫管理系統 (Database Management System,DBMS) 為管理資料庫的軟體 為何使用資料庫? 利於資料的分享及管理 利於資訊的查詢 (Query) 及擷取 (Retrieval) 避免資料的重複性 (Redundancy) 避免資料的不一致性 (Inconsistency) SQL 簡介 SQL (Structured Query Language, 結構查詢語言 ) 是用於操作資料庫的語言 SQL 的語言分三類 : 資料定義語言 (Data Definition Language): 定義資料庫的語言 資料操作語言 (Data Manipulation Language): 新增 刪除 更新 查詢資料庫的語言 資料控制語言 (Data Control Language): 管控資料庫的語言 2 3 1

2 資料定義語言指令 create table: 建構表格 語法 : create table 表格名 ( 欄位 1 欄位 1 資料型態, 欄位 2 欄位 2 資料型態,...); SQL 簡介 範例 : 建置一個 student 表格包含學生的學號 姓名 主修 年級 生日 create table student( studentid char(9) primary key, firstname varchar(50), lastname varchar(50), major varchar(50), birthdate date); 4 SQL 簡介 資料定義語言指令 drop table: 刪除表格 語法 : drop table 表格名 ; 範例 : drop table student; 資料操作語言指令 insert into: 將值加入表格內 語法 : 範例 : 加入幾筆學生的資料進入 student 表格 insert into 表格名 ( 欄位名, ) values( 欄位值, ); insert into student values('u ', 'Swift', 'Taylor', 'Art', ' '); insert into student values('u ', 'Allen', 'Lily', 'Music ', ' '); insert into student values('u ', 'Ariana', 'Grande', 'Art ', ' '); 5 資料操作語言指令 select: 查詢資料庫 語法 : 範例 : 列出所有學生的資訊 : SQL 簡介 select 欄位名 from 表格名 where 條件 order by 欄位名稱 ; select * from 表格名 ; 由 student 表格選擇主修電腦科學學生的學號 姓名並依生日排序 select studentid, lastname, firstname, birthdate from student where major = 'Computer Science' order by birthdate; delete: 刪除資料 語法 : delete from 表格名 where 條件 ; 範例 : 刪除 stduent 表格內所有主修為 Art 的學生 delete from student where major = 'Art'; 6 SQL 簡介 資料操作語言指令 update: 更新資料庫 語法 : 範例 : 更新 student 表格將 Taylor Swift 主修改為 Music update 表格名 set 格欄位 1 = 值 1, where 條件 ; update student set major = 'Music' Where lastname = 'Swift' and firstname = 'Taylor'; 資料控制語言指令 grant/revoke: 授予 / 取消物件權限 語法 : 範例 : 將 stduent 表所有權限授權給 Swift grant/revoke 權限 on 物件 to/from 群體 使用者 ; grant all privileges on student to Swift; 7 2

3 SQL Server Express 是由 Microsoft 所開發的入門級資料庫管理系統, 為 SQL Server 其中一個版本, 此版本可自由下載 散佈 ( 須經註冊 ) 及使用 SQL Server Express 的優點 : 建置可處理多種資料類型的 Web 和行動應用程式 將輕量型資料庫內嵌於應用程式 在版本之間擴充擴展 下載安裝 SQL Server Express 及 Management Studio (SSMS) 啟動 Microsoft SQL Server Management Studio (SSMS) 連線至伺服器, 伺服器名稱 :localhost\sqlexpress 資料庫 > 新增資料庫 > 資料庫名稱 :University > 確定 新增查詢 > 打入 SQL 指令 > 選取要執行的指令 > 執行 若要開放遠端連線, 啟動 SQL Server Configuration Management ( 組態管理員 ) SQL 網路組態 > SQLEXPRESS 的通訊協定 > TCP/IP 啟動 10 use University; create table student ( studentid char(9) primary key, firstname varchar(50), lastname varchar(50), major varchar(50), birthdate date); insert into student values('u ', 'Swift', 'Taylor', 'Art', ' '); insert into student values('u ', 'Allen', 'Lily', 'Music ', ' '); insert into student values('u ', 'Ariana', 'Grande', 'Art ', ' '); select * from student; select studentid, lastname, firstname, major, cast(birthdate as date) from student; 11 3

4 新增使用者 啟動並登入 SSMS 新增資料庫 : 資料庫 > 新增資料庫 > 資料庫名稱 :University > 確定 新增使用者 1. 新增登入 : 安全性 > 新增登入 2. 設定帳號密碼 : 登入名稱 > 登入名稱 :chuweb > SQL 驗證 > 輸入密碼 > 預設資料庫 :University 3. 設定伺服器角色 : 伺服器角色 > 點選 sysadmin ( 設定伺服器角色的成員可以執行伺服器中的所有活動 ) > 確定 4. 設定使用者對應 : 已對應對此登入的使用者 : 勾選 University > 資料庫腳色成員資格對象 : 勾選 db_owner > 確定 設定 SQL Server 驗證模式 設定 SQL Server 驗證模式 :SSMS > 滑鼠右鍵點選 \SQLEXPRESS > 屬性 > 安全性 > 伺服器驗證 > SQL Server 及 Windows 驗證模式 > 確定 中斷與連接物件總管 : 檔案 > 中斷與連接物件總管 重新啟動 SQL Server: 控制台 > 系統管理工具 > 服務 > SQL Server (SQLEXPRESS) > 滑鼠右鍵重啟動 連接資料庫系統 : 檔案 > 連接物件總管 > SQL Sever 驗證 > 輸入登入及密碼 > 連線

5 網頁資料庫 二層式主從架構 (Two Tier Client/Server Architecture) 展示層 (Presentation Tier): 使用者介面, 負責商業邏輯 (Business Logic) 和資料處理邏輯 (Data Processing Logic) 資料層 (Data Access Tier): 負責資料的儲存, 資料庫管理系統 二層式架構缺點 : 每一用戶端應用都要與伺服器連線, 會佔用較多的連接 (Connection), 也會佔用伺服器相當多的資源 營運規則是企業性的, 經常會隨著企業的運作而改變 在兩層式架構下, 當我們修改營運規則之後, 就必須修改應用程式, 因此會造成新版本軟體派發的困擾 網頁資料庫 三層架構 (Three-Tier) 展示層 (Presentation Tier): 客戶端 使用者介面 ( 網頁瀏覽器 ) 商業邏輯層 (Business Logic Tier): 應用程式伺服器端 (Application Server) - 網頁伺服器 資料層 (Data Access Tier): 伺服端 資料庫管理系統 SQL Server 2017 Express 的設計可讓使用者在兩層 (Twotier) 或多層 (Multi-tier) 主從式架構的資料庫系統下有效率的運作 典型的兩層式架構就是 SSMS 與 SQL Server 互動 典型的三層式架構就是網際網路上網頁與資料庫互動的應用 網頁資料庫 開發實務 啟動 Visual Studio > 新增 > 網站 > ASP.NET 空網站

6 網頁資料庫 開發實務 加入新項目 > Web 表單 > 設計, 建構如下的頁面 網頁資料庫 開發實務 設定資料庫連接字串 在工具箱裡, 點選資料 > SqlDataSource 在介面裡, 點選設定資料來源 > 新增連接 > Microsoft SQL Server > 繼續 > 伺服器名稱 :localhost\sqlexpress > 選取或輸入資料庫 > University > 確定 複製連接字串 :Data Source=localhost\SQLEXPRESS;Initial Catalog=University;Integrated Security=True > 取消 或繼續下一步 > 將連接字串儲存到應用程式組態檔 > 下一步, 由系統導引設定 Select 陳述式 在介面裡, 雙點 Insert 按鈕 > 進入 DataAccess.aspx.cs 網頁資料庫 開發實務 using System; using System.Data.SqlClient; public partial class DataAccess : System.Web.UI.Page { string connetionstring = ""; SqlConnection connection = null; protected void Page_Load(object sender, EventArgs e) { connetionstring = "Data Source=localhost\\SQLEXPRESS;Initial Catalog=University;Integrated Security=True"; // 資料庫連接字串 connection = new SqlConnection(connetionString); // 建立連結 protected void Button1_Click(object sender, EventArgs e) { // Insert string studentid = TextBox1.Text, lastname = TextBox2.Text, // 取得欄位輸入值 firstname = TextBox3.Text, major = TextBox4.Text, birthdate = TextBox5.Text;

7 string sql = "insert into student values ('" + studentid + "', '" + lastname + "', '" + // SQL 字串 firstname + "', '" + major + "', '" + birthdate + "')"; Label1.Text = ""; // 結果標籤設為 "" try { connection.open(); // 開啟連接 SqlCommand command = new SqlCommand(sql, connection); // 建立 SQL 命令 command.executenonquery(); // 執行非查詢命令 command.dispose(); // 拋掉指令 connection.close(); // 關閉資料庫連接 Label1.Text = "Insert data successfully!"; // 顯示成功地加入資料 catch (Exception ex) { Label1.Text = ex.tostring(); 24 protected void Button2_Click(object sender, EventArgs e) { // Update string studentid = TextBox1.Text, major = TextBox4.Text; // 取得欄位輸入值 string sql = "update student set major = '" + major + "' where studentid = '" + studentid + "'"; // SQL 字串 : 修改學生主修 Label1.Text = ""; // 結果標籤設為 "" try { connection.open(); // 開啟連接 SqlCommand command = new SqlCommand(sql, connection); // 建立 SQL 命令 command.executenonquery(); // 執行非查詢命令 command.dispose(); // 拋掉指令 connection.close(); // 關閉資料庫連接 Label1.Text = "Update data successfully!"; // 顯示成功地更新資料 catch (Exception ex) { Label1.Text = ex.tostring(); 25 protected void Button3_Click(object sender, EventArgs e) { // Delete string studentid = TextBox1.Text; // 取得學生 ID 欄位輸入值 string sql = "delete from student where studentid = '" + studentid + "'"; // SQL 字串 : 刪除學生資料 Label1.Text = ""; try { connection.open(); // 開啟連接 SqlCommand command = new SqlCommand(sql, connection); // 建立 SQL 命令 command.executenonquery(); // 執行非查詢命令 command.dispose(); // 拋掉指令 connection.close(); // 關閉資料庫連接 Label1.Text = "Delete data successfully!"; // 顯示成功地刪除資料 catch (Exception ex) { Label1.Text = ex.tostring(); 26 protected void Button4_Click(object sender, EventArgs e) { string sql = "select studentid, lastname, firstname, major, " + // SQL 字串 : 選取所有的學生 "format(birthdate, 'yyyy-mm-dd') from student"; Label1.Text = ""; try { connection.open(); // 開啟連接 SqlCommand command = new SqlCommand(sql, connection); // 建立 SQL 命令 SqlDataReader datareader = command.executereader(); // 執行讀取命令返回資料讀取器 while (datareader.read()) { // 當還有資料, 顯示查詢結果 Label1.Text += datareader.getvalue(0) + " " + datareader.getvalue(1) + " " + datareader.getvalue(2) + " " + datareader.getvalue(3) + " " + datareader.getvalue(4) + "<br/>"; datareader.close(); // 關閉資料讀取器 command.dispose(); // 拋掉指令 connection.close(); // 關閉資料庫連接 catch (Exception ex) { Label1.Text = ex.tostring(); 27 7

8 protected void Button5_Click(object sender, EventArgs e) { // Query string major = TextBox4.Text; // 取得主修欄位輸入值 string sql = "select studentid, lastname, firstname, major, " + // SQL 字串 : 選取主修為 major 的學生 "format(birthdate, 'yyyy-mm-dd') from student where " + " major = '" + major + "'"; Label1.Text = ""; try { connection.open(); // 開啟連接 SqlCommand command = new SqlCommand(sql, connection); // 建立 SQL 命令 SqlDataReader datareader = command.executereader(); // 執行讀取命令返回資料讀取器 while (datareader.read()) { // 當還有資料, 顯示查詢結果 Label1.Text += datareader.getvalue(0) + " " + datareader.getvalue(1) + " " + datareader.getvalue(2) + " " + datareader.getvalue(3) + " " + datareader.getvalue(4) + "<br/>"; datareader.close(); // 關閉資料讀取器 command.dispose(); // 拋掉指令 connection.close(); // 關閉資料庫連接 catch (Exception ex) { Label1.Text = ex.tostring(); : 發佈網站至 IIS 啟動 Visual Studio > 網站 > ASP.NET 空網站 Web 位置 : 選取 HTTP > 輸入 : 發佈網站至 IIS 加入新項目 > Web 表單 > 名稱 :DatabaseAccess.aspx

9 : 發佈網站至 IIS 建構如下的頁面 > 新增 SqlDataSource > 設定資料來源 : 發佈網站至 IIS 進入 DatabaseAccess.aspx.cs > 在 Page_Load 函式裡, 設定資料連接字串為 : Data Source = localhost\\sqlexpress; Initial Catalog = University; User ID = chuweb; Password = chuweb public partial class DatabaseAccess : System.Web.UI.Page { string connetionstring = ""; SqlConnection connection = null; protected void Page_Load(object sender, EventArgs e) { connetionstring = "Data Source=localhost\\SQLEXPRESS;Initial Catalog=University;User ID=chuweb;Password=chuweb123"; // 資料庫連接字串 connection = new SqlConnection(connetionString); // 建立連結 33 : 發佈網站至 IIS Ctrl-F5 編譯及執行 雲端建站 當網站建立好後要發佈出去, 有如下的考量 : 一般企業端由於有自己的伺服器, 會將網站放在企業的伺服器 對小公司或個人, 考量到伺服器的維護, 就可採用雲端發佈的方式 雲端平台已成為近年流行的運算平台, 雲端計算是一種透過網際網路提供處理資源和數據的計算 雲端運算部署模式有四類 : 公有 (Public) 私有的 (Private) 社群雲 (Community) 混合的 (Hybrid)

10 雲端建站 使用雲端計算有如下的優點 : 存取性 (Accessibility) 可用性 (Availability) 合作性 (Collaboration) 成本效益 (Cost Effectiveness) 靈活性 (Flexibility) 可管理性 (Manageability) 可擴展性 (Scalability) 安全 (Security) 雲端建站 常見商業雲端平台 Amazon Web Services (AWS): Azure: Alibaba Cloud: Google Cloud Platform (GCP): Rackspace: 商業雲端平台有多方面的功能, 但通常須付月費, 對個人來說, 如成本考量, 可用免費的雲端網站空間來存放網頁 免費雲端網站空間一般來說是種行銷策略, 希望能免付費者, 最終使用付費的服務 雲端建站 免費雲端網站空間常見的限制如下 : 網站空間小, 超過付費 網站可安裝的應用程式有限 限制頻寬及流量, 或超過流量須付費 網域名稱受限, 只能使用主機商的子網域 限制檔案上下傳的大小 限制 / 資料庫 /FTP 的帳號及功能 缺乏客服支援 有廣告 ( 不過現在大部份都沒有 ) 缺乏網站備份 一般支援 PHP, 須用付費版本才支援 ASP.NET 38 常用的免費雲端網站空間 雲端建站 000Webhost 2FreeHosting Byethost Free Web Hosting No Ads 頻寬 / 月 100GB 150GB 50GB 200GB 無限 硬碟空間 1.5GB 20GB 1GB 20GB 5GB 廣告無無無無無 ASP.NET 須用付費版須用付費版須用付費版須用付費版支援 Free ASP.NET Hosting 資料庫 MySQL 2 個 MySQL 5 個 MySQL 5 個 MySQL 3 個 SQL Server 控制面板 Cpanel Cpanel Cpanel Cpanel 自訂 網站 1 個 1 個 1 個 1 個 1 電郵帳號 5 個有 5 個 3 個無 網域名稱有有有有有 FTP 有 5 個有有無 39 10

11 雲端建站 一般雲端網站空間申請流程如下 : 至雲端網站業者網站填寫申請表, 主要是選取網域名稱, 設定 登入的帳號 密碼 到 信箱中收信, 回覆確認信 等待開通, 開通後有可能會寄送另一組管理程式的帳號密碼 使用帳號密碼進入雲端網站空間管理頁面 40 雲端建站 範例 :000webhost 1. 連結到 000webhost 官網 : 點選 Free Sign Up 進行註冊 2. 填寫註冊資訊 : 填入帳號 / , 設定一組密碼, 輸入網域名稱, 填好之後按下方的 GET FREE HOSTING 3. 送出註冊申請 : 輸入所需要的驗證, 完成註冊申請 4. 驗證 : 登入 信箱點選 Verify 完成認證 5. 建構網站 : 進入 000webhost 的管理介面中, 點選上方工具列的 Build website 功能, 開始建立網站 41 雲端建站 範例 :000webhost 6. 選擇建站模式 : 有三種模式可以選擇 : Build a Website Easily Build Wordpress Website Upload Own Website, 以 Build a Website Easily 示範 7. 選取網頁板模 8. 修改網頁上的文字與圖片 9. 發佈 : 點選左上方的 Publish 10. 查看網站 : 雲端架站 範例

12 雲端建站 範例 :Free ASP.NET Hosting 1. 連結到 Free ASP.NET Hosting 官網 : 點選 Sign Up Free 進行註冊 2. 填寫註冊資訊 : 填入 帳號 設定密碼, 按下方的 Sign Up 3. 新增網頁 : 點選 My Files > Upload Files > Browse > 選取檔案 > 開啟 4. 連結網站 : 雲端建站 範例 :Free ASP.NET Hosting