laravelでユーザー管理

管理者、閲覧者など、権限によって、閲覧、編集を制限したり、表示するページを出し分けたい。

ということだが、ドキュメントを全部見ろ、とのこと。
http://laravel.jp/

tinymceの機能を考えてた時も、「ドキュメント全部読め」って怒られたけど、どうやらドキュメント読むのは基本のようね。ということで、laravelのドキュメントを読み進めたいと思います。

laravelを作っていく

frontが出来たので、
[vagrant@localhost local]$ php -v
PHP 7.1.21 (cli) (built: Aug 15 2018 18:11:46) ( NTS )
Copyright (c) 1997-2018 The PHP Group
Zend Engine v3.1.0, Copyright (c) 1998-2018 Zend Technologies

ディレクトリにcomposerが入っているので、
php composer.phar create-project –prefer-dist laravel/laravel zeus

出来ました。
[vagrant@localhost local]$ cd zeus
[vagrant@localhost zeus]$ ls
app composer.json database public routes tests
artisan composer.lock package.json readme.md server.php vendor
bootstrap config phpunit.xml resources storage webpack.mix.js

40X系、50X系のエラー処理

エラー処理について纏めます。100~300番台は正常処理。問題なし。
– 100番台=リクエスト情報処理中
– 200番台=リクエスト処理成功
– 300番台=リダイレクト処理

400 – 不正リクエスト
> ブラウザ(クライアント)から送信したリクエストに不正があり、うまく処理できないときにでるエラー
ほとんどの場合、ユーザ側のブラウザなどに問題がある可能性が高い

401 – 認証エラー
> ベーシック認証やDigest認証など、パスワードがかかっているWebサイトに対し、パスワードが間違っていた場合などに出るエラー
ユーザ権限が無い場合やID/パスワードの入力ミス時に表示される

403 – アクセス禁止
> Webサイト管理者の意向により、第3者のアクセスが禁止されているときに表示されるエラー

404 – NotFound
> ページが削除されていたり、URLが変更されてページが見れなくなっているときに表示されるエラー

500 – サーバーの内部エラー
> プログラムに問題があるときや、パーミッション設定にミスがあるときに表示されるエラー

503 – サーバー過負荷
> サーバーの過負荷状態で一時的にWebページが表示できないときに起こるエラー

40X系はまとめたいけど、404ページ作っているところの方が多いのかな、
amazon

facebookはログインページにリダイレクト

youtube ああ、いいね♪ youtubeが一番スマートな気がする

docomo たぶんおっさんが作ってんだろーなーって感じの404

google そうだよね、やっぱり。Good!

ということで、結論、40X系のトレンドはシンプルなデザイン&遊び心を入れたキャラクターを挿入!
検索サービスがある場合は、formも入れる。

404

503

メンテ中

あ、メンテ中はヘッダー表示を変えたい。まーlaravelが先だ。

jQueryを使ったアコーディオン

<!Doctype html>
<html>
<head>
    <meta charset="UTF-8">
<style>
#acMenu dt {
	display:block;
	width:250px;
	height:50px;
	line-height: 50px;
	text-align:center;
	border:#666  1px solid;
	cursor:pointer;
}
#acMenu dd{
	background:#f2f2f2;
	width:250px;
	height:50px;
	line-height:50px;
	margin-left:0px;
	text-align:center;
	border:#666 1px solid;
	display:none;
}
</style>
</head>
<body>
<h1>よくある質問</h1>
 <dl id="acMenu">
 	<dt>Q1. アコーディオンメニュー</dt>
 	<dd>A1. アコーディオンメニュー</dd>
 	<dt>Q2. アコーディオンメニュー</dt>
 	<dd>A2. アコーディオンメニュー</dd>
 	<dt>Q3. アコーディオンメニュー</dt>
 	<dd>A3. アコーディオンメニュー</dd>
</dl>

<script
      src="https://code.jquery.com/jquery-3.3.1.min.js"
      integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8="
      crossorigin="anonymous"></script>
<script>
	$(function(){
		$("#acMenu dt").on("click", function(){
			$(this).next().slideToggle();
		});
	});
</script>    
</body>
</html>

OK!
これをフロントに当てはめていきます。

さて~~~~~~~~~~~、front側の画面は全部できたので、いよいよlaravel構築をしていきます。
長かった、2週間位?

次は、laravelなんだが、まずはDBのtableを作って、中にデータを入れて、表示するところからかな。
あ、思い出した、40X系のページ、50X系のページ、メンテナンス中画面のページを作成しないと駄目ですね。

