![今日のお題
function authenticateUser(username, password) {
var accounts = apiService.sql(
"SELECT * FROM users"
);
for (var i = 0; i < accounts.length; i++) {
var account = accounts[i];
if (account.username === username &&
account.password === password) {
return true;
}
}
if ("true" === "true") {
return false;
}
}](https://image.slidesharecdn.com/blazor-180901045523/85/Blazor-17-320.jpg)
![今日のお題
<script>
function authenticateUser(username, password) {
var accounts = apiService.sql(
"SELECT * FROM users"
);
for (var i = 0; i < accounts.length; i++) {
var account = accounts[i];
if (account.username === username &&
account.password === password) {
return true;
}
}
if ("true" === "true") {
return false;
}
}
$('#login').click(function() {
var username = $("#username").val();
var password = $("#password").val();
var authenticated = authenticateUser(username, password);
if (authenticated === true) {
$.cookie('loggedin', 'yes', { expires : 1 });
} else if (authenticated === false) {
$("error_message").show();
}
});
</script>](https://image.slidesharecdn.com/blazor-180901045523/85/Blazor-18-320.jpg)
![.NET アセンブリなら何でも動く？
WASM:[System.PlatformNotSupported
Exception] System.Data.SqlClient is
not supported on this platform.
SqlClient に限らず対応してないものも
あって、それは実行時に
PlatformNotSupportedException](https://image.slidesharecdn.com/blazor-180901045523/85/Blazor-27-320.jpg)
Blazor 触ってみた
- 1. Blazor 触ってみた プログラミング生放送勉強会 第53回 ＠GMOインターネット (大阪) 2018/09/01 SQLWorld お だ
- 3. Blazor ってなに？
- 4. Blazor って何？ https://blazor.net/ Blazor is an experimental .NET web framework using C# and HTML that runs in the browser. ブラウザで動く C# と HTML を使った .NET の 「実験的な」 Web フレームワーク
- 5. ブラウザで動くって？ Web アプリもブラウザで動いてない？ ASP.NET (MVC) と何が違うん？
- 6. ブラウザで動くって？ Web アプリもブラウザで動いてない？ ASP.NET (MVC) と何が違うん？ サーバー側で動作するコードを実装して、サー バー側で動かした結果をブラウザで表示している クライアント側(ブラウザ)で動作する コードを実装するのが Blazor！
- 7. Q: Is this Silverlight all over again? No, Blazor is a .NET web framework based on HTML and CSS that runs in the browser using open web standards. It requires no plugin and works on mobile devices and older brow https://github.com/aspnet/Blazor/wiki/FAQ
- 8. WASM(WebAssembly)で動く！ WASM ベースの .NET ランタイムを使っ て「通常の .NET アセンブリ」を動か す！ C# で書いたコードが WASM になるわけで は無い
- 11. 開発環境
- 12. Setup .NET Core 2.1 SDK (2.1.300 or later) VS 2017 (15.7 or later) ASP.NET web development workload selected Blazor Language Services extension VS Marketplace から
- 13. 色々あるぞ Blazor
- 14. SPA Framework シングルページアプリケーション のため の機能が標準搭載 A component model for building composable UI Routing Layouts Forms and validation Dependency injection JavaScript interop Server-side rendering … https://github.com/aspnet/Blazor
- 15. Razor 構文 Blazor = Browser + Razor = Blazor！ View は Razor で書く
- 16. 実際に見てみよう
- 17. 今日のお題 function authenticateUser(username, password) { var accounts = apiService.sql( "SELECT * FROM users" ); for (var i = 0; i < accounts.length; i++) { var account = accounts[i]; if (account.username === username && account.password === password) { return true; } } if ("true" === "true") { return false; } }
- 18. 今日のお題 <script> function authenticateUser(username, password) { var accounts = apiService.sql( "SELECT * FROM users" ); for (var i = 0; i < accounts.length; i++) { var account = accounts[i]; if (account.username === username && account.password === password) { return true; } } if ("true" === "true") { return false; } } $('#login').click(function() { var username = $("#username").val(); var password = $("#password").val(); var authenticated = authenticateUser(username, password); if (authenticated === true) { $.cookie('loggedin', 'yes', { expires : 1 }); } else if (authenticated === false) { $("error_message").show(); } }); </script>
- 19. 今日のお題 世界最悪のログイン処理コード？ https://twitter.com/hassy_nz/status/1027 890455940198400 HTML + JavaScript だと？！ クライアントから任意の SQL 投げれそう クライアントに users データ全部持ってく るのはアカン Cookie に簡単な値入れるだけで、認証済に なる …
- 20. Blazor で実装したら… .NET の dll になるので… 簡単にバレない！セーフ？ Blazor でもアウトです。やらないように！ 今回使ったいくつかの機能を紹介します
- 21. Component
- 22. Routing
- 23. Layout
- 24. Binding
- 25. DI
- 27. .NET アセンブリなら何でも動く？ WASM:[System.PlatformNotSupported Exception] System.Data.SqlClient is not supported on this platform. SqlClient に限らず対応してないものも あって、それは実行時に PlatformNotSupportedException
- 28. まとめ まだ「実験的」なプロジェクト 全ての Web 開発者用というわけではない と思う クライアント側の技術なので、サーバー 側は C#(.NET) で無くてもよい そういうとこで採用するかは別として サーバー側とのコード共有 (Req/Res の型) は大きなメリット
- 30. 参考資料 Welcome to the Blazor https://blazor.net/ GitHub – aspnet/Blazor https://github.com/aspnet/Blazor Blazor アプリケーションプログラミング自習書 https://github.com/jsakamoto/self-learning-materials-for- blazor-jp