QRコード生成機能は実装が簡単! モジュールのインストール コードの実装 筆者が実装してみたページ QRコード生成機能は実装が簡単! URLを入力してポチッとボタンを押せばQRコードが生成されるあの機能。 実際に実装してみましたが、超簡単にできたので共有…
Nuxtでソースの表示 extractCSSの設定を変更するだけで解決 Nuxtでソースの表示 ブラウザ上からページのソースを見ることができますが(Chromeで「ページのソースを表示」を実行する)Nuxtでソースを表示させた時にデフォルトの設定だとCSSが全部出力されま…
aタグのイベント イベントを止める方法が用意されている aタグのイベント javascriptでは数々のイベントを設置するもの。 ホバーした時、スクロールした時、、、など色々パターンはありますが、特に多いのはクリック時のイベントではないでしょうか。 そして…
ファイルを読み込む処理 FileInputStreamでファイルの内容を読み込み InputStreamReaderで指定した文字コードに FileReaderを使えばInputStreamReader要らず 旧来のファイルの読み込み方比較 方法1 方法2 BufferedReaderを使えば一行単位で呼び出し可能に Ja…
コンパイル言語の宿命 Initialized JPA EntityManagerFactory for persistence unit ‘default’ 他の試行錯誤 コンパイル言語の宿命 Spring Bootに限らずJava等コンパイル言語の宿命ですが、ちょっとした変更でもいちいちコンパイルが必要になりますよね。 そ…
開発時のVueとサーバサイドのポート番号 ポート番号が異なることでの問題点 proxyTableで解決 開発時のVueとサーバサイドのポート番号 VueでサーバサイドのAPIを使用する開発をしており、サーバサイドのサーバも起動させている場合、Vueとサーバサイドのポー…
CORSとは? CORSの対策 Spring Bootでの対策 方法1 @CrossOriginアノテーション 方法2 Spring SecurityでCORSの設定をする方法 まずはSpring Securityのインストール WebSecurityConfigurerAdapterにCORSの設定 CORSとは? 通常Webページでは、同一生成元ポ…
Nuxtで使用する$axios getと$getの違い getで取得するパターン $getで取得するパターン POSTも一緒? Nuxtで使用する$axios SPAサイトではガンガン行う非同期通信、その中でもaxiosは良く使われると思いますが、 Nuxtの場合はnuxt-community/axios-moduleの…
routerでchildrenを設定していると表示されるWARNING 不要なname設定 routerでchildrenを設定していると表示されるWARNING VueやNuxtでは、routerの設定でchildrenを使うと構造的に見やすいルーティングを生成できますよね。 ただし、以下のような一件問題な…
Nuxtのインストール後のディレクトリ構成 不要なら消してしまおう Nuxtのインストール後のディレクトリ構成 yarnやnpmでnuxtをインストールした後のディレクトリ構成は以下になります。Project ┣ .git ┣ .nuxt ┣ node_modules ┣ assets ┣ components ┣ layou…
function()から始まるような構文 モジュールを使って呼び出し Google Tag Managerを使いたい時 Google Fontsを使いたい時 その他の方法 function()から始まるような構文 サイト制作でJavascriptのライブラリを使う昨今、サイト表示時点で外部にアクセスする…
SpringBootのFormで使われるList SpringBootのFormで使われるList SpringBootのFormバリデーションで独自バリデーションを作成し、 適用している人にとってはよく見かけるListですが、これの使い道は知ってますか?例) public @interface List { TestValida…
セッションハイジャックとは セッションIDを使わなければ関係ないの? ステートレスのサイトでセッションハイジャックを防ぐには セッションハイジャックとは ハイジャックという言葉は、輸送機関などが強奪される時に使用される言葉ですが、web業界でも使用…
Entityの@ManyToOne まずはEntityについて Cascadeはデータベース操作に関連 Entityの@ManyToOne あるEntity(エンティティ)に対してフィールドを設定した時に、 Entityとフィールドが多対一の関係にある時に使用します。 このあたりの説明は長くなるので、…
APIのPOST処理を実行 APIの記述 CORSの設定 CORSの設定を環境ごとに分ける APIのPOST処理を実行 前回は以下の記事のように、RailsでAPIを使用してGET処理を行いました。 ti-tomo-knowledge.hatenablog.com今回はPOST処理の方を行い、データの保存まで行いた…