サクサク読めて、アプリ限定の機能も多数!
トップへ戻る
円安とは
ti-tomo-knowledge.hatenablog.com
APIとして使用される場合を想定 GinのGors設定 許可されないアクセスがされた場合 CORS 対応の後にルーティングを書かないとうまく動かない APIとして使用される場合を想定 近年SPAサイトがよく作られており、サーバサイドの言語はAPIとして開発されることが多いでしょう。 APIとして使用する場合、注意しなくてはいけないのがクロスオリジンの設定です。 他サイトから自由自在にアクセスされてしまえば、セキュリティ的にアウトですしDos攻撃の餌食にもなってしまいます。 なので、APIへのアクセスを許可するサイトURL、メソッド(POSTやGET)、ヘッダー情報を予め設定しておきましょう。 GinのGors設定 まずは必要なモジュールをインストールします。 go get github.com/gin-contrib/corsあとは以下のように「r.Use(cors.New(cors.Co
storeの変更を検知したいパターン computedを利用するやり方 storeの変更を検知したいパターン Vue.jsでは状態を管理するのに便利なVuexのstoreですが、storeの値が変更されたタイミングでイベントを実行したくなる場面はありませんか? 例えば別なコンポーネントで、非同期で値を取得するAPIを実行し、その結果をstoreに格納するパターンなどがありますね。 そのような時にどのように実装すれば良いのでしょうか。 computedを利用するやり方 僕の中ではcomputedを利用してstoreをwatchするやり方が一番扱いやすいかなという感想です。 記述は増えますが、シンプルな実装ができますね。 以下のようになります。 今回は例としてmoneyと定義したstoreを使います。 ※色々記述を飛ばしてcomputedとwatchしか書いてません笑 computed: {
AWSのAWS Certificate Manager (ACM)をELBに適用し、SSLを強制的に適用させたい場合の対応方法です。 ELBではリスナーの設定で、ポート80(http)でアクセスされた場合もポート443(https)でアクセスされた場合もポート80でEC2に転送される設定になっていることが前提です。(よくある設定ですね) webサーバはNginxを使用します。 ACMは無料で利用でき、設定も容易なために使いましたが、ELBを完全に理解していない状態で対応を行ったため、以下のことをしてハマりました汗 ・Nginxでポート80の場合は常に443(https)にリダイレクトさせ、リダイレクトの無限ループが発生してしまった。 まずACMをELBで適用させた場合のSSLの仕組みですが、ACMを使わずにサーバでSSL化している場合とは別物と考えた方が良いと思います。 サーバでSSL対応
ti-tomo-knowledge.hatenablog.com 前回は上記の記事でDBからER図(モデル)を作成する「リバースエンジニアリング」について書きましたが、ここではその逆である「フォワードエンジニアリング」について書こうと思います。 MySQLWordbenchのER図操作 MySQLWordbenchのER図では、下記のように新規でテーブルを作成したり編集したりすることができます。 もちろんテーブル同士の相関関係も作成できます。 ここからがMySQLWordbenchの素晴らしい機能なのですが、作成したモデルを簡単にDBに適用することができるのです。 つまり、モデルからスクリプトを吐き出し、テーブル定義などが簡単に行えます。 手順としては、まずは上記の画面の状態で「Database」→「Forward Engineer..」と進みます。 すると適用するDBを設定する画面になり
ここのページでは、 MySQLWorkbenchでDBからER図を作成する手順を共有します。 いわゆるリバースエンジニアリングという手順です。 ER図とは? 「Entity Relationship Diagram」と呼ばれ、データベース設計を行う際の設計手法の1つです。 各テーブルが外部キーでどのように繋がっているのかリレーションを表したり、そのリレーションが「1対1」、「1対多」、「多対多」のいずれのパターンなのかも表現します。 もしデータベース設計時にER図を作っていない人がいれば、設計時に作成することをおすすめします。 設計者であればある程度設計は頭の中に入ってきますが、後からプロジェクトに参加した人などはテーブル同士の相関関係というものを俯瞰して見なければわからないものです。 MySQLWorkbenchとは? MySQLWorkbenchとは、MySQLの管理ツールとして有名で
Tomcatのデフォルトのログ設定 Tomcatで出力されるログファイル catalina.outのローテート設定 ログファイルのローテート設定 logrotateの設定確認 logrotateの実行 localhost.YYYY-MM-DD.logのローテート設定 まとめ Tomcatのデフォルトのログ設定 タイトルの通りですが、今回はTomcatのログファイルに関する設定についてです。 Tomcatはデフォルトの設定のままでは多くのログファイルを出力します。 ただ、中には運用上不要なものが多く、ログを出しっぱなしだとファイル数が増えるばかりでリソースを圧迫してしまいます。 そこで、今回はその設定方法を記します。 今回は以下の記事を参考にさせていただきました。 Tomcat の初期設定まとめ - Qiita Tomcatで出力されるログファイル catalina.out catalina
Javaなどソースの変更をいちいちコンパイルをして確認する場合、 毎回コンパイルを手動でするのは面倒ですよね。 (慣れている人は何も感じないかもしれませんがw) Spring Bootでは自動でコンパイルをしてくれるツールがあるので、 少しは開発効率を上げることができます。 それを行うためには、Spring Boot Devtoolsというものを入れる必要があり、 pom.xmlに依存関係を追加すれば完了です。 pom.xml <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-devtools</artifactId> </dependency> Mavenの再読み込みすることを忘れないでください! Java側で自動再起動は不要だが、 Thymeleafは変更をした場合に再起動な
JavaにおけるBean まずはJavaにおけるBeanをご存知でしょうか。 BeanとはJavaBeansの略であり、インスタンス化して使用するクラスです。 変数のアクセス修飾子はprivateとし、その変数の値を変更したり、取得する際にはpublicなメソッドを使用します。 また、引き数なしのコンストラクタを持ちます。 いわゆるゲッター(getter)やセッター(setter)を保持するクラスですね。 JavaBeansを使うことについては賛否がありますが、 私自身はソースコードの共通化や可読性のためにも利用するのは好きですね。 Spring FrameworkにおけるBean Spring Bootにおける使用方法の前に、Spring FrameworkにおけるBeanの使い方ですが、使用するBeanの定義をXMLファイルに宣言する必要があるのです。 以下のような感じで毎回。。。 <
CSRF対策について CSRFとは? CSRFによる被害 通常のCSRF対策 SPAサイトのCSRF対策 方法1 リファラで判断 方法2 ログイン時に発行したトークンを照合 方法3 CORSと組み合わせてOriginをチェック CSRF対策について CSRFとは? このページに来られた方ならもう理解している方も多いとは思いますが、CSRFについて簡単に説明します。 CSRFはリクエスト強要(CSRF:Cross-site Request Forgery)という意味で、クロスサイト(Cross-site)の名の通り、正規のサイトとは別のサイトからリクエストを送らせる偽造工作です。 Webでサーバサイドの開発をしている方ならご存知だとは思いますが、例えばフォームのPOST処理は必要な項目やURLさえわかっていればどこからでもリクエストすることは可能ですよね。(リクエスト先が受け付けてくれるかは
Wordpressの管理にはGitを導入せよ! Gitの便利さを知っているけど、Wordpressにどう適用させたらいいかわからない方々、 単純にWordpressのソース管理に困っている方々。 Wordpressの管理には是非ともGitを使いましょう! 複数人で行うプロジェクトであっても、一人で行っているプロジェクトであってもGitは変更履歴を追えるのでソース管理には絶対有効です! Wordpressを使用しているのになぜGitを使わない? そもそもWordpressを使用している中でGitを使わない理由はなんでしょうか。 考えられることとして、 Gitって何? そもそもGitの使い方がよく分からない 修正する箇所も大掛かりじゃないからGitを使うまでもない WordPressは環境に依存するファイルがあるから(wp-config.phpとか)あまりGitを使うメリットを感じない upl
Spring BootでSPAとAMPの併用 Spring Bootでは基本的にフロント側はThymeleafを使用し、サーバサイドで取得した変数を活用して描画させますが、HTMLの組み方によってはAMPページもThymeleafで作成することができます。 一方SPAはSingle Page Application(シングルページアプリケーション)の名の通り、基本的にはどのURLからのアクセスでもindex.htmlなどの固定のhtmlファイルでページを開いてから、Ajaxなどの非同期通信で情報を取得してJavascriptで描画させることになります。 まったく別の技術を使用している両者ですが、URLによる切り分けで共存させることは可能です。 方法としては、サーバサイド(Spring Boot)側のコントローラーでURLによって呼び出すテンプレートを切り分けることで、両者の併用は可能になり
開発環境でもSSL対応をする理由 開発環境でのSSL対応方法 証明書の作成 SpringBootで証明書の設定 端末で証明書を信頼 本番環境のSSL対応は? 開発環境でもSSL対応をする理由 最近のwebアプリケーションでは、SSL対応させることが当たり前になっていますよね。 Let's Encryptなどもあり、無料で設定することもできるようになってきました。 ただ、webアプリケーションによっては、SSL対応をしている場合としていない場合で動作が変わることもあります。 特に開発環境では、SSL対応を考慮に入れずに開発してしまうこともあるのではないでしょうか。 本番環境にアップしてから考慮漏れに気付き、焦ってしまうこともありますよね。 よって、開発環境と本番環境の環境の差異を極力なくすためにも、開発環境でSSL対応をしたいという方もいるはずです。 今回はそんな方のニーズにお応えするための
お名前.comで取得したドメインをさくらのレンタルサーバへ向けるパターン ネームサーバをさくらのレンタルサーバに向かせる方法 ネームサーバはお名前.comのままにしてIPアドレスだけさくらのレンタルサーバに向かせる方法 お名前.comで取得したドメインをさくらのレンタルサーバへ向けるパターン アプリケーションの運用にあたって、お名前.comで取得したドメインをさくらのレンタルサーバに向ける場合、大きく分けて2つのパターンがあります。 端的に言えば「ドメインをどのネームサーバに向かせるか」によって手順が異なってきます。 web、メールともにさくらのサーバで完結させるなど、機能によってサーバの振り分けをしない場合は、ネームサーバをさくらのレンタルサーバに向かせてしまって問題ないでしょう。 ただし、webのサーバをさくらのレンタルに、メールを別なサーバ(例えばG Suite)に振り分けるなど機能
Spring Bootでのトランザクション設定方法 メソッドがpublicになっているか @RequestMappingをつけているコントローラ自体にアノテーションを付与していないか try~catchで囲まれているか 更新処理をするメソッドが直接呼ばれているか 継承されたメソッドの場合は子クラスに@Transactionalを付与 まとめ Spring Bootでのトランザクション設定方法 Spring Bootでトランザクションを設定する方法としては、TransactionManagerを使う方法と@Transactionalというアノテーションを使う方法があります。 コード量の関係やメンテナンス性などを考慮しても後者を選んで設定している人が多いのではないでしょうか。 ただ、設定したはいいものの上手く効かないという人もいると思います。 今回は後者を選んで設定した場合で、トランザクション
タイトルの通りですが、AWS(EC2)のサーバを使い、Apacheをインストールしました。 ポート開放のあたりで若干はまった部分があったので、解決方法を記述します。 AWS(EC2)にApacheをインストール このページに辿り着いた人は既にApacheのインストールまで完了していることと思いますが、一応AWS(EC2)へのApacheのインストール手順から始めます。 SSHでサーバにログインしたあと、yumでインストールします。 sudo yum install httpd次にApacheを起動します。 service httpd start ブラウザからパブリックDNSで接続 さあ、これで起動を確認するためにブラウザにAWSのパブリックDNSを入れてみました。 「ec2-XX-XX-XX-XX.ap-northeast-1.compute.amazonaws.com」みたいなやつ。 (
dataプロパティでオブジェクトの定義 変更する場合は$setで置き換え 配列中のオブジェクトはループなどで同様に変更可能 例1) 配列の2番目(インデックスのキーが1)の場合にvalueを変更する場合 例2) nameが「test2-Name」の場合にvalueを変更する場合 dataプロパティでオブジェクトの定義 Vue.jsでインスタンスを生成した際、dataオブジェクトに変数を定義した場合のリアクティブな動作についてはご存知だと思いますが、テンプレート内でdataオブジェクトに定義した変数を使用していた場合、変数の中身が変更されるとリアクティブに変更されます。 リアクティブについて詳細に述べるのは別な機会にするとして、簡単に言えば変数が変更されると、それに応じてテンプレート内で使用されている箇所も同時に変更され、変更後の値に応じた振る舞いをします。 単なる文字列(String)や数
Tomcatのインストールの仕方でCATALINA_OPTSの設定方法も異なる CATALINA_OPTSを設定する場面 Tomcatのインストール方法 wgetコマンドなどでソースコードをダウンロードしてからコンパイルする方法 yumでインストールする方法 Tomcatのインストールの仕方でCATALINA_OPTSの設定方法も異なる Java Servlet を動かすために必要なコンテナとしてよく使用されているTomcatですが、Linux環境にインストールする方法としては大きく2つあります。 それぞれの違いはご存知ですか? インストール方法によって、起動の仕組みが変わるため、CATALINA_OPTSの設定方法も変わってきます。 ここではその違いについて記したいと思いますので参考にしていただければ。 CATALINA_OPTSを設定する場面 Tomcatが起動するJavaVM(JVM
AMPページではシェアボタンを置きたくなることが多い AMPページではSNSのシェアボタンを簡単に設置できる。 はてなブックマークのシェアボタンも非公式ではあるがAMPに対応している AMPページでのはてなブックマークボタンの実装方法 AMPページではシェアボタンを置きたくなることが多い もはやwebページでは必ずと言ってもいいくらいシェアボタンを設置しますよね。 影響力のあるユーザに拡散してもらえれば一気にPV数を増やすことができます。 特にAMP対応のページを作る場合、SEOを意識したコンテンツになるため、シェアボタンによりがんがん拡散してもらいたいですよね。 AMPページではSNSのシェアボタンを簡単に設置できる。 AMPを使わないページでも比較的設置は簡単なSNSのシェアボタンですが、AMPページではもっと簡単に設定ができます。 「amp-social-share」タグを使うことで
ある条件を満たした時にクラスを割り当てる方法 ある条件を満たした時にクラスを複数割り当てる方法 ある条件Aを満たした時にクラスAを割り当て、ある条件Bを満たした時にクラスBを割り当てるなど、複数のクラスを割り当てる方法 三項演算子で条件次第で別々のクラスを割り当てる方法 Vue.jsで動的(条件を満たす場合)にクラスを割り当てる方法として、v-bind:classがあります(v-bindは省略可能)。 動的に割り当てるパターンとしては色々考えられますよね。 単純にある条件を満たした時にクラスを割り当てるパターン、条件Aを満たした時にクラスAを割り当て、条件Bを満たした時にクラスBを追加で割り当てるパターンなどなど... 今回はそのパターンに合わせた入力方法をご紹介します。 ある条件を満たした時にクラスを割り当てる方法 今回は例として、isActiveAがtrueの場合にclassAというク
このページを最初にブックマークしてみませんか?
『ti-tomo-knowledge.hatenablog.com』の新着エントリーを見る
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く