自九月底開始有想嘗試架設網站的念頭
歷經10天的跌跌撞撞
總算成功架設屬於自己的網站
本篇為記錄這一路阻難至架設成功的過程
一、開發環境與新專案
1.1檢查環境
使用Visual Studio 2019為新專案的平台
首先先確認ASP.NET與網頁程式開發有勾起來並安裝
(因為我已經安裝完,所以右下角的所需空間為0,印象中單勾起此選項,應該所需3GB左右)
1.2開新專案
我這次的目標不是.Net Core,所以仍然使用ASP.Net Web應用程式(.Net Framework)
此一步驟請先確認篩選器有僅限C#語言,因為.Net Framework另有VB版本
開錯就只能重開新專案
P.S. .Net Framework當前最新為4.8,不過4.5.2以後似乎沒有看到什麼差異,我的電腦預設4.6.1,我就沒動了
進入此畫面後請先不要急著建立,先到驗證裡面變更選項
預設為「無驗證」,我會切換到「個別使用者帳戶」,作用是讓專案可以自動生產使用者登入機制(如下圖)
使用「個別使用者帳戶」,在預設的首頁右上角可以看到有登入註冊的機制,而若是使用「無驗證」則沒有
確認變更驗證後,再建立MVC專案
建立後執行IIS Express就可以看到上一張圖的預設首頁了,一個新專案建立完成
二、MySQL
2.1安裝MySQL
下載MySQL的Workbench 8.0 CE ,以下是Oracle的官方下載地址
https://dev.mysql.com/downloads/
我選擇MySQL Installer for Windows,點選後再登入Oracle帳戶即可下載
如果沒有Oracle帳戶,可以直接從下方取得離線安裝版的檔案:
https://dev.mysql.com/get/Downloads/MySQLInstaller/mysql-installer-community-8.0.21.0.msi
一路下一步就可以了,遇到沒有安裝的就Execute讓安裝精靈幫你把補丁打一打
安裝好後啟動MySQL Workbench 8.0 CE
對著自己的本地資料庫按右鍵,選擇Copy Connection String to Clipboard
會得到"root@localhost:3306"的字串,用變數來解釋,就是"Uid@IP:Port"的意思
這個結構記著,後面的步驟需要以這個結構連結Web Hosting的MySQL
2.2VS專案建立MySQL通道
這一步驟參考 尼克人生的 使用MySQL的MVC專案 Code First
首先需引用NuGet
對專案名稱(非方案名稱)點右鍵,選擇「管理NuGet套件」
切換到瀏覽分頁,在搜尋打上"MySQL"
找到以下3個套件:
MySql.Data
MySql.Data.EntityFramework
MySql.Web
需要注意以下幾點:
1.作者必須是Oracle,下載作者是MySQL的套件我自己實測是沒有用
2.以MySql.Data的版號為主,以我為例,當前是v8.0.21
則MySql.Data.EntityFramework和MySql.Web的版號也必須是v8.0.21
3.MySql.Data.EntityFramework的套件很多很雜,說明一下
MySql.Data.EntityFramework是給MVC使用,要裝這個
MySql.Data.EntityFrameworkCore是給.Net Core使用,裝這個沒用
MySql.Data.Entity的版號不對,裝了沒用
MySql.Data.Entities作者版號都不對,裝了沒用
選擇套件之後,版號右邊會多出一個向下的小黑箭頭,點下去即可開始安裝
MySql.Data會要求多安裝如下圖這些,確定即可
安裝完後切換到「已安裝」分頁,搜尋"MySQL"後應該可以看到三個套件有相同作者與版號
2.3連接字串預備
連接字串可以參考其他網路上的操作取得
不過我自己只使用其中四項
Server=localhost
Database=test5
UID=root
PWD=123456
合起來的字串就是:
"Server=localhost;Database=test5;UID=root;PWD=123456"
開啟Web.config(不是Views/Web.config)
因為建立專案的驗證使用「個別使用者帳戶」
因此可以在<connectionStrings></connectionStrings>裡看到預設的SQL Server連接字串
若未進行任何修改,將會使用SQL Server進行連接,而產出的DefaultConnection則會出現在/App_Data之下
因為剛剛已經安裝好MySQL的套件了
可以看到<connectionStrings></connectionStrings>裡除了DefaultConnection以外
還有多出一行<remove name="LocalMySqlServer" /><add connectionString="" name="LocalMySqlServer" providerName="MySql.Data.MySqlClient" />
以上這些都可以用<!-- ... -->隱藏,我們只需要providerName="MySql.Data.MySqlClient"這個關鍵字串
先把最後的</connectionStrings>換行,避免後續的操作失誤
在<connectionStrings></connectionStrings>裡輸入
<add name="TestDatabase" connectionString="Server=localhost;Database=test5;UID=root;PWD=123456" providerName="MySql.Data.MySqlClient" />
其中name="TestDatabase"是MVC內部程式碼使用的DB代號,做為程式內部對應到Web.config用,與MySQL沒有直接關係
connectionString內,將方才組好的字串帶入,這樣就可以讓MVC專案與本地的MySQL連線
最後是providerName="MySql.Data.MySqlClient",要讓編譯器理解connectionString要指向MySQL的MySqlClient而不是SQL Server的System.Data.SqlClient
2.4建立自定義Model
以下在Scaffold處參考自 Will保哥的 如何將現有 ASP.NET MVC 4 網站部署到 Windows Azure 雲端平台
2.4.1建立Product.cs
對Models資料夾按右鍵,加入新增項目
命名為Product.cs
建立兩個屬性,其中一個命名為ID
2.4.2建立TestDatabase.cs
再到Models新增一個項目
從「資料」選擇「ADO.NET實體資料模型」,名稱寫為Web.Config裡輸入的TestDatabase
選擇「空的Code First模型」
按下全部皆是
開啟Models.TestDatabase.cs
因我們已經先在Web.config建立name=TestDatabase的連接字串
因此由VS自動建立的cs會改名成TestDatabase1
要將之改回TestDatabase
回到Web.config,可以看到自動建立了name=TestDatabase1
使用<!-- ... -->把這一行擋掉,或者直接刪除也可,保留自己建立的TestDatabase就好
(</connectionStrings>會出現在這一行的最後,記得不要誤刪這個標籤)
建立完成上述兩個檔案後先按F6編譯程式,讓編譯器建立Product的Model
2.4.3建立ProductsController.cs
從Controllers點右鍵,選擇加入新增Scaffold項目
選擇「具有檢視、使用Entity Framework的MVC 5 控制器」
模型類別選擇Product(MVCforMySQLTest5.Models),如果剛才沒有先建置專案,不會有這個Model可選擇
資料內容類別選擇剛剛建立的TestDatabase(MVCforMySQLTest5.Models)
然後按下加入
等Scaffold自動建立完成,會得到紅框的檔案
2.5修改IdentityDbContext<ApplicationUser>的繼承
目前會形成Product生成的資料結構存在於MySQL的test5這個Database裡
但個別使用者帳戶的資料結構存在於App_Data裡的隱藏檔案,該檔案是SQL Server
因此這樣在專案Debug沒問題,但正式部屬到MySQL會出問題
因此需要捨棄App_Data自動生成資料,
將帳戶驗證的相關資料結構都轉移到自己建立的TestDatabase所指向的test5資料庫
以下有多方參考
限制條件參考自stack overflow的 How to enable migration for EF 6.4 and MySQL C#? 裡jrivam 的回答
IdentityDbContext的搬移參考自 michiproep 的 MIGRATION OF ASP MEMBERSHIP TO MVC5 IDENTITY USING MYSQL
以及 俱会一处的 ASP.NET MVC5+MySql使用ASP.NET 身份验证
首先開啟TestDatabase.cs,在public class TestDatabase : DbContext上方增加限制式
[DbConfigurationType(typeof(MySql.Data.EntityFramework.MySqlEFConfiguration))]
其中可以看到有7個參考的Products就是Scaffold自動生成的內容
說明DbSet會建立在TestDatabase指引的MySQL test5資料庫裡
再來開啟IdentityModels,可以看到如下內容
上方為身分驗證的結構,下方為預設會生成在App_Data內的SQL Server資料內容類別
我們要做的就是讓身分驗證產生的Tables移到MySQL的test5裡
將IdentityDbContext<ApplicationUser>複製
然後到TestDatabase.cs裡將public class TestDatabase : DbContext的DbContext取代之
將:base("DefaultConnection", throwIfV1Schema: false)的", throwV1SchemaL false"複製
貼到TestDatabase.cs的base()內
複製靜態方法,貼到TestDatabase.cs內,再修改方法的回傳結構為TestDatabase
完成後暫時如下,仍有紅字
將滑鼠移到IdentityDbContext上,加入using Microsoft.AspNet.Identity.EntityFramework;
最後TestDatabase.cs形成如下圖
我們需要再回到IdentityModels註解掉不使用的ApplicationDbContext
接下來會發生錯誤,順著錯誤指示到App_Start/IdentityConfig.cs內
將ApplicationDbContext改成TestDatabase
再到App_Start/Startup.Auth.cs內將ApplicationDbContext改成TestDatabase
如此,便完成將所有Tables移轉到MySQL上的前置動作了
2.6Code First Migrations
參考自程式小試身手的 【ASP.NET MVC】註冊新增欄位-Visual Studio 2015
從工具-->NuGet套件管理員-->套件管理器主控台啟動主控台
啟動後主控台會出現在畫面中下方
先輸入Enabled-Migrations,如果專案內只有一個DbContext,則不會需要多的參數
不然主控台會回覆說不知道要選哪個 請輸入完整且明確的DbContext來源
完整的輸入為Enabled-Migrations -ContextTypeName MVCforMySQLTest5.Models.TestDatabase
指令成功的話會得到「Code First移轉已為專案MVCforMySQLTest5啟用」的訊息
同時會在專案之下產生Migrations資料夾,內部產生Configuration.cs
開啟Configuration.cs
在AutomaticMigrationsEnabled = false;下多寫一行
SetSqlGenerator("MySql.Data.MySqlClient", new MySql.Data.EntityFramework.MySqlMigrationSqlGenerator());
存檔後回到NuGet主控台,輸入Add-Migration test5-v1
Add-Migration是指令 test5-v1則是我自己給這次的Migration所定義的類似版號的東西
實際上要輸入什麼是隨便的
成功的話主控台會回覆如下的訊息
在Migrations資料夾下會多出一個這次要Migration的cs檔
cs檔內部有Up和Down兩個方法
Up的方法就是VS會偵測DB裡的結構與預計的結構差多少欄位,在這次的Add-Migration中補出來
Down的則是檢測那些欄位需要移除
請先將Up裡的三個256改成128,因為MySQL從這裡建立會是以utf8mb4的collection定義欄位長度
但實際上MySQL僅會建立utf8的collection欄位,因此會回覆長度超過767的錯誤
這邊還沒研究出如何從Code指定MySQL產生來為必須為utf8mb4
因此,不能解決問題,那就先解決有問題的人吧@@
把256降為128的長度可以暫時解決此問題
改完後記得存檔
最後回到NuGet主控台,輸入Update-Database
成功的話可以看到最後一行應是「正在執行Seed方法」
我們可以到MySQL Workbench 8.0 CE裡
登入localhost的資料庫,即可看到Schema下多出了test5的Database
裡面的Tables則多了上述Up方法建立的Table,以及Migration管理用的__migrationhistory
打開__migrationhistory,可以看到這次Add-Migration的紀錄
若將這筆資料保留,則未來有發生欄位增減,就會以這個版號的內容為足跡紀錄,
下一次的Add-Migration將不會在Up和Down寫入新增或刪除當前沒有變動的地方
只會自動產出有新增的欄位於Up內或有刪除的欄位於Down內
而若要整個打掉重來,就可以把__migrationhistory的足跡紀錄全刪
同時把VS專案內Migrations資料夾內由Add-Migrations產生的檔案全刪
如此便可重頭開始
(Configuration如果刪了,則下次需要重新寫Enable-Migrations產生此檔案)
三、Google Domains
這一段我不多寫,直接引用參考,寫的也比我自己能寫的好
Wayne Fu 的 Google Domains 台灣可以使用了﹍購買 + 轉移網域(Godaddy) + DNS 設定心得
直接說優點
Google大品牌,買網址,靠信仰
有免費的WHOIS保護
目前12美元/年,貌似被加價的機會不高
但我並沒有要移轉任何現有的網域,所以這一步驟只要到付完款即可
文章後續的DNS設定都暫時不用管
而Google Domains在購買完後呈現如下
未來只要在DNS連結上Web hosting即可
四、myASP.Net
如果有錢的話,其實還是建議直接回到Azure用SQL Server就好
部屬什麼的都不用這麼麻煩
但誰叫我沒錢
只能在外面找看看有沒有比較便宜的
目前知道GoDaddy有Windows版的虛擬主機
不過沒有免費期間
第一個月就馬上要1美元
我想說先找免費的完成整個建置過程
確認我能夠徒手完成,再去思考是否要付費
因此找到myASP.NET
網上大多是LAMP架構(Linux + Apache + MySql + PHP)
要能支援ASP.NET的Web Hosting是比較少的
myASP.NET有兩個月的免費期
應該夠我學習了
如下圖,點選Free Trial後就可以開始註冊
在註冊時一開始只會有30天的試用,你可以按旁邊的facebook Like
發一篇只有私人的po文即可
這樣就可以變成60天試用了
myASP.NET註冊完後也會記兩封信給你
第一封是驗證電子信箱
第二封則是註冊成功後會收到關於FTP設定、Deploy設定、DNS設定等等資訊
下圖是第二封信裡關於DNS的設定
回到Google Domains,在左側點選DNS
原始是選擇「使用Google Domains名稱伺服器」
改為「使用自訂名稱伺服器」,並把信件中收到的三個DNS都打進去
Google Domains會問你是否要重啟之類的問題,不用管,因為才剛申請
大約等待1~2小時候,等Internet都括賽出去這次的DNS設定後
在Google Domains買的網址就可以正式連上myASP.NET的Web Hosting了
回到myASP.NET
剛登入時的畫面是這樣
點選ACTIONS的9個正方形那個按鈕可以進入Control Panel
點選WEBSITES分頁,可以加入Domain Name
把從Google Domains買來的網址打上去
接下來就是等待兩邊正式打通即可
五、發布
5.1Web Hosting的MySQL
仍然在myASP.NET,切換到DATABASE分頁,選擇MySql
點選+Add Database
把你想要的名稱和密碼打上,資料庫大小設定好
就完成建立Web Hosting的MySql了
得到如下圖所示之結果
可以點選<...>按鈕顯示連結字串
複製ASP.NET的連結字串
開啟VS的Web.config
將原本設定於本機localhost的字串改成web hosting的字串
這樣VS發布時就會連上web hosting的MySql
還記得2.1步驟,我們知道了MySQL Workbench吃的新增資料庫連結設定是"Uid@IP:Port"
因此先開一個空白的txt,打上「紅色@藍色:3306」(紅色與藍色對應上一張圖的Login ID和MySQL Domain Name)
複製你打好的這段字串,打開MySQL Workbench後於空白處按右鍵,選擇「Add Connection(s) from Clipboard」
就會跳出要你輸入帳密的登入畫面
帳號是上圖的紅色,密碼則是...密碼就是密碼~
完成後將如下圖所示
點選後即可從Workbench 遠端連線到myASP.NET的MySQL了
回到VS專案,在NuGet主控台輸入一次Update-Database
將DataTable建立好
再進入Workbench檢查Web hosting的MySql是否已經完成建立相關DataTables
5.2發布設定與錯誤排除
回到myASP.NET的WEBSITES
點選Show WebDeploy Info
再點選Get Publish Setting,會下載發行設定檔
開啟VS專案,對專案名稱點右鍵,選擇「發佈」
選擇匯入設定檔
將剛才下載的發行設定檔匯入,按下完成
再點選「編輯」
密碼是website的密碼,不是MySql的密碼
打完後先驗證可否連線,可以的話就勾儲存密碼
然後按「下一個」到下一步驟
將檔案發布選項打開,三個全勾
這樣就可以儲存所有設定了
最後按下發佈,就等待資料部屬完成,會自動開啟網頁
發布後會得到如下的錯誤
回到Web.config
在</system.web>前一行加上<customErrors mode="Off" />
再重新執行發布
得到如下的錯誤
從專案名稱右鍵開啟NuGet套件
在「已安裝」分頁搜尋"Microsoft.CodeDom.Provider"
將唯一出現的套件移除
再次發布
得到跳出的首頁
嘗試註冊
成功!!
再把路由移到/Products/Index
可以取得空的Products首頁
嘗試Create資料成功!!
至此,部屬至Web Hosting已經結束
過程磨難與困頓
例如有找過幾篇文章是使用FTP發布
我實作後可以發布,但無法正確連線到Web Hosting的MySQL
至今仍不解原因
好在最後可以用PublishSetting發布還成功
又或者utf8mb4的問題也還未解決,僅能先用256改128的方式先強行建立DataTable
以及其他有的沒的小問題不計其數
總之成功發布,一切的過程皆有所得,亦有所獲
算是可喜可賀~
若有其他先進能跟著到這且成功,不妨給自己一掌聲鼓勵~~
六、參考整理
文中都已經有寫入參考來源
我於最後再將這些參考統一顯示
尼克人生 使用MySQL的MVC專案 Code First:
https://dotblogs.com.tw/OldNick/2017/03/20/223102
取得MySQL連結字串:
https://www.itread01.com/content/1548055447.html
Will保哥 如何將現有 ASP.NET MVC 4 網站部署到 Windows Azure 雲端平台:
www.youtube.com/watch?v=oeJ3iSL_kjw&list=WL&index=3&t=156s&ab_channel=Will%E4%BF%9D%E5%93%A5
MySQL在資料內容類別的限制條件 jrivam 的回答:
https://stackoverflow.com/questions/60789697/how-to-enable-migration-for-ef-6-4-and-mysql-c
michiproep MIGRATION OF ASP MEMBERSHIP TO MVC5 IDENTITY USING MYSQL:
https://codeimp.wordpress.com/2014/11/28/migration-of-asp-membership-to-mvc5-identity-using-mysql/
俱会一处 ASP.NET MVC5+MySql使用ASP.NET 身份验证 :
https://blog.csdn.net/jhycjhyc/article/details/52747970
Wayne Fu Google Domains 台灣可以使用了﹍購買 + 轉移網域(Godaddy) + DNS 設定心得:
https://www.wfublog.com/2019/04/google-domains-tw-purchase-transfer-godaddy-dns.html
[SOLVED] access denied can not execute the program csc.exe after publishing .net application web deploy mvc app:
後記
因為不太清楚myASP.NET的來頭是什麼
所以不打算在這裡建立太過高級或私密的網站
可能在我都熟悉發布與建置後續的相關事宜後
會考慮使用GoDaddy的Windows虛擬主機來建置
到時候就是在GoDaddy付款,然後在Google Domains重新設定DNS即可