スタイル・エッジ技術ブログ

士業集客支援/コンサルティングのスタイル・エッジのエンジニアによるブログです。

Laravelのカスタムバリデーションでもパラメータを渡したい!

f:id:styleedge_tech:20191007101412j:plain
フリー写真素材ぱくたそ

こんにちは!スタイル・エッジLABOのやっすんです。

Laravelでバリデーションを実装するとき、 「max:256」のように、呼び出したバリデーションの後ろにコロンでパラメータを渡すことがありますよね。
今日はLaravelのカスタムバリデーションでもこのようなパラメータを渡せるようにする方法をご紹介します。
なお、Laravelのバージョンは5.5、PHPのバージョンは7.1で実装しています。

続きを読む

【ISUCON9】に参加してみた!

こんにちは!
スタイル・エッジLABOのしんちゃんです。

今回、我々スタイル・エッジLABOメンバーは、2019/09/08に開催された
「いい感じにスピードアップコンテスト」、通称ISUCONに参加しました!

ISUCONって何??っていう人のために、、、

「ISUCON」...お題となるWebサービスを、決められたルールの中で
限界まで高速化を図る、LINE株式会社主催のチューニングバトル

そうです!
ISUCONとは、過去の実績など一切関係ない己の知識と経験だけ
勝負を行うガチンコバトルです。

スタイル・エッジLABOメンバーも自身の意地プライドにかけ、
休日にも関わらず参加してきました。

今回の記事では、大会参加の様子を伝えたいと思います。


* いきなり足切り!?序盤で半分以上脱落...?

10時開始ともに全チーム一斉にスタートしました。

が....

webサービスが渡されてこない...?

事前に運営より準備するよう言われていたインスタンスwebサービスが降りてきません。

なんとか我がチームインフラ担当のK氏による機転で、
別のインスタンスを作ることで、運営から、webサービスを受け取り、
スタートラインに立つことができました。

他のチームの反応を見ると、まだほとんどのチームがスタートできておらず、
おそらくこの「魔の足切りで多くのチームが脱落したのでは、、と感じています。

その時に本日の最高順位17位」を叩き出しました(^ ^)

f:id:styleedge_tech:20190909160736j:plain


* そう簡単には行きません... 

なんとかスタートラインに立てたので、皆それぞれの役割に分かれ、取り掛かりました。

序盤の役割としては大きく分けて、「環境構築隊」「コード隊」の二つです。

想定外だったのは、ローカル環境が上手く作れず、
ローカルでwebサービスを動かせなかったことです。

これにより、変更点を加えた場合、いきなりベンチマークを行わければいけません。
これのおかげで結構な手間と時間を食われました...


↓ レンジに行く時間を惜しみ、冷たい弁当を食べるメンバー

f:id:styleedge_tech:20190910085857j:plain


* 当日意識したところ

当日、意識したところは大きく分けて以下の三つです。

SQL文で削れるところはないか
② DBにindexを貼る
③ 画像に圧縮をかけて下ろせないか

③は業務で同じようなところがあったので、奮闘の結果なんとかできました。
①②に関しては、目に付くところは大方出来たのではないかと思います。


* 最終結果は...

何度か落ちてしまい、今年も失格かな、、という場面もありましたが、
なんとか最後まで奮闘でき、失格にはならず終えることができました。

また、台風が来ていたこともあり、16時解散だったため
早めの退散にはなりましたが、できることはやったと思います。

お待ちかねの結果はというと、、、

f:id:styleedge_tech:20190910093257p:plain

277組中132位です✨

後日、スコアが0ではない人の中で順位を見てみると、
下から数えた方が早かった です。。

しかし何にせよ、前回は「失格」だったので、大きな進歩です!w


* まとめ

今回我々は、PHPを選んでやりましたが、
結果を見ると、ほとんどの組みがGoを使っていました。