画像をdrag&drop

<?php
	if(isset($_FILES&#91;'image'&#93;&#91;'tmp_name'&#93;)){
		move_uploaded_file($_FILES&#91;'image'&#93;&#91;'tmp_name'&#93;,'asset/img/01.png');
	}
?>
<!Doctype html>
<html>
<head>
    <meta charset="UTF-8">
<style>
#drag-drop-area{
	background-color:#e6e6fa;
	padding:15px;
}
.drag-drop-inside{
	text-align:center;
	border: dashed 1px gray;
	padding: 5px;
}
</style>
</head>
<body>
<form action="#" method="POST" enctype="multipart/form-data">
	<div id="drag-drop-area">
	 <div class="drag-drop-inside">
		<p class="drag-drop-info">ここにファイルをアップロード</p>
		<p>または</p>
		<!-- <input type="file" value="ファイルを選択" name="image"> -->
		<p class="drag-drop-buttons"><input id="fileInput" type="file" value="ファイルを選択" name="image"></p>
        <input type="submit" value="送信">
     </div>
    </div>
  </form>
<script>
var fileArea = document.getElementById('drag-drop-area');
var fileInput = document.getElementById('fileInput');

fileArea.addEventListener('dragover', function(evt){
	evt.preventDefault();
	fileArea.classList.add('dragover');
});

fileArea.addEventListener('dragleave', function(evt){
	evt.preventDefault();
	fileArea.classList.remove('dragover');
});

fileArea.addEventListener('drop', function(evt){
	evt.preventDefault();
	fileArea.classList.remove('dragenter');
	var files = evt.dataTransfer.files;
	fileInput.files = files;
});

</script>    
</body>
</html>

うお、思ってたよりカッケー

で、これを当てはめたい

まー及第点でしょう。。

phpのファイルアップロード

<?php

	if(isset($_FILES&#91;'image'&#93;&#91;'tmp_name'&#93;)){
		move_uploaded_file($_FILES&#91;'image'&#93;&#91;'tmp_name'&#93;,'asset/img/01.png');
	}

?>
<!Doctype html>
<html>
<head>
    <meta charset="UTF-8">
</head>
<body>
<form action="#" method="POST" enctype="multipart/form-data">
    <input type="file" name="image">
    <input type="submit" value="upload">
  </form>    
</body>
</html>

以下でエラーで出ていて、ずっとなんでだろうなーと考えていました。

move_uploaded_file($_FILES['image']['tmp_name'],'asset/img/');

次はドラック&ドロップでアップロードしたい。

mysqlのindexって何?

大量のレコードが入っているテーブルから1行のレコードを検索するのに
頭から順番に検索したら時間がかかります。
INDEXを作成すると、データテーブルとは別に検索用に最適化された状態でデータが保存されます。
このINDEXを使うことで、目的のレコードを迅速に見つけて取り出すことが可能になります。

なるほど~ データ参照か~

実際に試してみたいですね。

aws switch roleとは

ロールは、必要な AWS リソースへのアクセスに使用できるアクセス権限セットを指定する
AWS Identity and Access Management (IAM) のユーザーに似ている

>ユーザーとしてサインインすると、特定のアクセス権限セットが付与されます。ただし、ロールにはサインインされませんが、一度サインインするとロールを切り替えることもできます。こうすると、元のユーザーアクセス権限が一時的に無効になり、そのロールに割り当てられたアクセス権限が代わりに付与されます。

なるほど、awsアカウントのロールの切り替えね。
ネーミングが難解なので、難しいわ。

IOSPとは

IOPSとは、1秒当たりにディスクが処理できるI/Oアクセスの数
1回のI/O処理にかかる時間は、データ転送時間と平均アクセス時間とを足した数値となります。このI/O処理が1秒当たり何回実行できるかの数値がIOPS
しかしデータ転送時間には、ディスクから磁気ヘッドがデータを読み書きするインタフェースの転送速度や平均メディア転送速度やドライブの信号処理とデータ転送を制御するCPUの処理時間などが加算されるので、実は正しいなデータ転送時間は把握しづらい
一般的にはIOPSの数値が高ければ高いほど高性能なディスク

ディスクは,ディスク単体でディスク・キャッシュも搭載していますので、これも転送時間に影響を与える。メイン・メモリーを使ったディスク・キャッシュも重要

Github enterprise


45日freetrialを使ってみる。

Github Enterpriseとは
「GitHub Enterprise」は大手企業・大規模組織内でセキュアな環境下でのコラボレーティブコーディングを実現

なるほど~ ここは少しづつやってきましょう