Webアプリケーション基礎【サイボウズ開運研修2021】

00:00:00 - 00:00:06： はいそれで終え web アプリケーション概要の講義を始めたいと思います 00:00:06 - 00:00:13： 八雲チームとスラッシュ再度チームサイト c チーム堅牢している赤い俊平です 00:00:13 - 00:00:18： よろしくお願いします 00:00:19 - 00:00:26： 8この講義ではへレバーぶりを作るよとに必要な基礎知識を説明していきます 00:00:26 - 00:00:29： で説明するのはこう 00:00:29 - 00:00:33： 割と sutter 知識がたくさん紹介するんですがまぁ 00:00:33 - 00:00:40： それぞれを深く説明するというよりは概要を知ってもらうで室になったときにみなさん 00:00:40 - 00:00:45： でまぁキーワード思い出して自分たちで調べられるような 00:00:45 - 00:00:47： ものをあ 00:00:47 - 00:00:50： なになってもらうことが目的です 00:00:50 - 00:00:58： はいえーと軽く自己紹介すると私は赤い俊平でと言いますて2013年入社で 00:00:58 - 00:01:01： 八雲チームとスラッシュ再度チーム 00:01:01 - 00:01:06： に所属していて aws s のインフ 00:01:06 - 00:01:09： やま再度ええええ 00:01:09 - 00:01:14： サイドシートいうサイボウズドットコム読み取りウエアだったり 00:01:16 - 00:01:20： サイボウズドットコムの共通管理といったような web アプリのプロペインドとか 00:01:20 - 00:01:27： までまあいろんなところをちゃんとしてるような形です 00:01:27 - 00:01:31： a mouse は web アプリケーションという 00:01:31 - 00:01:33： なんだろうっていう話なんですが 00:01:33 - 00:01:37： ウェバープルー web アプリケーションというのは web ブラウザー 00:01:37 - 00:01:43： インターフェースと1て入力して出力が入ってくるようなアプリケーションになってい 00:01:44 - 00:01:50： でそのときに通信としてい cp というプロところを使って表示するのは html 00:01:50 - 00:01:52： だったり 00:01:52 - 00:01:57： css だったりを使って画面に表示しているというようなものになります 00:01:57 - 00:02:03： 実際ユニ紛アティ web アプリケーションのアプリ部分っていうのはこう 00:02:03 - 00:02:12： 1分たちが触るパソコン弱って遠くにあるサーバーの上でもいているものになります 00:02:12 - 00:02:16： てそういう点でネイティブアプリまあスマートフォンなんかで動いてるネイティブ 00:02:16 - 00:02:21： アプリとかパソコン上で動いているデスクトップアプリの彼とは違うものになってい 00:02:21 - 00:02:27： 正しいプロネイティブアプリリーあとでもだいぶ的には web アプリが提供する 00:02:27 - 00:02:31： 機能 api を叩いてそこから入ってくる 00:02:31 - 00:02:39： データを画面に表示しているみたいな形にもなっているものを置いです 00:28:47 - 00:28:49： てい 00:02:40 - 00:02:42： サイボウズか 00:02:42 - 00:02:47： 会社として作って製品っていうのはポンドが web アプリとなっています 00:09:21 - 00:09:23： で a 00:02:51 - 00:02:55： スマートフォンようなエイプアプリとかもありますが 00:02:55 - 00:03:00： おもととなる機能はレバーアプリとして提供されています 00:03:00 - 00:03:04： 別のデビュー barbie ケーション椅子いて知っていただくという子たちになっ 00:11:52 - 00:11:53： ています 00:03:06 - 00:03:13： 愛で次 web サーバーはいったいどういうことを行っているかという話になります 00:03:13 - 00:03:17： はいえーとリープサーバーっていうのは 00:03:17 - 00:03:20： http を処理するサーバー 00:03:20 - 00:03:26： になりますクライアントからリクエスト受付てそのリクエスト 00:03:27 - 00:03:34： を求めてきた消耗の結果を返してあげるというような挙動をするような形になってい 00:03:34 - 00:03:39： 例えば右の図のように index . html って言うファイルをくださいと 00:03:39 - 00:03:46： いうリクエストだったらそスターばの中にある index . html を介して 00:03:46 - 00:03:46： あげるよ 00:03:46 - 00:03:52： どんなことをやってあげます代表的なものではパッチとか 00:03:52 - 00:03:58： iis 回チェックすいったような web サーバーが夢です 00:03:58 - 00:04:02： 入っ web サーバーはどういうことをやっているかというとまあリクエスト 00:04:02 - 00:04:04： 受け付けます 00:04:04 - 00:04:11： でそのリクエストに応じて結果を読み込んだりとか計算したい一つ結果を作りますで 00:04:11 - 00:04:16： それをリクエストを投げてきたいってに送り返してあげるということ 00:04:16 - 00:04:20： やりますでまぁ webサーバというのは通信 00:04:20 - 00:04:24： と計算をやっていると 00:04:24 - 00:04:29： なので a と入力と計算と出力があるもののんでまぁ 00:04:29 - 00:04:33： プログラムそのものという形になっています 00:04:33 - 00:04:37： でえっと後根で hc エブサーバーを 00:04:37 - 00:04:42： が通信するときにその通信プログラムでとを行っているかっていう助っ人というものを 00:04:42 - 00:04:46： 使ってを行っています 00:04:46 - 00:04:50： 8ソケットとはどういうものかというと 00:04:50 - 00:04:53： サーバーとクライアント 00:04:53 - 00:04:58： 鉄鋼ネットワーク越しに通信をするための api です 00:04:58 - 00:05:06： 鬼てぃしぴや udp の2つのプロトコルを使って通信を行います 00:05:06 - 00:05:12： ビスケットを使うと同じ振動して通信することもできるしてぃレッスンは新東通信する 00:05:12 - 00:05:16： こともできます 00:05:16 - 00:05:23： ハイソ決闘使ったプログラムの例をここで示すのは後で 00:05:25 - 00:05:30： 課題とかで使っていただくこともあるので見せていますが 00:05:30 - 00:05:34： a こっちはすげっとクライアント側の 00:05:34 - 00:05:36： まあこの例で助っ人では 00:05:36 - 00:05:42： まずソケット関数で初期化して connect 花の数で web サーバーとセッ 00:05:42 - 00:05:45： サーバ夫接続して 00:05:45 - 00:05:51： 偉いと関数や d と関数でデータを送受信してクローズでい 00:05:51 - 00:05:56： 通信を終了するというのはことを塗っています 00:05:56 - 00:06:01： サーバー側ではもうナビヒョンスペットで初期化をして 00:06:01 - 00:06:03： アドレスを 00:06:03 - 00:06:08： 設定するパスバインド関数を呼んであげて一寸管そういうことで 00:06:08 - 00:06:10： 行方その結杏 00:06:10 - 00:06:17： 始めますとて accept 関数を読んでそれも帰ってくれとリクエストか 00:06:17 - 00:06:19： 確立されていっ 00:06:20 - 00:06:22： その後リードライトおおおおおおおおおおおおおおおおおおお 00:06:22 - 00:06:30： 行ってうつしが終わる暴露するという流れになります 00:06:30 - 00:06:33： はいデー 00:06:34 - 00:06:37： 複数のリクエストが来た場合にどうなるこという 00:06:37 - 00:06:42： たちです1つ前のページは高度だとへ 00:06:42 - 00:06:49： y ループの中で accept ステリードライトしてクロス来てすことをぐるぐる 00:06:49 - 00:06:53： 回していますが 00:06:53 - 00:06:56： 数法 ps 4 00:06:56 - 00:06:59： きたらどうなるでしょうか 00:06:59 - 00:07:05： えぇまぁやってみるとあるんですが一つのリクエスト処理地を別のリクエストか 00:07:05 - 00:07:10： 受けさ受け付けることができないということになってしまいますと 00:07:10 - 00:07:17： 実際に web サーバーを作るときには5時に複数のリクエストを処理できないと 00:07:17 - 00:07:18： いけないと 00:07:18 - 00:07:21： いうことになります 00:07:21 - 00:07:26： デイリークエスト怨魔中継っているところとリクエストの処理っていうの同時に行い 00:07:26 - 00:07:27： たいと 00:07:27 - 00:07:33： りぐたいてきには accept が帰ってきたらすぐに処理を開始するんですが 00:07:33 - 00:07:39： 処理の結果を待たずにすぐに accept に戻るようなコードにあればよいという 00:07:39 - 00:07:40： ふうになります 00:07:40 - 00:07:42： するときに 00:07:42 - 00:07:46： [ __ ]処理する方法はまあいろんなものがあるんですが 00:07:46 - 00:07:56： まあ代表的なものにプロセスやスレッドっていうものを使ってあげるとつつ件できます 00:07:56 - 00:08:00： でプロセスというのはどういうものかというと 00:08:00 - 00:08:03： プログラムの実行のタービンとなります 00:08:05 - 00:08:08： ターミナルでコマンドたがいたり 00:08:08 - 00:08:14： まあデスクトップのアプリを起動したりするとプロセスというものが立ち上がります 00:08:14 - 00:08:17： プロセスつプロセスが立ち上がっている 00:08:17 - 00:08:24： のから別のプロセスにたにあるメモリに対しては臆することができないと言う 00:08:25 - 00:08:27： 制約もあります 00:08:27 - 00:08:31： して a 異なるプロセスは並列に動かすことができますと 00:08:32 - 00:08:39： エイプサーバーでプロスト使って同時に諸力が一体時はリクエスト受付たら 00:08:41 - 00:08:45： するプロセスを起動しますで通信したいソケット 00:08:45 - 00:08:54： 起動してある日起動したプロセスに引き継いで揚げることで別のプロセスで所領をなっ 00:08:54 - 00:09:01： てヘルスにリクエストを処理することができます 00:09:01 - 00:09:02： すると 00:09:02 - 00:09:08： はすペットというのは一つのプロセスの中で 00:09:08 - 00:09:11： の処理の単位となっています 00:09:11 - 00:09:16： で一般的にはプロセス3まあし距離が軽かったりします 00:09:16 - 00:09:21： でプロセスと同じように a 列に実行ができます 00:09:23 - 00:09:28： スレッドプロセスとは違って一つのプロセスの中の別のスレッドの 00:09:28 - 00:09:35： にある森に対してアクセスすることができます 00:09:35 - 00:09:40： なので web サーバーでスレッドを使いたいときはリクエストを受け付けて処理 00:09:40 - 00:09:44： するスレートを起動してそのまま処理をしてあげればよいです 00:09:44 - 00:09:51： 助っ人を引き継いだりする必要はありません 00:09:51 - 00:09:53： でえっスケットっ 00:09:53 - 00:09:56： だったりプロセスとかスレへ 00:09:56 - 00:10:03： とかスレッドを使えば webサーバのようなものを作ることができます 00:10:03 - 00:10:11： はいえーと正しいプロセスレッドにも問題があって接続数が非常に多くなってくると 00:10:11 - 00:10:15： 処理の追いつかなくなったりすることがあります 00:10:15 - 00:10:18： する時には日時愛をなど 00:10:18 - 00:10:24： を使うことでまあ大量の処理を裁くことができるので歩い 00:10:24 - 00:10:32： ですがまぁこの講義では使わないので自分で調べてみてください 00:10:34 - 00:10:38： でえっとここまでで web サーバーの 00:10:38 - 00:10:42： まあ通信ポカ同時処理をさばく 00:10:42 - 00:10:46： 話をしてきたんですが彼らはエバーアプリケーション 00:10:46 - 00:10:51： がどういうものかという話をしていきます 00:10:51 - 00:10:54： はいえっ 00:10:54 - 00:11:00： 8リヴァプリケーションだとその 00:11:00 - 00:11:05： パンシンプルな web サーバーをこの p たような静的なページを返すだけじゃ 00:11:05 - 00:11:11： なくって動的な web ページを介してあげたくなります 00:11:11 - 00:11:16： 入力があって処理があって出力があります 00:11:17 - 00:11:23： なので8処理のところでマニーのプログラムを実行して結果を返す 00:11:23 - 00:11:26： ことでまぁいろんな 00:11:28 - 00:11:32： 動的な結果を返してあげることができてそれで web アプリケーション構築する 00:11:32 - 00:11:35： ことができます 00:11:35 - 00:11:39： 細胞数を椅子もがルーム金ともベール合図もマーサ 00:11:39 - 00:11:44： 細胞同士で作ってるの web アプリは値はこんなような形で頭的な結果を返して 00:11:44 - 00:11:46： いきます 00:11:46 - 00:11:52： でそういうものの処理の仕方にはいろいろあります 00:11:56 - 00:11:59： シンプルな方法とした cgi いい common gateway 00:11:59 - 00:12:01： インターフェースいう 00:12:01 - 00:12:04： まあプロトコルがあります 00:12:04 - 00:12:09： これは web サーバーとその動的な終了したいプログラムがやりとりするための 00:12:09 - 00:12:13： インターフェースになっています 00:12:13 - 00:12:20： サバーにリクエストが来るたびに a web アプリ用のプロセスを起動します 00:12:20 - 00:12:28： で8リクエスその内容という url だというパスがだったりとかするものは輸血さ 00:12:28 - 00:12:30： れたかっていうのは環境変数とか 00:12:30 - 00:12:34： 標準入力でデータが渡ってきます 00:12:34 - 00:12:42： で処理をした結果は標準出力で返してあげるとそれがクライアントに帰っていくという 00:12:42 - 00:12:46： 仕組みになっています 00:12:46 - 00:12:53： だいぶ昔はこういう cgi を使ったやり方が主流でしたとパールなんかが 00:12:53 - 00:12:58： 絶世期で使われていたような事態は黒 cgi がよく使われていました 00:12:58 - 00:13:06： ただし毎回プロセスを新たに起動するのでちょっと大きなプログラムになるとまぁ 00:13:06 - 00:13:12： その書記官に時間がかかった遅くなったりしてしまいます 00:13:12 - 00:13:18： サイボウズ office 8メールワイズのパワー今でも4試合を使って処理が行わ 00:13:18 - 00:13:23： れ聞いたりします 00:13:23 - 00:13:28： 次は web アプリケーションサーバーというものを使った web アプリ 00:13:28 - 00:13:30： んですと 00:13:32 - 00:13:36： web アプリケーションを実行するようなサーバーを立ち上げるという 00:13:36 - 00:13:38： やり方になりますとん 00:13:38 - 00:13:41： で4試合という違って通常は 00:13:41 - 00:13:47： 州のサーブを起動しっぱなしで使えます 00:13:47 - 00:13:51： えってえっとうぇぶさあバーガー 00:13:51 - 00:13:54： っていうばアプリケーションサーバーの前によって 00:13:55 - 00:13:59： 柄パンツサーバからアプリケーションサーバーにリクエスト中継してあげるようなやり 00:13:59 - 00:14:03： 方で使われることが多いです 00:14:03 - 00:14:07： web サーバーというアプリケーションサーバーないドア 00:14:09 - 00:14:15： http を使ってやり取りしたりしています 00:14:15 - 00:14:20： てその上のパパ web アプリケーションサーバーと web アプリの i ターン 00:14:20 - 00:14:26： のどういうやり取りをするかというとまあ同じ言語で書かれていたりすることもあるの 00:14:27 - 00:14:30： まあ特定の決まったメソッドを4 00:14:30 - 00:14:34： ウェブスター ap application server 空売りバッテリー 00:14:34 - 00:14:38： に対して読んであげて情報のやり取りをして 00:14:38 - 00:14:46： リクエスト飽きて結果を返すということをやっていたりします 00:14:49 - 00:14:50： してへと 00:14:52 - 00:14:57： っていろんなやり方でばっぷりをつくっていくですが web アプリを作っていると 00:14:57 - 00:15:00： データを保存したくなります 00:15:00 - 00:15:07： プログラムだったりマシンが終了してもデータが残っていてほしい 00:15:07 - 00:15:11： くなるからですねはい 00:15:12 - 00:15:17： でデータを保存するにはまあいろんなやり方があるんですが一番 00:15:17 - 00:15:21： すごくなやり方ファイルに保存する 00:15:21 - 00:15:23： やり方です 00:15:25 - 00:15:29： 自分でそのアイルのロックをとってえっ 00:15:29 - 00:15:36： 強豪だったりとか成功をフェリーがなく背がないといけないのでプログラムが大変に 00:15:36 - 00:15:39： なってきます 00:15:39 - 00:15:44： で大規模だとまあ大変になってくるの泥校 00:15:44 - 00:15:49： 昔のサイボウズ office なんかだと本当にファイルでていったを管理 00:15:49 - 00:15:52： 単純にファイルでデータを管理していたらしいのでまぁ 00:15:52 - 00:15:54： 小規模な 00:15:54 - 00:16:01： ユーザーにしか使いうっすら言いたいなことがありますと 00:16:01 - 00:16:07： でエイプする時にはデータベース管理システムを使うと 00:16:07 - 00:16:10： まーすという難しいことの面倒を見てくる 00:16:10 - 00:16:12： くれるので 00:16:12 - 00:16:18： ええまあプログラムは楽になります 00:16:18 - 00:16:20： データベース管理システム部 00:16:20 - 00:16:23： まあまあデータを保存 00:16:23 - 00:16:27： するのをまあ管理してくれるシステムのつ大きく 00:16:27 - 00:16:31： ざっくりとは義弟2種類リレーショナルデータベース 00:16:31 - 00:16:33： マネジメントシステム 00:16:33 - 00:16:37： 直に s sql っていう 00:16:37 - 00:16:41： 呼ばれたりするものとまぁもうエスケールと 00:16:41 - 00:16:46： ざっくり言われたりするものがあります 00:16:46 - 00:16:52： dtd 書などデータベースっていうのは関係モデルっていうものを扱うようになって 00:16:52 - 00:16:55： いたんですです 00:16:55 - 00:16:58： でデータを得スケールという間もで捜査 00:16:58 - 00:17:01： するよだしものになっています 00:17:01 - 00:17:09： てまぁその辺を封じつの講義で詳しく説明してもらえると思います 00:17:09 - 00:17:12： ええまあガルーン2課金豚と感を 00:17:12 - 00:17:15： regional データベースあ 00:17:15 - 00:17:19： にデータを保存して使っています 00:17:19 - 00:17:22： ての sk るっていうの前スケール 00:17:22 - 00:17:28： に対抗して出てきたようなまデータベースで ad 所なるデータベースび 00:17:28 - 00:17:33： 早かったりしますがいろんな面でトレードがありますと 00:17:35 - 00:17:38： データの整合性とかそういうもの 00:17:38 - 00:17:44： に関してまぁレーションうデータベースより弱かったりとかそういうことがあります 00:17:44 - 00:17:48： その中でもまあ気張るそうといった key と value のピアう 00:17:48 - 00:17:54： 消しだ形式だけを保存できるような単純な形のデータベースだったり 00:17:54 - 00:17:59： 理恵ドキュメント指向データベースといったような柔軟なこそのデータを保存するよう 00:18:00 - 00:18:04： でデータベースがいます 00:18:04 - 00:18:09： こういうものを使って部アプリケーションのデータを保存して 00:18:09 - 00:18:14： いきますというものをがありますえっ 00:18:14 - 00:18:19： はいえーっとあった8 web アプリを作っていくとまぁログインが 00:18:19 - 00:18:22： ログイン機能が欲しくなる 00:18:22 - 00:18:24： 思いますまあ 00:18:24 - 00:18:31： a すごく素猫いろんなサービスを提供した襟となるとまぁほぼ必須みたいな形になっ 00:18:31 - 00:18:34： てくるような機能です 00:18:34 - 00:18:38： ユーザごとにデータを保存したりまあ 00:18:38 - 00:18:41： users photo 00:18:41 - 00:18:46： どのユーザーからのリクエストかというのを特定したりとかしたいっ 00:18:46 - 00:18:48： くなりますそう 00:18:48 - 00:18:51： そのために6今室必要ですと 00:18:51 - 00:18:56： ログインしたとまた別のページに戻ってきてもろくにされたままであるような 00:18:56 - 00:18:58： 必要がありますと 00:18:58 - 00:19:01： こういった機能を当日ゲー 00:19:01 - 00:19:03： したらよいでしょうか 00:34:24 - 00:34:27： ことになります 00:19:08 - 00:19:16： ええまあこういう時に使われるのがクッキーといった仕組みですと 00:19:16 - 00:19:23： スターバーガーから送られてきたデータをクライアント側に保存してあげるという縁組 00:19:23 - 00:19:25： になっています 00:19:25 - 00:19:29： サバーがはカセットクッキーというヘッダーを 00:19:29 - 00:19:37： 栄光レスポンスにを競ってそこでキーと値を指定してあげることができます 00:19:37 - 00:19:41： でクライアント側がその送られてきたペアを 00:19:41 - 00:19:45： プラウザーだったりの中にこそが続きますと 00:19:45 - 00:19:47： でプラントあ 00:19:47 - 00:19:53： 同じサイトへの次のリクエスト院ではそクッキーとヘッドアウディクエストに乗せて 00:19:53 - 00:20:00： 保存しちゃったキーと値を乗せて送ってあげます 00:20:00 - 00:20:05： この時 set cookie はせっコントキック今日は雪ブッキーを介してきた 00:20:05 - 00:20:09： ドメインだけに送るような仕組みになっています 00:20:09 - 00:20:13： こういう仕組みを持つことで ac tp 00:20:14 - 00:20:21： 諏訪状態を待たないんですがちょっと思って通信することができるなります 00:20:21 - 00:20:28： さらにえっをセッションという仕組みを使ってログインをしたいと 00:20:28 - 00:20:31： ログインというもののでたを保存したい 00:20:31 - 00:20:34： 保持したいということになります 00:20:34 - 00:20:36： セッションではこう 00:20:36 - 00:20:38： 一連のアクセスつでえええ 00:20:38 - 00:20:42： データを保持するんですがクッキーぬ 00:20:42 - 00:20:48： サーバ側にデータを保存するような仕組みになっています 00:20:48 - 00:20:50： てクッキー 00:20:50 - 00:20:54： でまぁ状態を保つことができるのですがクッキーだと 00:20:54 - 00:20:57： 次2進町 00:20:57 - 00:21:01： 津市の上にデータを載せるので 00:21:01 - 00:21:08： パスパートを毎回付クッキーにのせて贈るとかそういうことをやってしまう 00:21:08 - 00:21:11： 木だけを呼ぶ使うとすることをやってシュ 00:21:11 - 00:21:15： ことになったりまぁ途中でクッキーの値を 00:21:15 - 00:21:19： まあ悪意がある人に書き換えられた日 00:21:20 - 00:21:23： ようなセキュリティ的な問題があったり 00:21:24 - 00:21:29： 機に乗せられるで多量に限界があったりするので 00:21:29 - 00:21:34： まあクッキーだけにですべてのデータを載せるって言うことが難しい 00:21:34 - 00:21:38： でセッションで仕組みを使えます 00:21:38 - 00:21:43： セッションではセッションを開始したとき例えばログインにを知ったとき 00:21:43 - 00:21:47： あと二弾ダムな id をさバーガーから発行します 00:21:47 - 00:21:51： その id をクッキーにのせる 00:21:51 - 00:21:53： ことを行います 00:21:53 - 00:22:00： その時にえっと保存したいデータは不発行した it をキーにしてサーバー割に扮し 00:22:00 - 00:22:02： ておりますと 00:22:02 - 00:22:09： でログインした時はさんもログインしたユーザーの id だったりとかをサーバをが 00:22:09 - 00:22:11： に保存しているので 00:22:11 - 00:22:16： ユーザー名まログイン名とか5鯖後に汚損しているのでスムースせ 00:22:16 - 00:22:22： クッキーに乗ってる it 音とにログインしたしている状態かみたいなことを 00:22:22 - 00:22:28： a 判別するために使われます 00:22:31 - 00:22:36： ログインできるような web アプリを作っている場合にはユーザ登録が必要になり 00:22:37 - 00:22:43： 手間多く多くの場合はユーザー名とパスワードを登録させますと 00:22:43 - 00:22:48： そのときパスワードをどうやって保存したらよいでしょうとパスワードそのままでた別 00:22:48 - 00:22:50： に保存していいのかという 00:22:50 - 00:22:58： 問題になります損したパスワードが流出したらやばいよねということになりますと 00:22:58 - 00:23:00： そういう時に使われる 00:23:00 - 00:23:05： 方法がパスワードのハッシュ化というものを使ってパスワード 00:23:05 - 00:23:08： へ保存します 00:23:08 - 00:23:13： でパスワードをハッシュ関数というものに通して歯主張 00:23:13 - 00:23:16： 保存しています 00:23:16 - 00:23:23： であしゅ関数っていうのは兄の長さのバイト列から固定長のバイト列を出力して 00:23:23 - 00:23:27： 上げるような関数です 00:23:27 - 00:23:29： 出力されたまあ 00:23:29 - 00:23:37： データから元の入力の値がなんだかっていうのが推測ということが非常に難しいという 00:23:37 - 00:23:40： 特徴もあった関数になっています 00:23:40 - 00:23:47： まあ有名なのはシャツにとか車1とか md 5とかそういったような関数があるの 00:23:47 - 00:23:48： ですが 00:23:48 - 00:23:51： シャア市とか md 5とかはまぁ二 00:23:53 - 00:23:59： 関数なので使わない方がいいという風になっています 00:24:02 - 00:24:05： でログインされたときは 00:24:05 - 00:24:08： パスワードの 00:24:08 - 00:24:14： パスワードのハッシュ入力されたパスワードハッシュ超ております保存されている遊ぶ 00:24:15 - 00:24:21： とその比較をしてあげてアッシュ家同士が一致していればパスワードがあっていると 00:24:21 - 00:24:27： みなしてエログに成功というふうになります 00:24:27 - 00:24:32： で8ハッシュ関数をより安全するにはスプレーとというものを使ったりとか 00:24:32 - 00:24:36： 1幕とかいうやり方で 00:24:36 - 00:24:42： すごい回数ハッシュ関数に通して推測されにくいとかいうものを 00:24:42 - 00:24:45： 解読されにくいようなやり方をすることは 00:24:45 - 00:24:51： がありますこういうことまあベッドを調べてみてください 00:24:51 - 00:24:57： i 続いて https の話ですと 00:24:57 - 00:25:06： http では通信内容が考案も化されずに通信されるので途中のケールデー 00:25:06 - 00:25:10： 津市の内容が丸見えになってしまうたりします 00:25:10 - 00:25:12： でその通信 00:25:12 - 00:25:16： 丸見えの通信でパスワードを送ったり 00:25:16 - 00:25:21： まあセッション it が誰かに見られたりしたら 00:25:21 - 00:25:22： なるでしょうと 00:25:22 - 00:25:26： まあそのログインを乗っ取ってい 00:25:27 - 00:25:34： なりすましたりとか betta を盗まれたりとかすることが最適閉めますと 00:25:34 - 00:25:38： なので http を tls という方式では動かして 00:25:38 - 00:25:45： 淳する https というものが使われます 00:25:45 - 00:25:48： でへと内容見られないとか 00:25:48 - 00:25:53： 改ざんがされたりとかなりすまされないとか言うような特徴が a 00:25:53 - 00:25:59： サイボウズドットコムでは必ず hc ピアスを使って通信するようになっています 00:25:59 - 00:26:05： でまぁ現代でまぁ特に商用だったりとかするとまぁ https day 2シストっ 00:26:05 - 00:26:11： ていうのは必須であろうと追われます 00:26:11 - 00:26:15： 公的だったりとか商業的なセットで今からたリスク 00:26:15 - 00:26:19： 作るんだった ecp 悩みっていうのはありえないだろうと思います 00:26:19 - 00:26:24： 古いサイトではまあ ecp のサイトがまだ残ってるんですけど 00:26:24 - 00:26:30： まあブラウザで開くと安全ではありませんっていうような表記が 00:26:30 - 00:26:35： ってって怒られますとなので行 00:26:35 - 00:26:41： 商業的な歳2恋のをやるとまぁ信頼されないという風になってしまいます 00:26:41 - 00:26:46： です asal ラブステサイトで行 00:26:46 - 00:26:52： hps のをご安全性みたいなのを評価してくれるサイトがあるんですがこう 00:26:52 - 00:26:55： サイボウズドットコーム 00:26:55 - 00:26:57： の http すぁ 00:26:57 - 00:27:01： 安全性を評価したら a プラス評価が出てきてい 00:27:01 - 00:27:04： 安全であるというふうになります 00:27:04 - 00:27:07： 古い暗号化方式と顔が小 00:27:07 - 00:27:16： まだ使えたりすると高評価が下がっていてしまうという風なな風になっています 00:27:16 - 00:27:21： とはレバーアプリを作る時に言えば web アプリケーションフレームワークという 00:27:22 - 00:27:29： ものが結構ありますと英米部アプリを作るように便利な機能がいろいろ詰まった 00:27:29 - 00:27:33： ライブラリだ 00:27:33 - 00:27:37： hdp の処理だったりとかクッキーの処理だったりとか 00:27:37 - 00:27:40： まあデータベースのへのアクセスの仕方だったりとかテンプレートエンジン 00:27:40 - 00:27:48： なっ加工いろんな現在デビューバーぷりを作るのに必要ないろんなし昨日は包み込まれ 00:27:48 - 00:27:52： ています新しくばプリスクールだったらまあ 00:27:53 - 00:27:55： は何らかのフレームワークを使って 00:27:55 - 00:27:58： 作ることになります 00:27:58 - 00:28:02： まあルビオレースカッツプリングフレームアップかじゃあもとかいって有名なところが 00:28:02 - 00:28:05： あってい 00:28:06 - 00:28:10： れマークも入り廃りがあるので行 00:28:10 - 00:28:13： 死んでいったフレームワークも数知れないので行 00:28:13 - 00:28:17： この負0正こう使うかっていうのもまあ重要になるし 00:28:17 - 00:28:22： こう使っていったフレームワークは古くなった時にどうするかという 00:28:22 - 00:28:28： どう別のフレームワーク祈り帰ってるかっていうところも重要になってきます 00:28:28 - 00:28:33： 赤穂基本のフレームワークを使うず独自のプレイマークがも生み出されて 00:28:33 - 00:28:40： 行ったり擦ってまぁ扱いが大変になってしまうこともあったりします 00:28:40 - 00:28:45： 入っで f フロントエンド寄りの話も 00:28:45 - 00:28:46： していきたいと 00:28:46 - 00:28:47： ますとん 00:28:49 - 00:28:51： web アプリ校 00:28:51 - 00:28:54： 分文章だったりああ 00:28:54 - 00:28:58： データ多く画面に出す時は大体1ティ m いるというものを使います 00:28:59 - 00:29:05： html っていうのはもう文書にここぞとか意味とかを与えるための言語になってい 00:29:07 - 00:29:14： で8見出しとか段落とか他の分子5へ飛ばすようなリンクだったりとかそういうのを 00:29:14 - 00:29:17： 与えてあげます 00:29:17 - 00:29:20： いそれぞれバー 00:29:20 - 00:29:24： その絵一番とか p とか書いてある方グっていうんですがそれぞれのタグはどういう 00:29:24 - 00:29:29： 意味を持つって言うのかっていうのはルールで決まっていて 00:29:31 - 00:29:38： ってこういう決まったルールで正しい使い方をしていくと機械がそれをどういう意味か 00:29:38 - 00:29:40： というのを読むことができます 00:29:40 - 00:29:42： そうすると 00:29:42 - 00:29:46： スクリーンリーダーだったりが正しく読めて 00:29:46 - 00:29:52： アクセしゅぶるな文書を web アプリにすることができます 00:29:52 - 00:30:01： 講義ではそこまで詳しくはやたないと思うのでまた自分に調べて見て頂けたと思います 00:30:01 - 00:30:04： 8続いてテンプレートエンジンですと 00:30:04 - 00:30:10： html の中にデータを埋め込んだりとかプログラム的に好条件だったりとかで表示 00:30:10 - 00:30:14： を変えてあげるような仕組みがあります 00:30:14 - 00:30:19： hsp とか振りマーカーとか p 4匹たいとカスマーティかいいルビーと後 00:30:19 - 00:30:21： いろんなものがあります 00:30:21 - 00:30:27： 動的に html を組み立てるためのツールになっていて 00:30:27 - 00:30:30： でそうするとこう 00:30:30 - 00:30:35： エスティマいる中にユーザー名を埋め込んだりとか 00:30:35 - 00:30:40： 管理者の一人だけ特別なメッセージを出すとかそういうようなことが 00:30:40 - 00:30:42： で行う 00:30:42 - 00:30:44： ことができました 00:30:44 - 00:30:48： こういうものを使って頭的な web サイトを作ったりしました 00:30:50 - 00:30:55： はい css ですと css 数はもういい占める 00:30:55 - 00:31:02： で作った文章のみための炒めの情報を決めるための宿になっています 00:31:02 - 00:31:09： 文字の大きさだったり文字とかの色だったり背景にというものを出すかとかそういう 00:31:09 - 00:31:10： ような 00:31:10 - 00:31:14： ものを決めてあげますと 00:31:14 - 00:31:20： でえっと html には意味を買っかいて見た目は css に書いてというふうに 00:31:21 - 00:31:24： 意味と見た目を分離してあげる 00:31:24 - 00:31:27： 事にありますと 00:31:27 - 00:31:30： でこうやって来情報とまぁ 00:31:30 - 00:31:34： 目に見えるものをお分けてあげるぞ 00:31:34 - 00:31:40： 加工 css を使ってきれいに入っ日目に出すにはこう地道に助成しないといけない 00:31:40 - 00:31:45： のでなかなか大変だったりもします 00:31:45 - 00:31:50： はいえーと javascript ですと現代の web アプリてはまぁだいたい 00:31:50 - 00:31:55： はさバーガーだけで完結しないという風になっています 00:31:55 - 00:31:58： javascript 4 00:31:58 - 00:32:02： っていう言語をブラウザーで動かしてダイナミックな大きをするようなプログラムを 00:32:02 - 00:32:05： 書いてあげます 00:32:05 - 00:32:10： ドム操作といってこちらばスクリプトを使って画面を開き帰ってあげたりとか 00:32:10 - 00:32:15： ajax か ajxa シャルとかいいものを使って javascript 中 00:32:15 - 00:32:19： から acp の通信を行った芸 00:32:19 - 00:32:25： ことが行われたきますとこれにより画面戦4せずにいろんなアクションを行えるように 00:32:25 - 00:32:27： なっていますとん 00:32:27 - 00:32:32： javascript の中にも色んなフレームワークんでぃアクトとかビューとか 00:32:32 - 00:32:36： プロじゃあライブラリとかいろんなものはあって金本ではクロージャー by プラティ 00:32:36 - 00:32:43： 使った力プリアクト使ったりとか知っています 00:32:43 - 00:32:47： はいエイプついて web api ですね 00:32:47 - 00:32:52： web アプリケーション所旅行ネットワーク越しに呼び出してあげるような仕組み 00:32:52 - 00:32:58： になってますと ht html ではなくてえっとジェイソンとか xml のよう 00:32:58 - 00:33:03： なデータを返してくれるようなものになっています 00:33:03 - 00:33:08： まあストレートデータを返すだけじゃなくてサーバー内のデータを更新してあげるよう 00:33:08 - 00:33:11： な api もあります 00:33:11 - 00:33:16： ええっとばスクリプトから選んだり 00:33:16 - 00:33:18： いうことになっていますえっ 00:33:18 - 00:33:24： たとえ不均等んでは html を動的に生成するというのは最低気になっていて 00:33:24 - 00:33:25： ほとんどは 00:33:25 - 00:33:29： じゃあスクリプの中から api 呼び出してデータは取得して 00:33:32 - 00:33:37： 画面にコーデと虚辞してあげるというようなことが行われています 00:33:37 - 00:33:42： 佐波川とクライアント側でこう処理を分離できるようになるので 00:33:42 - 00:33:47： まあシンプルな構成になっていくような傾向があるので行 00:33:47 - 00:33:49： 最近の 00:33:49 - 00:33:54： web ストアアプリではまあ使われているんじゃないかと思います 00:33:54 - 00:33:58： はいここまで一通り説明したんですが 00:33:58 - 00:34:03： web アプリケーションはまあここで勧めしなかったの木右手甲 00:34:03 - 00:34:08： 非常にたくさんの要素でが組み合わさってできていますと 00:34:08 - 00:34:13： この講義は本編とっかかりの部分を去っつつ示しただけなのでまぁ 00:34:13 - 00:34:17： 名貫堅守の続きだったりとか i 属されていく 00:34:17 - 00:34:19： ってカラーとか 00:34:19 - 00:34:24： でまず維持チって言っていきましょうという 00:34:28 - 00:34:32： マンで手こぎは以上となります