JavaScript

JavaScript

NUXT3で$fetchを含む例外処理でエラーメッセージを取り出す作業が手間なので、useFetchErrorMessageというコンポーザブルを書いて使いまわしてる話。

NUXT3から$fetchを使って、APIサーバからデータを取得した際に、エラーが返ってきた際のエラーメッセージの取得が毎度面倒だったので、コンポーザブルにして使いまわすことにしました。 APIサーバはexpressを使っていて、以下のよう...
JavaScript

クライアント側(ブラウザ)でサムネイル画像を作る方法

現在とある通販サイトを制作中なのですが、利用するユーザーの本人確認が必要なため、身分証をアップロードするステップがあります。 アップロード画像のサムネイルをどのように生成するかが本日のテーマでございます。 サーバサイドでサムネイル画像を作る...
GAS

ChatworkのタスクをGoogleカレンダーに同期するスクリプトを書いた。

タスクの管理難民のみなさん、こんにちは。 タスクの管理を楽にしたいなと思って、Trelloなどのツールを試してみたものの、「タスクを管理する」という新たなタスクが生まれてしまい、本末転倒なことになったりしませんか? なりませんか、そうですか...
JavaScript

cheerioを使ってhtmlのimgタグを相対パスに変換して出力した話

htmlソースを読み込み、ソース中のimgのパスを相対パスに変換したい。 ブラウザ上であれば、jQueryあたりでサクッとできるのだけど、これをサーバーサイド(node.js)で行いたい。 jQueryはdom環境でないと動かないので、no...
JavaScript

node.jsサーバ上の静的ファイルを、fsのストリームを使用してクライアントに返却したら、ダウンロードの進捗(プログレスバー)が表示されなかったので対処した話

nodeサーバに置かれた大きめのファイル(max 1GB)を、fsのストリームを使って以下のように返却したところ、プログレスバーが表示されなくて、いつダウンロードが終わるのか分からない状態になった。 const fs = require('...
JavaScript

Nust.jsで制作中のサイトにGoogle reCAPTCHAを設置して不正なアクセスから防御する

今、「ウェブサイト制作をぐっと楽にするウェブサービス」を制作している。 ナウいウェブサービスを目指しているので、ログインフォームやアカウント作成フォームにはreCAPTCHAを設置して、ロボットによる不正なアクセスから防御したい。 今回、初...
JavaScript

JavaScriptで、電話番号を半角数字のみに加工する関数を作ってみた

最近、Node.jsでウェブサービスを作ることが多いです。 ユーザーが入力した電話番号は、半角数字や全角数字、ハイフンや括弧の有無など、表記がバラつきがちですよね。 後で検索したくなったときに、これでは扱い辛いので、半角数字のみにしたいなと...
JavaScript

npmパッケージを修正する方法

現在、Headless CMS を使ったサービスを制作しているのですが、その中で使用するnpmパッケージにバグが見つかりました。そのモジュールのGithubを確認してみたところ、まさにこのバグの issueが上がっていましたが、 ややマイナ...
JavaScript

ブラウザ上のボタンをクリックすると、Illustratorで指定したファイルが開くようにする方法

ブラウザにはセキュリティを確保するために様々な制約があります。 例えば「ブラウザ上のボタンをクリックするとイラストレータが立ち上がって指定したファイルを開く」という動作をさせたくても出来ません。 「ボタンをクリックすると、ハードディスク上の...
JavaScript

Angular.js でng-clickのイベント伝播を停止する方法

イベントハンドラng-clickを設定したオブジェクトが重なっている場合、重なった部分をクリックすると手前のオブジェクトから順にイベントが発火しますが、その伝搬を途中で止めたいときの方法です。 <button ng-click="btnCl...