はじめての asp.net mvc
TRANSCRIPT
![Page 1: はじめての ASP.NET MVC](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55acd3581a28ab4a078b470a/html5/thumbnails/1.jpg)
はじめての ASP.NET MVC
2015/4/11ASP.NET 初心者勉強会@jz5(プロ生)
![Page 2: はじめての ASP.NET MVC](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55acd3581a28ab4a078b470a/html5/thumbnails/2.jpg)
自己紹介• @jz5• プロ生ちゃんP• ASP.NET 初心者• 運営
– プログラミング生放送– IT 勉強会スタンプラリー
![Page 3: はじめての ASP.NET MVC](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55acd3581a28ab4a078b470a/html5/thumbnails/3.jpg)
今回の内容• 扱うこと
– ASP.NET MVC で Web サイトを作る– ○○すれば□□ができるみたいな
• 扱わないこと– MVC とはみたいな– ○○すればどういう仕組みで□□が実現できているみたいな
![Page 4: はじめての ASP.NET MVC](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55acd3581a28ab4a078b470a/html5/thumbnails/4.jpg)
対象• 環境
– Visual Studio 2013/2015 CTP 5• 対象者
– ASP.NET MVC でサイトを作ったことないひと– プログラミングある程度できるひと
![Page 5: はじめての ASP.NET MVC](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55acd3581a28ab4a078b470a/html5/thumbnails/5.jpg)
注意• 実際にサイトを作って理解したことを書いています。細
かな定義や意味合いは異なるかも。• 次期 ASP.NET MVC はどうなるか知りません
![Page 6: はじめての ASP.NET MVC](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55acd3581a28ab4a078b470a/html5/thumbnails/6.jpg)
ASP.NET MVC で作ったサイト紹介• IT 勉強会スタンプ• パスワードを平文で送ってくるっぽいサイトまとめ• リツイート直後のツイートを表示するやつ• timg: Twitter 画像検索・画像一覧• その他 画像ジェネレーター系や
プレゼント応募フォームなど
![Page 7: はじめての ASP.NET MVC](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55acd3581a28ab4a078b470a/html5/thumbnails/7.jpg)
IT勉強会スタンプ• Git リポジトリ
– https://github.com/jz5/it-stamp• 関連技術
– SQL Server– Azure Web アプリ
• ASP.NET 機能– ユーザー認証– Facebook/Twitter/Google サインイン– Role 機能– メール機能– (ツイート機能)※ ASP.NET の仕組みとは直接関係なし
![Page 8: はじめての ASP.NET MVC](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55acd3581a28ab4a078b470a/html5/thumbnails/8.jpg)
プロジェクトの作成
![Page 9: はじめての ASP.NET MVC](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55acd3581a28ab4a078b470a/html5/thumbnails/9.jpg)
プロジェクト新規作成1. Visual Basic/C# → Web
→ ASP.NET Webアプリケーションプロジェクト2. 「MVC」選択3. 「認証の変更」
– 「認証なし」– 「個人ユーザー アカウント」: SQL Server を使ったユーザー情
報を保存する仕組みが使える。Twitter/Facebook/Google などのサインイン機能も使える。
※ SNS サインイン機能だけ使って情報を保存しない場合は「認証なし」から始めた方が良いかも
![Page 10: はじめての ASP.NET MVC](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55acd3581a28ab4a078b470a/html5/thumbnails/10.jpg)
プロジェクトを作成したら• NuGet パッケージの管理からプログラムを更新しておく
ちなみにプロジェクトサイズは80MBぐらい
![Page 11: はじめての ASP.NET MVC](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55acd3581a28ab4a078b470a/html5/thumbnails/11.jpg)
プロジェクトの構成
• ルーティング• コントローラー• ビュー
![Page 12: はじめての ASP.NET MVC](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55acd3581a28ab4a078b470a/html5/thumbnails/12.jpg)
ルーティング• App_Start/RouteConfig.cs で URL の構成を決めるroutes.MapRoute(
name: "Default",url: "{controller}/{action}/{id}",defaults: new { controller = "Home", action = "Index",
id = UrlParameter.Optional });
デフォルト
http://localhost/Account/Login?returnUrl=/Home{コントローラー名} {アクション名} {オプションのパラメーター}
→ アクセスすると AccountController クラスのLogin メソッドを実行
![Page 13: はじめての ASP.NET MVC](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55acd3581a28ab4a078b470a/html5/thumbnails/13.jpg)
ルーティング• http://localhost/Event/1 のようにアクセスしたいroutes.MapRoute(
name:"Events",url:"Events/{id}",defaults:new {controller = "Events", action = "Details"},constraints: new {id = "¥¥d+"}
);
Events/{id} のアクセスはコントローラーとアクションを固定
追記
![Page 14: はじめての ASP.NET MVC](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55acd3581a28ab4a078b470a/html5/thumbnails/14.jpg)
コントローラー• HTTP リクエストを処理して表示するビューを決める• Controllers フォルダーにある
– AccountController.cs– HomeController.cs– ManageController.cs※ 「個人ユーザー アカウント」で作成した場合
![Page 15: はじめての ASP.NET MVC](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55acd3581a28ab4a078b470a/html5/thumbnails/15.jpg)
コントローラー• AccountController.cs[AllowAnonymous]public ActionResult Login(string returnUrl){
ViewBag.ReturnUrl = returnUrl;return View();
}
Account/Login に GET アクセスしたときに実行されるAccount/Login?returnUrl=/Home のようなアクセスは引数 returnUrl に /Home が入っている
![Page 16: はじめての ASP.NET MVC](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55acd3581a28ab4a078b470a/html5/thumbnails/16.jpg)
コントローラー• AccountController.cs[HttpPost][AllowAnonymous][ValidateAntiForgeryToken]public async Task<ActionResult> Login(LoginViewModel model, string returnUrl){
...}
Account/Login に POST アクセスしたときはこっちが実行される[HttpPost] 属性で POST アクセスを指定
![Page 17: はじめての ASP.NET MVC](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55acd3581a28ab4a078b470a/html5/thumbnails/17.jpg)
コントローラー• ビューを返すpublic ActionResult Login(string returnUrl){
ViewBag.ReturnUrl = returnUrl;return View();
}
return View("Error");
return RedirectToAction("Index", "Home");
→ Account/Login ビューを表示
→ Account/Error ビューを表示
→ Home/Index にリダイレクト
![Page 18: はじめての ASP.NET MVC](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55acd3581a28ab4a078b470a/html5/thumbnails/18.jpg)
ビュー• 表示する ページ(HTML + α)• コントローラーからデータを受け取る
(コントローラでビューにデータを指定していた場合)• Views フォルダーにある
– Account/Login.cshtml など• コントローラーで Account/Login ビューを返すと
このファイルの内容が表示/実行される• Razor 記法で記述
– HTML の中にロジックなどを埋め込める
![Page 19: はじめての ASP.NET MVC](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55acd3581a28ab4a078b470a/html5/thumbnails/19.jpg)
Razor 記法• 「ASP.NET Razor」で検索• ポイント的なところ
– @model LoginViewModel• コントローラーから受け取った LoginViewModel クラスのオブジェクト
– 親レイアウトなどテンプレート化できる(されている)• Shared/_Layout.cshtml(@RenderBody() に子のビューを表示)
– Html ヘルパーで HTML を短く書ける
<input class="form-control" data-val="true" data-val-email="電子メールフィールドは有効な電子メールアドレスではありません。" data-val-required="電子メールフィールドが必要です。" id="Email" name="Email" type="text" value="" />
@Html.TextBoxFor(m => m.Email, new { @class = "form-control" })
→
![Page 20: はじめての ASP.NET MVC](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55acd3581a28ab4a078b470a/html5/thumbnails/20.jpg)
ここまでのまとめ• ルーティングで指定したコントローラーのアクション(メソッ
ド)が実行される• コントローラーは要求を処理して表示するビューを決める
– 要求をもとにデータベースにアクセスしてなんやらしたりする• ビューはコントローラーのデータを受け取って Web ページを表
示する
![Page 21: はじめての ASP.NET MVC](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55acd3581a28ab4a078b470a/html5/thumbnails/21.jpg)
モデルを操作する
• モデルと Code First• モデルを作成• Code First で DB のテーブル作成• モデルを操作する
コントローラーとビューの作成
![Page 22: はじめての ASP.NET MVC](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55acd3581a28ab4a078b470a/html5/thumbnails/22.jpg)
モデル• Web アプリで扱うデータ(DB に格納するデータ)
– ユーザー情報など
![Page 23: はじめての ASP.NET MVC](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55acd3581a28ab4a078b470a/html5/thumbnails/23.jpg)
Code First• DB のテーブルをコードから作る方法
– 特別な専用のコードではなく通常のクラスを記述する– 記述したクラスはアプリでそのまま使える
![Page 24: はじめての ASP.NET MVC](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55acd3581a28ab4a078b470a/html5/thumbnails/24.jpg)
モデル作成• 例:イベント情報• Models/Events.cs
public class Event{
[Key]public int Id { get; set; }
[Required]public string Name { get; set; }
public DateTime StartDateTime { get; set; }}
![Page 25: はじめての ASP.NET MVC](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55acd3581a28ab4a078b470a/html5/thumbnails/25.jpg)
モデル作成• DB に格納するモデルは ApplicationDbContext クラ
スで操作する• Models/IdentityModels.cs の
ApplicationDbContext クラスに追記public DbSet<Event> Events { get; set; }
![Page 26: はじめての ASP.NET MVC](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55acd3581a28ab4a078b470a/html5/thumbnails/26.jpg)
DB のテーブル作成1. プロジェクトのビルド2. パッケージマネージャー コンソール表示
– [ツール]-[NuGet パッケージマネージャー] から3. Enable-Migrations コマンド実行
– メッセージ「Code First Migrations がプロジェクト○○で有効になりました。」
– Migrations/Configuration.cs ができている
![Page 27: はじめての ASP.NET MVC](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55acd3581a28ab4a078b470a/html5/thumbnails/27.jpg)
DB のテーブル作成4. Configuration.cs
– AutomaticMigrationsEnabled = true; に修正5. Update-Database コマンド実行
– DB の構成変更完了
![Page 28: はじめての ASP.NET MVC](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55acd3581a28ab4a078b470a/html5/thumbnails/28.jpg)
Configuration.csとUpdate-Database• Configuration クラスの Seed メソッド
– Update-Database 実行時に処理する内容を記述できる• 初期ユーザーの生成など
• Update-Database– モデルを修正するたびに実行– DB のデータ内容を維持してテーブル構造をモデルに合わせる– データ内容を維持できない場合は –force パラメーターを付けて実
行(必要なときは実行時にメッセージが表示される)– App_Data フォルダーにある .mdf ファイルを削除して作り直すの
もアリ
![Page 29: はじめての ASP.NET MVC](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55acd3581a28ab4a078b470a/html5/thumbnails/29.jpg)
コントローラーとビューの作成1. ソリューションエクスプローラー Contollers コンテキストメ
ニュー [追加]-[コントローラー]2. 「Entity Framework を使用した、ビューがある MVC 5 コン
トローラー」を「追加」3. データコンテキスト クラスで「ApplicationDbContext」選択4. モデル クラスで「Event」選択して「追加」
→ Contollers/EventContoller.cs と Views/Events が生成Event の一覧・表示・作成・編集・削除が可能なコードが生成されているので,これを元にアプリに必要な処理を実装していく
![Page 30: はじめての ASP.NET MVC](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55acd3581a28ab4a078b470a/html5/thumbnails/30.jpg)
Events/Index 一覧表示• コントローラー: DB の内容をビューに渡すpublic ActionResult Index(){
return View(db.Events.ToList());} ※ db: new ApplicationDbContext
• ビュー– @model IEnumerable<Models.Event> 扱うモデルの型を指定– @foreach (var item in Model) { ... } 一覧表示
• 「Model」で参照できる
![Page 31: はじめての ASP.NET MVC](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55acd3581a28ab4a078b470a/html5/thumbnails/31.jpg)
Events/Create 作成(ビュー側)• ビュー
– @model Models.Event:扱うモデルの型– フォームの作成@using (Html.BeginForm()) {
[email protected](model => model.Name, ...)@Html.ValidationMessageFor(model => model.Name, "“, ...)...
}
![Page 32: はじめての ASP.NET MVC](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55acd3581a28ab4a078b470a/html5/thumbnails/32.jpg)
Events/Create 作成(コントローラー側)
• コントローラー[HttpPost][ValidateAntiForgeryToken]public ActionResult Create(Event @event){
if (ModelState.IsValid){
db.Events.Add(@event);db.SaveChanges();return RedirectToAction("Index");
}return View(@event);
}
<input id="Name" name="Name" type="text" value="勉強会" />
input の値がプロパティに設定されたevent オブジェクトとして受け取れる
モデルバインディング
![Page 33: はじめての ASP.NET MVC](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55acd3581a28ab4a078b470a/html5/thumbnails/33.jpg)
モデルバインディング• 「ASP.NET モデルバインディング」で検索• Events/Createでは ビュー側の @model とコントロー
ラー側のメソッドの引数 events の型が一致していたが,一致している必要はない– リクエストデータは,一致する引数名やクラスのプロパティ名
の値に設定される
![Page 34: はじめての ASP.NET MVC](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55acd3581a28ab4a078b470a/html5/thumbnails/34.jpg)
ユーザー認証(サインイン機能)
ASP.NET Identity
![Page 35: はじめての ASP.NET MVC](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55acd3581a28ab4a078b470a/html5/thumbnails/35.jpg)
ASP.NET Identity• 「ASP.NET Identity」で検索• ASP.NET の認証や資格管理のシステム• いろいろな仕組みを提供してカスタマイズや独自実装が可能
![Page 36: はじめての ASP.NET MVC](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55acd3581a28ab4a078b470a/html5/thumbnails/36.jpg)
ユーザー認証の機能(1/2)• ユーザー認証の仕組みが実装されている
– デフォルトはメールアドレスを一意なユーザー名として使用– DB にユーザー情報を格納(AspNet から始まるテーブル名)
![Page 37: はじめての ASP.NET MVC](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55acd3581a28ab4a078b470a/html5/thumbnails/37.jpg)
ユーザー認証の機能(2/2)• 枠組みだけ用意されている機能
– メールによるパスワードリセットなど• メールを送信する部分は要実装
– 2段階認証(使ったことないけど)• SMS 部分は要実装
– Facebook/Twitter/Google アカウントによるログイン• 各サービスの ID/Secret key を指定すれば使える
– Role の実装(管理者ユーザー権限などを付けたい場合)• 生成されるコードにサンプルコードは記述されていない
– ApplicationRoleManager, RoleManager などで検索– IT 勉強会スタンプは実装している
![Page 38: はじめての ASP.NET MVC](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55acd3581a28ab4a078b470a/html5/thumbnails/38.jpg)
枠組みだけ用意されている機能の実装• App_Start/IdentityConfig.cs の編集
– EmailService クラスの実装など• App_Start/Startup.Auth.cs の編集
– Facebook/Twitter/Google ID, Secret key 指定など
![Page 39: はじめての ASP.NET MVC](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55acd3581a28ab4a078b470a/html5/thumbnails/39.jpg)
ユーザー情報のカスタマイズ• ApplicationUser クラス(IdentifyModels.cs)に
プロパティを追加して Update-Database 実行– AspNetUsers テーブルに追加される
![Page 40: はじめての ASP.NET MVC](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55acd3581a28ab4a078b470a/html5/thumbnails/40.jpg)
ユーザー認証のカスタマイズ• ユーザー名の設定やメールアドレスまたはユーザー名で
サインイン可能にするなど• AccountContoller などの編集(自分で実装)
– ユーザーの登録処理などは AccountContoller に記述されている。デフォルトのユーザー認証の機能を確認して、少しずつ修正していくといいと思う。
![Page 41: はじめての ASP.NET MVC](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55acd3581a28ab4a078b470a/html5/thumbnails/41.jpg)
Azure Web アプリで公開
![Page 42: はじめての ASP.NET MVC](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55acd3581a28ab4a078b470a/html5/thumbnails/42.jpg)
Azure Web アプリ(旧 Azure Websites )
• 「Azure Web アプリ」で検索• 使うポイント
– Visual Studio から簡単に Web アプリとして公開可能• データベースの新規作成,Code First 実行(DB 構造の変更)なども
可能– Visual Studio でリモートデバッグ可能
![Page 43: はじめての ASP.NET MVC](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55acd3581a28ab4a078b470a/html5/thumbnails/43.jpg)
発行• ソリューションエクスプローラーのプロジェクト コンテキストメ
ニュー[発行]• 「Microsoft Azure Websites」から「新規」を選択
![Page 44: はじめての ASP.NET MVC](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55acd3581a28ab4a078b470a/html5/thumbnails/44.jpg)
いろいろなトピック
細かなことはサイト参照や検索してください
![Page 45: はじめての ASP.NET MVC](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55acd3581a28ab4a078b470a/html5/thumbnails/45.jpg)
複雑なモデル• プロパティがクラス(プリミティブ型でない)
– virtual 修飾子が必要• 多対多の関係
– マッピングの記述が必要• 参考「コード・ファースト開発の基本」
– http://blog.shibayan.jp/entry/20101014/1287061553
![Page 46: はじめての ASP.NET MVC](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55acd3581a28ab4a078b470a/html5/thumbnails/46.jpg)
.mdf を削除したら再度作れなくなった• LocalDb インスタンスを終了させるコマンド
– sqllocaldb stop v11.0– sqllocaldb delete v11.0
• http://adamstephensen.com/2014/03/06/entity-framework-code-first-delete-a-localdb-instance/
![Page 47: はじめての ASP.NET MVC](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55acd3581a28ab4a078b470a/html5/thumbnails/47.jpg)
HTTPS にする1. プロジェクトのプロパティウィンドウ「開発サーバー」
1. 「SSL 有効」を True2. 「SSL URL」をコピー
2. プロジェクトのプロパティ「Web」の「プロジェクトのURL」にペースト
3. コントローラー クラスまたはそのメソッドに[RequireHttps] 属性を付け HTTPS のみ許可する
![Page 48: はじめての ASP.NET MVC](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55acd3581a28ab4a078b470a/html5/thumbnails/48.jpg)
CSRF 対策• 生成されるコードは既にされている• ビュー側
– form 内に @Html.AntiForgeryToken() 記述• コントローラー側
– メソッドに [ValidateAntiForgeryToken] 属性
![Page 49: はじめての ASP.NET MVC](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55acd3581a28ab4a078b470a/html5/thumbnails/49.jpg)
アクセス許可設定• コントローラーのクラスやメソッドに属性を指定
– 誰でもアクセスできる• [AllowAnonymous]
– サインインしたユーザーのみアクセスできる• [Authorize]
– 「Admin」Role ユーザーのみアクセスできる• [Authorize(Roles="Admin")]
![Page 50: はじめての ASP.NET MVC](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55acd3581a28ab4a078b470a/html5/thumbnails/50.jpg)
Ajax で POST 処理• NuGet パッケージ
「Microsoft.jQuery.Unobtrusive.Ajax」追加• ビュー
– Html.BeginForm → Ajax.BeginForm に変更(パラメーターも要修正)
– JavaScript でデータ受け取り,表示反映などの処理が必要• コントローラー
– ビューではなくJSON データを返すよう修正
![Page 51: はじめての ASP.NET MVC](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55acd3581a28ab4a078b470a/html5/thumbnails/51.jpg)
JSON データを返す
• return Json(object_data);– 匿名クラスでも通常のクラスのオブジェクトでも JSON に変
換して返す• Ajax によるアクセスか判定は Request.IsAjaxRequest()
![Page 52: はじめての ASP.NET MVC](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55acd3581a28ab4a078b470a/html5/thumbnails/52.jpg)
ツイート機能をつけたい• ID/Secret key 指定のみではサインインできるだけ• ツイートする仕組みなどを実装するにはサインイン時に
アクセストークンなども受け取るようTwitterAuthenticationProvider の指定が必要(次スライド)– 追加情報は DB に保存される(AspNetUserClaim テーブル)
![Page 53: はじめての ASP.NET MVC](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55acd3581a28ab4a078b470a/html5/thumbnails/53.jpg)
TwitterAuthenticationProvider の指定app.UseTwitterAuthentication(
new TwitterAuthenticationOptions(){
ConsumerKey = "**TwitterConsumerKey**",ConsumerSecret = "**TwitterConsumerSecret**",Provider = new TwitterAuthenticationProvider(){
OnAuthenticated = async (context) =>{
context.Identity.AddClaim(new Claim("urn:tokens:twitter:accesstoken", context.AccessToken));
context.Identity.AddClaim(new Claim("urn:tokens:twitter:accesstokensecret", context.AccessTokenSecret));
}}
});参考: http://blogs.msdn.com/b/tsmatsuz/archive/2014/06/16/asp-net-identity-get-claim-scope-and-access-token-using-external-login-of-google-facebook-twitter-microsoft-account.aspx
![Page 54: はじめての ASP.NET MVC](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55acd3581a28ab4a078b470a/html5/thumbnails/54.jpg)
Claim 情報の取得var accsessTokenClaim = HttpContext.GetOwinContext().GetUserManager<ApplicationUserManager>().GetClaims("userId").FirstOrDefault((x) => x.Type == "urn:tokens:twitter:accesstoken");
![Page 55: はじめての ASP.NET MVC](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55acd3581a28ab4a078b470a/html5/thumbnails/55.jpg)
Twitter ライブラリー• CoreTweet などの NuGet パッケージを追加して
ツイート処理を実装
![Page 56: はじめての ASP.NET MVC](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55acd3581a28ab4a078b470a/html5/thumbnails/56.jpg)
DB なしで Twitter サインイン機能だけ実装
• 「認証なし」のプロジェクトを作成• 必要な NuGet パッケージを追加
– Microsoft.Owin– Microsoft.Owin.Host.SystemWeb– Microsoft.Owin.Security– Microsoft.Owin.Security.Cookies– Microsoft.Owin.Security.Twitter– Owin
• Startup.Auth.cs, Startup.cs, Controller の実装• 参考「Using Owin External Login without ASP.NET Identity」
– http://coding.abel.nu/2014/11/using-owin-external-login-without-asp-net-identity/– Global.aspx Application_Start() に AntiForgeryConfig.UniqueClaimTypeIdentifier =
ClaimTypes.Name; 追記
![Page 57: はじめての ASP.NET MVC](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55acd3581a28ab4a078b470a/html5/thumbnails/57.jpg)
Azure Web アプリ関連いろいろトピック
![Page 58: はじめての ASP.NET MVC](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55acd3581a28ab4a078b470a/html5/thumbnails/58.jpg)
日時と言語• UTC• en-US• web.config で変更不可
![Page 59: はじめての ASP.NET MVC](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55acd3581a28ab4a078b470a/html5/thumbnails/59.jpg)
ログの取得• アクセスログはデフォルトで保存されていない• 旧 Portal の Web アプリの「構成」の「サイト診断」の
「Web サーバーのログ記録」で有効化できる
![Page 60: はじめての ASP.NET MVC](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55acd3581a28ab4a078b470a/html5/thumbnails/60.jpg)
実際にあったこと: 現象と原因• 現象
• 旧 Azure Portal のダッシュボードで見ると大量の HTTP サーバーエラーが発生
– 原因(アクセスログを確認して判明)• コントローラーに引数が必要なアクションを用意していた(パラメー
ターが必要な URL)– 引数なしの場合は HTTP エラーを返していた
• Google のクローラーがパラメーターなしの URL にアクセスしていた
![Page 61: はじめての ASP.NET MVC](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55acd3581a28ab4a078b470a/html5/thumbnails/61.jpg)
リモートデバッグ• 「Visual Studio で Azure のプロジェクトを Remote
Debug する」• http://blogs.msdn.com/b/tsmatsuz/archive/2013/01/31/windo
ws-azure-remote-debug-using-visual-studio-2012.aspx
![Page 62: はじめての ASP.NET MVC](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55acd3581a28ab4a078b470a/html5/thumbnails/62.jpg)
オマケ: アプリを完成させるには
![Page 63: はじめての ASP.NET MVC](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55acd3581a28ab4a078b470a/html5/thumbnails/63.jpg)
細かいことを気にしない• とりあえず動くものを公開する• 気になりそうなところ
– 変数名・関数名・クラス構造 その他もろもろ– JSON でデータ返したら camel case 一致してない
• C#/VB → Upper Camel Case, JSON → snake_case– Ajax で表示更新を実装したら cshtml と JavaScript コード
に似たような HTML 記述ができている– コントローラーに async メソッドとそうでないメソッドが混
在
![Page 64: はじめての ASP.NET MVC](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55acd3581a28ab4a078b470a/html5/thumbnails/64.jpg)
コントローラー内の async メソッドの必要性
• メソッド内で IO 処理を並列にするなど await 呼び出しを使う必要がなければ不要
• by @shibayan(ASP.NET MVP)
![Page 65: はじめての ASP.NET MVC](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55acd3581a28ab4a078b470a/html5/thumbnails/65.jpg)
アプリが完成したら• ニュースリリースを送る
– 「リツイート直後のツイートを表示するやつは」GIGAZINE とねとらぼ に送付
• Web アプリを紹介するサイトに登録
![Page 66: はじめての ASP.NET MVC](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55acd3581a28ab4a078b470a/html5/thumbnails/66.jpg)
まとめ• プロジェクトの構成
– ルーティング,コントローラー,ビュー• モデルの操作
– Code First, コントローラーとビューの生成• ユーザー認証
– 実装・用意されている仕組み,カスタマイズ方法• Azure Web アプリへ発行• その他の機能の実装方法など
![Page 67: はじめての ASP.NET MVC](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55acd3581a28ab4a078b470a/html5/thumbnails/67.jpg)
以上で…
• サインインユーザーだけがイベント情報を登録/編集できるサイト
• 登録時に情報をツイートする機能• …というようなサイトは作れるかも
![Page 68: はじめての ASP.NET MVC](https://reader033.vdocuments.mx/reader033/viewer/2022042701/55acd3581a28ab4a078b470a/html5/thumbnails/68.jpg)
ご清聴ありがとうございました
2015/4/11ASP.NET 初心者勉強会@jz5(プロ生)