はてなブログが独自ドメインでもHTTPS化できるようになってました。
手順を確認しておきましょう。
上記のリンクに記載されている手順は以下の通り
記事内に張った自身のブログのリンクとかも、HTTPSに変更する必要がありますね。
後はツール関連ですが、対応が必要なのがグーグルの Search Console のアドレス変更の対応です。独自ドメインで運用しているような人ならば、使用割合は高いでしょう。
HTTPからHTTPSに301リダイレクトされる必要があるのですが、そこは自動でやってくれそうなので問題なさそうです。
とりあえず、はてなブログの設定変更を行っているユーザは結構いるみたいです。我々も早めに対応する予定です。
以上
【関連するリンク】
今回はPHPフレームワークの一つのLaravelの中から、データベースのマイグレーションの機能の利用に当たって、我々の活用方法を紹介します。
今回利用するDBはMySQLですが、一部については他のDBでもほぼ同様に対応できます。
またマイグレーションに関連する内容は以下を参照して下さい。
Laravelのデータベースのマイグレーション機能 順番を強引に入れ替えることも可能 - 商売力開発ブログ
Laravelのマイグレーション機能の活用① メンバ変数を追加した上でテーブルのコメント追加も簡単に設定する方法 - 商売力開発ブログ
Laravelのマイグレーション機能の活用② 1つのファイルで複数のテーブル管理も可能 - 商売力開発ブログ
Laravelのマイグレーション機能の活用③ カラム定義の管理を楽にする方法 - 商売力開発ブログ
Laravelのマイグレーション機能の活用④ カラム定義のメソッド設定例 - 商売力開発ブログ
前回までの記事で説明したように、カラム名を指定することで定義を設定できるようなLaravelのファサードのメソッドを今回も利用します。
MigrationFunc::columnDef($table,'column_name');
このMigrationFuncファサードのメソッドの引数は以下のようなもので、nullableやデフォルト値の設定もできるものです。詳しくはこちらを参照して下さい。
public function columnDef(Blueprint $table,$column_name,$nullable_flg=false,$default=null)
今回は複数のテーブルに対して、同じカラムを追加する場合の対応を行います。ほぼ同じ構成のテーブルに対して行うイメージとなります。
まずはマイグレーションファイルに、テーブル名と追加するカラム名を設定します。今回はMySQLのみだけで利用できるafterのカラムも設定しています。
public $tbl_array=array('tbl_name_1','tbl_name_2','tbl_name_3'); public $add_col_name='add_colomn'; public $aft_col_name='after_column';//MySQLのみ
これらのプロパティ（メンバ変数）を利用してupメソッドとdownメソッドを設定していきます。
またテーブルへの変更の場合、Schema::tableを使用して設定します。
Schema::table($tbl_name, function (Blueprint $table) { MigrationSet::columnDef($table,$this->add_col_name); });
upメソッドでは、追加対象のテーブル配列をforeachで処理するようにします。処理をする前に追加対象のテーブルが存在することと、そのテーブルに追加対象のカラムがないことをチェックすることが可能です。
if(Schema::hasTable($tbl_name) && !Schema::hasColumn($tbl_name,$this->add_col_name))
MySQLの場合、afterの設定によって特定のカラムの後に追加が可能です。こちらも追加対象のテーブルにafter対象のカラムがあることをチェックすることが可能です。
if(Schema::hasColumn($tbl_name,$this->aft_col_name))
ある場合はafterを設定し、ない場合はafterを設定しないようにします。
MigrationFunc::columnDefの設定により、afterを続けて設定することができます。
MigrationSet::columnDef($table,$this->add_col_name)->after($this->aft_col_name);
これらをまとめたupメソッドは以下のようになります。
public function up() { foreach($this->tbl_array as $key => $tbl_name){ if(Schema::hasTable($tbl_name) && !Schema::hasColumn($tbl_name,$this->add_col_name)){ if(Schema::hasColumn($tbl_name,$this->aft_col_name)){ //MigrationSet後にafterを実行 Schema::table($tbl_name, function (Blueprint $table) { MigrationSet::columnDef($table,$this->add_col_name)->after($this->aft_col_name); }); }else{ //afterなし Schema::table($tbl_name, function (Blueprint $table) { MigrationSet::columnDef($table,$this->add_col_name); }); } } } }
こちらを実行すると、追加対象のテーブルに同じカラムが追加することができます。
downメソッドでも、追加対象のテーブル配列をforeachで処理するようにします。処理をする前に追加対象のテーブルが存在することと、そのテーブルに追加対象のカラムがあることをチェックすることが可能です。
if(Schema::hasTable($tbl_name) && Schema::hasColumn($tbl_name,$this->add_col_name))
downメソッドでは追加したカラムの削除を行います。カラムの削除はdropColumnで行います。
$table->dropColumn($this->add_col_name);
これらをまとめたdownメソッドは以下のようになります。
public function down() { foreach($this->tbl_array as $key => $tbl_name){ if(Schema::hasTable($tbl_name) && Schema::hasColumn($tbl_name,$this->add_col_name)){ Schema::table($tbl_name, function (Blueprint $table) { $table->dropColumn($this->add_col_name); }); } } }
こちらを実行すると、追加対象のテーブルに追加したカラムを削除することができます。
今回はLaravelのマイグレーションの我々の活用方法のうち複数テーブルへの同じカラムの追加方法を紹介しました。
以上
【関連するリンク】 www.prj-alpha.biz www.prj-alpha.biz www.prj-alpha.biz www.prj-alpha.biz www.prj-alpha.biz
今回はPHPフレームワークの一つのLaravelの中から、データベースのマイグレーションの機能の利用に当たって、我々の活用方法を紹介します。
今回利用するDBはMySQLですが、一部については他のDBでもほぼ同様に対応できます。
前回説明したカラムの共通定義用のファサードのメソッドの設定について、具体的に紹介します。
www.prj-alpha.biz
また他のマイグレーションに関連する内容は以下を参照して下さい。
Laravelのデータベースのマイグレーション機能 順番を強引に入れ替えることも可能 - 商売力開発ブログ
Laravelのマイグレーション機能の活用① メンバ変数を追加した上でテーブルのコメント追加も簡単に設定する方法 - 商売力開発ブログ
Laravelのマイグレーション機能の活用② 1つのファイルで複数のテーブル管理も可能 - 商売力開発ブログ
Laravelのマイグレーション機能の活用⑤ 複数テーブルに同じカラムを追加する - 商売力開発ブログ
前回の記事で、カラム名を指定することで定義を設定できるようなメソッドについて書きました。Laravelのファサード（MigrationFuncとします）を使用してメソッド（columnDefとします）の定義をすることで、マイグレーションファイルに以下のような記述をすることでカラムの定義ができるようにします。
MigrationFunc::columnDef($table,'group_cd');
このMigrationFuncファサードのメソッドの引数の定義は以下のようにし、この定義の具体的な実装部分を紹介します。
public function columnDef(Blueprint $table,$column_name,$nullable_flg=false,$default=null)
引数には以下を設定します。
カラムの共通定義は連想配列などで以下のようなものとし、今回はMigrationFuncファサード内に設定しておきます。設定するタイプに応じて必要な値を追加しておきます。例えばstring型の場合はlenghtを追加して、設定する際にデータ長にします。
$columnSet = [ 'id' => ['type'=>'increments','comment'=>'ID'], 'name' => ['type'=>'string','length'=>255,'comment'=>'名前'], 'group_cd' => ['type'=>'string','length'=>5,'comment'=>'グループCD'], ];
ちなみにcommentはMySQLの場合、列に設定することができます。
続いて、指定されたカラム名から対象となる定義を取得し、データ型を指定します。データ型ごとに設定するメソッドが違いますので、それぞれ別けて設定する必要があります。ここでは、switch文で対応しています。また指定できるデータ型ごとのメソッドはかなり多いので、必要なものについて設定して下さい。
//対象のカラムセットを取得 $targetCol=$columnSet[$column_name]; //データ型の指定 switch($targetCol["dataType"]){ case "increment": //incrementの設定 $tblSetter=$_table->bigIncrements($column_name); break; case "text": //textの設定 //defaultは設定できない $tblSetter=$_table->text($column_name); break; case "string": //stringの設定 $tblSetter=$_table->string($column_name,$targetCol["length"]); break; case "dateTime": //dateTimeの設定 $tblSetter=$_table->dateTime($column_name); break; case "date": //dateの設定 $tblSetter=$_table->date($column_name); break; case "flg": //flgの設定 $tblSetter=$_table->boolean($column_name); break; case "tinyInteger": //tinyIntegerの設定 $tblSetter=$_table->tinyInteger($column_name); break; case "unsignedTinyInteger": //unsignedTinyIntegerの設定 $tblSetter=$_table->unsignedTinyInteger($column_name); break; case "integer": //integerの設定 $tblSetter=$_table->integer($column_name); break; case "double": //doubleの設定 $tblSetter=$_table->double($column_name,$targetCol["length"],$targetCol["decimal"]); break; default: //設定がない場stringで設定する $tblSetter=$_table->string($column_name,255); break; }
カラムの定義のあとに、nullableなどの設定を追加で行います。データ型を設定した変数：$tblSetterに追加で設定します。
//必須の解除 if($nullable_flg){ $tblSetter->nullable(); } //デフォルト if($default!==null){ $tblSetter->default($default); } //コメントの設定 //MySQLのみ設定可能 $tblSetter->comment($targetCol["comment"]);
最終的にはこの変数：$tblSetterをreturnします。こちらをreturnすることでマイグレーションファイル側で追加で別の設定を行うことも可能となります。
return $tblSetter;
以上がカラム定義のメソッドの設定例です。
カラム定義のコメントはMySQLのみ設定可能ですが、このコメントにルールを設けうると確認が楽になることがあります。例えば、データ型ごとにコメントの先頭に同一の記号などを設定しておきます。
$columnSet = [ 'id' => ['type'=>'increments','comment'=>'●ID'], 'name' => ['type'=>'string','length'=>255,'comment'=>'■名前'], 'group_cd' => ['type'=>'string','length'=>5,'comment'=>'■グループCD'], ];
このようなルールを設けておくと、MigrationFunc::columnDefで設定したカラムは先頭に特定の記号のあるコメントが付くようになります。
MigrationFunc::columnDef($table,'group_cd');
標準の設定方法のカラムのコメントでは記号を付けないようにすることで、MigrationFunc::columnDefで設定したカラムと区別できるようにしてます。
$table->string('group_cd',5)->comment('グループCD');
ちょっとしたことですが、共通定義で設定されたカラムか簡単に分かるようになります。
今回はLaravelのマイグレーションの我々の活用方法のうちカラムの共通定義用のファサードのメソッドの設定を紹介しました。 新規サービスの開発段階では一部は使える方法ではないかと思いますので、参考にしてみて下さい。
以上
【関連するリンク】 www.prj-alpha.biz www.prj-alpha.biz www.prj-alpha.biz www.prj-alpha.biz www.prj-alpha.biz
※Project-Alphaは2019年12月をもって、サービスの提供を終了します。
今回は我々が開発しているプロジェクト管理ツールProject-Alpha（プロジェクトアルファ）を更新したので内容を説明します。
これまでガントチャートなどのコンテンツでの担当欄では、別途設定した担当用のプルダウンリストが使用できました。今回の更新により、担当用プルダウンではなくプロジェクトメンバーを設定できるようになります。
担当欄で使用する内容は各コンテンツ設定で変更可能となります。
プロジェクトメンバーに変更後は、アサインされているプロジェクトメンバーが担当に表示されます。
プロジェクトメンバーの場合、初期設定では「ID + 名前」で表示されます。こちらプロジェクト設定で、「IDのみ」や「名前のみ」に変更することも可能です。
「名前のみ」の場合、重複することがありますが、重複した場合は後ろにIDが追加されます。
ガントチャートのバー色についてもメンバー毎に設定できるようになります。
オーナーについては、オーナー設定で変更して下さい。
コンテンツのデータを入力後に、この担当の選択方法を変更するとコンテンツの担当のデータが表示されなくなります。入力後に変更した場合は担当のデータを修正して下さい。
担当の選択方法をプロジェクトメンバーとした場合、表示されるのはその時点のプロジェクトメンバーです。あるメンバーを担当に設定していて、そのメンバーをアサインから外した場合はその担当の入力欄は空白となりますので注意して下さい。
今回は更新情報の内容の説明でした。
以上
【関連するリンク】
今回はCSSのみでハンバーガーメニューのクリックでメニューの表示・非表示を制御する方法を紹介します。
Googleアナリティクスで状況を見ると、サービスサイトにスマホからアクセスがあったのでレスポンシブ対応も兼ねて設定しました。
まずは完成イメージを以下に示します。
ハンバーガーメニューとも言われる3本線を押すと、下にメニューが表示されます。またハンバーガーメニューを押すと今度は非表示となります。
これらの制御をJavaScriptを使用しないで、CSSのみで対応していきます。
この動作をCSSだけで対応するのに、checkboxの2つの機能を利用して対応します。
Input要素のcheckboxを使用して表示・非表示の制御をします。checkboxのオン時にのみ適用できるCSSの疑似クラスで制御します。以下のようなhtmlがあるとします。
<input id="topHeadNaviToggleCkBox" type="checkbox" class="naviToggleCkbox" value=0> <ul class="naviToggleTarget">
このinput要素のcheckboxがオンとなるとき、つまりチェックされた場合の疑似クラス「:checked」を使用してCSSを設定することが可能です。この「:checked」に隣接要素を指定する「+」などを利用することで、その他の要素もオンとなっときだけ適用するスタイルの設定が可能となります。
例えば「.naviToggleTarget」は通常は非表示で、checkboxがオンのときは表示する場合のCSSは以下になります。
.naviToggleCkbox:checked{ /* チェックされたときのみ適用される checkbox要素 */ } .naviToggleTarget { display: none; } .naviToggleCkbox:checked + .naviToggleTarget { /* チェックされたときのみ適用される checkbox要素の次の要素 */ display: block; }
checkboxのオンオフによる制御ができることがわかったと思いますが、実際にcheckboxをオンオフするとなるとcheckboxは小さくユーザからすると操作しにくいです。そこでlabelのfor属性を利用します。for属性にはinput要素のid属性を指定すること、そのlabelと関連付けることができます。for属性にcheckboxを指定することで、そのlabel要素をクリックすると、checkboxをオンオフすることができるようになります。
<label class="naviToggleLabel" for="topHeadNaviToggleCkBox"> <input id="topHeadNaviToggleCkBox" type="checkbox" class="naviToggleCkbox" value=0> <ul class="naviToggleTarget"> <li class="toggleItemCont"> <a href="index.html">ホーム</a> </li> </ul> </label>
この設定の場合、input要素自体は非表示にしておき、label要素だけを表示させるようにする対応が多いです。オンオフの制御と合わせることで、label要素のどこかをクリックすることで「.naviToggleTarget」が表示・非表示になり完成イメージのようになります。
htmlの例は以下のようになります。
<div class="naviToggleMenuCont"> <label class="naviToggleLabel" for="topHeadNaviToggleCkBox"> <div class="naviToggleSwitch"> <span class="iconToggleSwitch"></span> </div> <input id="topHeadNaviToggleCkBox" type="checkbox" class="naviToggleCkbox" value=0> <ul class="naviToggleTarget"> <li class="toggleItemCont theme_bg_light theme_bg_hov_dark"> <a href="index.html">ホーム</a> </li> </ul> <div class="toggleOverlay"></div> </label> </div>
input要素を非表示になっているとした場合、checkboxがオフのとき見え方は以下のようになります。
赤枠で囲った部分の「.naviToggleSwitch」はハンバーガーメニュー部分です。黄色枠で囲った部分がlabel要素の全体となります。先に説明したようにlabel要素をクリックするとcheckboxがオンオフできるので、実はこの黄色枠のどこかをクリックすれば表示・非表示が切り替わるようになります。ハンバーガーメニュー部分はメニュー表示・非表示ができる印として配置しているだけです。ハンバーガーメニュー自体は画像、アイコンフォント、CSSなどいくつかの対応方法がありますが、今回はハンバーガーメニュー自体の作り方は特に説明しないので好きな方法で対応して下さい。
checkboxがオフのとき見え方は以下のようになります。
赤枠で囲った部分の「.naviToggleTarget」は表示・非表示されるメニュー部分です。黄色枠で囲った部分は「.toggleOverlay」としています。この黄色枠部分は「.naviToggleTarget」と同様にcheckboxにより表示・非表示され、画面に表示される部分でメニュー部分（「.naviToggleTarget」の部分）以外をこの要素になるようにCSSで設定します。これにより、メニュー部分以外をクリックした場合、label要素の子要素である「.toggleOverlay」がクリックされることになり、結果としてcheckboxがオンからオフに切り替わるようになり、メニューが非表示の状態にすることができます。
細かい装飾部分を除いて、メニュー表示・非表示に関わるCSSの設定例は以下のようになります。
.naviToggleCkbox { /* checkbox要素は常に非表示 */ display: none; } .naviToggleTarget { /* メニュー部分、通常は非表示にする */ display: none; } .naviToggleCkbox:checked + .naviToggleTarget { /* checkboxがオンのとき、メニューを表示する */ display: block; z-index: 20;/* toggleOverlayより上に表示する */ } .naviToggleCkbox:checked + .naviToggleTarget + .toggleOverlay { /* checkboxがオンのとき、メニュー以外の部分 */ position: fixed; top: 0; bottom: 0; left: 0; right: 0; z-index: 10;/* naviToggleTargetより下に表示する */ }
checkboxがオンのとき、「.naviToggleTarget」と「.toggleOverlay」にz-indexを指定して、「.naviToggleTarget」を上に表示するようにします。「.naviToggleTarget」は「position: fixed;」にしてtopなどを指定することで、画面全体に表示される状態となります。
このCSSの設定により、メニュー部分の表示・非表示を制御することができます。後はお好みに合わせて装飾を設定して下さい。
今回はCSSの設定でのメニューの表示・非表示を制御する方法の紹介でした。
JavaScriptが不要なので簡単に対応することができます。
以上
今回はこのブログの運用状況について、メモがてらまとめておきたいと思います。
今年の2月中旬から始めたブログについて、5月までの記事数とアクセス数の状況は以下になります。
| 年月 | 記事追加数 | 記事累積数 | 単月アクセス数 | 累計アクセス数 |
|---|---|---|---|---|
| 2018/02 | 10 |
10 |
40 |
40 |
| 2018/03 | 6 |
16 |
150 |
190 |
| 2018/04 | 8 |
24 |
251 |
441 |
| 2018/05 | 10 |
34 |
747 |
1,188 |
アクセスの大半はGoogle検索からです。BingやYahooといったところからもアクセスがありました。Bingはほとんど意識していなかったのですが、どうもアメリカからのアクセスで多いようです。日本では使っている人、あまりいなそうですが、アメリカだと使っている人が思ったよりいるんでしょうか。2、3月は記事数も少なかったので、ほとんどアクセスありませんでしたが、4月から1日に二桁アクセスする日が出始めて、5月に大きく増えました。ただ5月のアクセス増はGoogleアナリティクスで拾えないものもあり、謎の部分もあります。
アクセスの多かった記事をいくつか紹介します。まずは、こちらAWS Certificate Manager (ACM) の記事です。
www.prj-alpha.biz
内容としては、Google Chrome の変更に向けてのACMのSSL証明書の対応についてです。4月末に Google Chrome が要件変更するので、それに関するAWSからのお知らせメールに関しての記事になります。まだ記事数も少なく、手探りの中で書いたものです。AWSからのメールの内容をGoogle検索しても、あまり出てこなかったので、自分で調べた結果を記事にしました。メールの件名で検索すると思われるので、そのあたりも含めた記事にしておくことでどうなるかというテストでもありました。結果、この記事へのアクセスが一番多くなりました。Googleで件名で検索すると、上位に表示され多くのアクセスへつながりました。4月末に再度、AWSから同じようなメールが来たのでその前後でも多くのアクセスがありました。AWSの対応が終わったので、この記事は今後はほとんどアクセスされないでしょう。ただこの記事によりGoogle検索でアクセスが増えた結果が影響しているのか、他の記事もGoogle検索からのアクセスが多くなった気がします。
続いてはこちら
www.prj-alpha.biz
こちらはプロジェクト管理ツールの宣伝にもなるようにと、ガントチャートについて初期に書いたものです。タイトルはGoogleで「ガントチャート」を検索していく中で、キーワードで「初めての」というのがあったの付けたものです。この記事に関しては現在も継続してアクセスがあります。ただ Search Console で見てもほとんど（not provided）となっていて、どの検索ワードで多くアクセスがあるかわからない状態です。
この記事には追加でいくつかのリンクを加えてるのですが、あまりクリックしてもらえない状況ですので、まだまだ工夫が足りないようです。
今回はブログの運用状況についてでした。 運用状況に関しては定期的に報告していく予定です。
以上
今回は2018年5月25日に施行された欧州のプライバシー法「一般データ保護規則（GDPR）」について、その施行後の反応を見てみたいと思います。
2018年5月25日に施行されたGDPR は、EU加盟国（EU加盟国及び欧州経済領域（EEA）の一部であるアイスランド、ノルウェー、リヒテンシュタインを含む、以下同じ）の居住者に製品・サービスを提供する、あるいは EU加盟国 の居住者に結び付くデータを収集、分析する企業、政府機関、非営利団体、その他の組織に課せられる規則です。GDPR は所在地に関係なく適用されます。
保護の対象となる個人データの範囲が広いこと、違反時の制裁金が高額なことが特徴で、施行により様々な反応が出てきております。
施行後の反応を見ていくと、まず施行初日にグーグルとフェイスブック、インスタグラム、ワッツアップがオーストリアの非営利プライバシー保護団体からデータ保護監督機関などにそれぞれ苦情の申し立てがされ、その後にアップル、アマゾン、リンクトインも同じ団体から申し立てがされています。
このプライバシー保護団体を率いる弁護士によると、以下のような発言があります。
Facebookはポリシーに同意しないユーザーのアカウントをブロックまでした。ユーザーは同意ボタンを押すか、アカウントを削除するかのどちらかを選ばなければならず、これは自由選択とは言えない。
これは個人情報に関するポリシーに同意しなくても、利用できる状態は担保しなければならないということからくる言葉です。GDPRでは同意しなくてもサービスを利用できるようにするよう定めているからです。この申し立てが認められるとしたら、かなりの影響がありそうです。
GDPRの影響から一部はEUからアクセスできないようにする措置を取ったところもあるようです。
過剰な反応のように思えますが、GDPRの内容が解釈によって抵触する可能性があることから防衛措置として行った対応のようです。少なくとも申し立ての対象となることはなくなるでしょう。
日本とEUとの間での個人情報の相互移転を認める方向で調整しています。7月に最終合意をまとめ、国内での手続きを経て、今秋までに実現する見通しとのことです。
これが合意されると欧州にもウェブサービスなどを提供している企業などは影響がありそうです。これまで欧州向けのサービスのために欧州にサーバを置いていたとしても、何か問題が発生して調査する場合には欧州に在住の人しか個人情報が絡む部分については調査ができないのではといった話がありました。これが欧州に在住してない人でも対応できる、あるいはサーバ自体が欧州になくても良いといったところまでOKとなるかもしれません。
日本語だけのウェブサイトやサービスを運用していて、ほとんどの利用者が日本国内であれば、とりあえずの対応してはこちらが参考になります。
英語も対応しているとなると、EU向けのものという解釈も成り立つことから、ウェブサイトやサービスの運用状況から対応を検討しましょう。
このGDPRですが、今後世界標準となっていく可能性があります。これはフェイスブックの個人情報流出問題と関連して、フェイスブックがGDPRの対策を世界でも行っていく流れがあることからもわかります。
フェイスブックがどこまで対応するかはわかりませんが、GDPRの内容がEUだけのローカルなものから世界標準になると考えられる場合、対応するかしないかではなく、どう対応するか、どこまで対応するかといった姿勢で臨む必要が出てきます。このあたりは所属する組織・会社の判断で変わってきそうです。
今回は欧州「一般データ保護規則（GDPR）」の施行後の反応のまとめでした。
以上
【関連するリンク】