本戦出場チームにはPHPを使っていたチームも2組いましたので、
我々も努力次第では予選突破できるかもしれない、という夢はあったので、
来年は本戦出場を目指して頑張りたいです🔥


最後に

スタイル・エッジLABOでは、一緒に働く仲間を募集しています。 もし興味を持っていただけましたら、ぜひ採用サイトものぞいてみてください!

株式会社スタイル・エッジLABO採用サイト

Laravel使ってみた!

f:id:styleedge_tech:20191129153549j:plain
Photo by Vincent Yee on Unsplash

初めに

こんにちはスタイルエッジLABOのSです。
初めて元Sler(Laravel初心者)がLaravelを使ってみた感想などまとめます。
この記事はこれまでPHPでのシステム開発に触れる機会が少ないエンジニアでも
理解が深まったということでこれからPHPに触れていく方に少しでも役に立てば幸いです。

Laravelのディレクトリ構成
app・・・アプリケーション本体
config・・・諸々の設定(設定というより系統別の定数群など諸々)
database・・・migration,seederなどデータベースに関連するファイルを格納
public・・・ユーザーに公開するディレクトリ(css, javascriptなどを格納)
resources・・・主にビュー(画面のテンプレート)など格納する
routes・・・大雑把に言うと入力や選択されたURLを設定に基づいて該当のコントロールファイルなどに
      導くファイルが格納される

※その他、ディレクトリは多数は存在しますが割愛します。

サクッと認証フォームが作成できる!

Laravelでは

php artisan make:auth
php artisan migrate

を実行するだけでサクッと認証フォームが作成できます。
作成したフォームを表示した結果がこちら。
※実際にはphp artisan migrateを実行しなくてもフォームの表示だけならできます。 f:id:styleedge_tech:20190801090112p:plain

テンプレートエンジンがBlade

ちょっと調べてみるとtwig, volt, smarty, mustacheなど テンプレートエンジンは多々あって
比較したり使ったりしてみると面白いかと思います!
特筆すべきではないかもしれませんがディレクティブに対して@を付けるため
他のテンプレートエンジンと異なりディレクティブがわかりやすくお気に入りです!
例)

@if ($cnt > 0) ※ディレクティブ部分
    {{ $cnt }}件のデータがあります。
@else
    データがありません。
@endif

※ディレクティブ・・・コンパイラーに与える指示文。

クエリビルダーで大体のSQLが作成できる

クエリビルダーとはデータ取得のために発行するSQLを作成する必要がありますが、
それを簡単に組み立てる仕組みです。
慣れさえすれば比較的容易にSQLを作成できると思います。
例えば

$a = DB::table('A')
             ->whereIn('id', [1, 2, 3])
             ->get();


のように「A」テーブルよりカラム「id」が「1,2,3」と一致するデータの結果を取得することができます。
※getメソッドは、PHPのstdClassオブジェクトのインスタンスを結果として含む、
Illuminate\Support\Collectionで返却されます。

但しクエリビルダーで作成されるSQLについては 必ず実際に発行されるSQLを確認しましょう。
例えば

SELECT * FROM A WHERE id IN (1, 2, ・・・)

のようなデータが増えると実行エラーが発生するようなSQL
意図せず出来てしまう恐れもあります。
動いたからといって結果を確認せずに使用するのは控えましょう。
SQLの良し悪しはレスポンスに直結します。
つまりSQLが遅い⇒時間がかかる⇒使用者のストレスが溜まる⇒矛先が管理者へ
という悪い循環が出来てしまい誰も幸せになりません。
なので設計・製造時から必ず考慮しましょう!
※遅いSQLを組む必要があるというのはDBの構造がそもそも・・・
という可能性もあるので設計の時点で意識しておくことが大事です。

まとめ

今回はLaravelについて触れてみました。
覚えることは色々ありますが逆に覚えてしまえば非常にわかりやすい印象を持ちました。

世の中には色々とフレームワークが存在します。
それぞれ一長一短があり常にベストなフレームワークは存在しないと思います。
開発が始まった時の状況やニーズで選択できるものも変わってくると思います。
その時に取捨選択するための情報を持っていることが大切です。
なので情報に対する感度を高めておくことが改めて大切かなと思いました。
今後更にコア部分にも触れられることを期待・・・したいと思います!
※初心者でも先輩方に教わりながら今回学ぶことができよかったです。

最後に

スタイル・エッジ LABOでは、一緒に働く仲間を募集しています。 もし興味を持っていただけましたら、ぜひ採用サイトものぞいてみてください!

株式会社スタイル・エッジLABO採用サイト

Seleniumでフォームのテスト

f:id:styleedge_tech:20191129154106j:plain
Photo by Aaron Burden on Unsplash

こんにちは、スタイル・エッジLABOのTMです。
普段はPHPでのシステムの開発・保守やサイトの運用保守をしています。

ところで、お問い合わせフォームなどのフォームのテストって大変ですよね。
気が付いたらメールが届かなくなってるとか怖いですよね。 フォームのテストを今回は Selenium でやってみたいと思います。

続きを読む

フォーム作成時に気をつけること(セキュリティ編)

f:id:styleedge_tech:20190708200332p:plain

初めまして!スタイル・エッジ システム事業部のMです。 業務ではPHPでの実装をはじめ、システム設計やチームマネジメントなど色々と経験を積んできています。 また、セキュリティ顧問になるべくセキュアコーディング面での技術向上と後輩エンジニアへの指導も行なっています。

今回はみなさん一度は作成したことのあるフォーム画面について、 少し似ている二つの攻撃とその対策についてお話しできればと思います。

今回扱うテーマ

XSS
  • 概要 XSSはwebページ内で不正なスクリプト(処理)を実行される攻撃です。

例えば、この攻撃に対する脆弱性があるサイトの <script>alert('あなたの個人情報を取得しました。')</script> をURLに含むリンクをクリックすると上記メッセージがポップアップで表示されます。
この場合は利用者に実害はないですが、それでも利用者を不安がらせ、サイト運営者への信頼を損なうことになります。 接続情報を取得するようなスクリプトであれば、第三者による不正アクセスも可能になってしまうため特に注意が必要です。

  • 対策
    対策としては以下が挙げられます。
    • フォームの値を画面に出力する際はhtmlspecialchars()などで特殊文字をエンティティに変換する
      →画面上にはただの文字列として表示されるので、不正なスクリプトが実行されなくなります。
    • CookieにHttpOnly属性を付与する
      JavaScript経由でCookieの値を取得できないようにします。
CSRF
  • 概要 CSRFはwebページ内の特定の機能を意図せず実行させられる攻撃です。
    SNS掲示板に犯行予告の書き込みを行なってしまうなど、かつて大きな話題になりました。
    この攻撃に対する脆弱性があるサイトにログインした状態のまま「『〇〇で△△する』と投稿する」URLのリンクをクリックした場合、
    ログインしているユーザとしてその内容を投稿してしまいます。
    つまり、攻撃者は他人の正規アカウントを利用して投稿を行うことができるのです。
    身に覚えのないうちに犯罪予告をしてしまうなど、この攻撃により利用者が大きな被害を被る可能性があるので 運営者としては防いでおくべき攻撃の一つです。

  • 対策
    対策としては以下が挙げられます。

    • フォーム画面にトークンをセットし、正しい流れで送信が行われていることを確認する。
      →現在よく使われている手法です。弊社の開発標準になっているLaravelでもこの機能が実装されています。
    • CookieにSameSite属性の'Strict'または'Lax'を設定する
      →Strictでは他のドメインからのリクエストからCookieが自動で付与されないことで、ログインが必要なサイトであればログイン画面が必要になります。
      また、LaxでもPOSTメソッドの場合はCookieを送らないようにします。
まとめ

今回挙げた内容は数多くある攻撃・対策のほんの一部です。 この他にもSQLインジェクションやメールヘッダインジェクションなど、 フォームに関連するセキュリティ対策だけでも様々ありますので、 気になった方はぜひ調べてみてください!

最後に

スタイル・エッジ システム事業部では、一緒に働く仲間を募集しています。 もし興味を持っていただけましたら、ぜひ採用サイトものぞいてみてください!

株式会社スタイル・エッジLABO採用サイト

新卒未経験でITエンジニアを目指す前に、知っておいたほうがいいこと

こんにちは〜

スタイル・エッジ システム事業部のしんちゃんです。
今年(2019年)の4月から新卒未経験でシステム事業部に入社しました。


今回は、もしあなたが、新卒未経験でエンジニアを目指そうと思っているなら、
これだけは知っておいたほうがいいよーということを2つほど、
私がこの2ヶ月半で感じたことを踏まえてお伝えしようと思います。

f:id:styleedge_tech:20191129154919j:plain フリー写真素材ぱくたそ


1. ITエンジニアと言っても色々種類がある

これは結構重要なんじゃないかなと思います。

私の友達にも何人かエンジニアになった人たちがいますが、このことを知らずに入り、
「全然コード書かないじゃんっ」 「思ってたことと全然違うっ」
などと言っている人が結構います。

実際私もこのことを知らず、ITエンジニア = "コードを書いてシステムやアプリを作る人"と思ってました。

★主なITエンジニアの種類★

  • フロントエンドエンジニア
    あなたが今見ているような、サイトの画面側を作るエンジニアです。
    言語としては主にJavaScriptHTML5/CSS3等が使用されます。


  • サーバーサイドエンジニア
    フロントエンドエンジニアとは違い、表には見えない部分を開発します。
    説明が難しいですが、画面を動かすだけではできない処理、裏側(サーバ側)の開発を行います。 言語としては、PHPPerlRubyPythonJava、C、C++など色々と使用されます。


  • インフラエンジニア
    縁の下の力持ちとして、上記のエンジニア達が開発したシステムが動くように、
    サーバーやネットワークなどの環境構築を行います。
    ちなみに場所によって違うとは思いますが、コードはほとんど書きません。


わかりずらく申し訳ないですが、こんなに種類があるんだーとわかって頂ければ本望です。

また、ITエンジニアの種類は、これでも一部でしかないし、人によって捉え方が様々なので、
興味のある方は調べてみて、自分がどんなエンジニアを目指したいのか考えてみてください。




2. プログラミング言語と言っても色々種類がある


IT業界を目指す人なら知ってる方が多いかと思いますが、 私はこの業界に入るまであまりわからなかったので、 簡単に解説しておきます。

先ほどの説明で、色々と言語がでできたと思いますが、
まず、プログラミング言語とは...から説明しときます。


プログラミング言語とは

  • 人が使う言葉のように「人 vs コンピューター」間の言葉です。
    そのため、日本人が外国人と話すときに英語を使うように
    伝えたいコンピュータによって言語も異なります。

以下に簡単な具体例を示します。

プログラミング言語の例

  • 人工知能機械学習などを作りたいなら、「Python」という言語

  • webアプリが作りたいなら、「PHP」という言語

  • iPhpneのアプリが作りたいなら、「Swift」という言語


というような感じです。
話したい(作りたい)ものによって使う言語が違うということだけわかって頂ければ大丈夫です。
(全部一緒の言語にしてくれればいいのに...)


自分がこの先どんなものを実現したいかが明確にある人は
調べてみた方がいいと思います。




今回はこんな所で終わろうと思います。


最後に スタイル・エッジ システム事業部では、一緒に働く仲間を募集しています。 もし興味を持っていただけましたら、ぜひ採用サイトものぞいてみてください!

株式会社スタイル・エッジLABO採用サイト