※本記事は筆者styprが英語で執筆した記事を株式会社Flatt Security社内で日本語に翻訳したものになります。 TL;DR Node.jsのエコシステムで最も人気のあるMySQLパッケージの一つである mysqljs/mysql (https://github.com/mysqljs/mysql)において、クエリのエスケープ関数の予期せぬ動作がSQLインジェクションを引き起こす可能性があることが判明しました。 通常、クエリのエスケープ関数やプレースホルダはSQLインジェクションを防ぐことが知られています。しかし、mysqljs/mysql は、値の種類によってエスケープ方法が異なることが知られており、攻撃者が異なる値の種類でパラメータを渡すと、最終的に予期せぬ動作を引き起こす可能性があります。予期せぬ動作とは、バグのような動作やSQLインジェクションなどです。 ほぼすべてのオンラ
こんにちは、ぬこすけです。 近年、Webフロントエンドではサイトのパフォーマンスの重要性が高まっています。 例えば、GoogleはCore Web Vitalというパフォーマンスに指標を検索結果のランキング要因に組み込みました。 また、近年の某企業が「パフォーマンスの改善に取り組んだ結果、セッション数〇%アップ、CVR〇%アップ...」などの事例は枚挙にいとまがないでしょう。 パフォーマンスチューニングするためには、定量的に計測してボトルネックを探すようなトップダウンなアプローチもあります。 しかしながら、時には千本ノック的にハウツーを片っ端から試していくボトムアップなアプローチも有効になることもあったり、日々のコーディングでパフォーマンスを意識したコードを書くことは大切でしょう。 この記事ではパフォーマンス最適化のハウツーを紹介します。 パフォーマンス改善の施策が思い浮かばない時やフロン
となるのが原因です。parseInt というのは、文字列を解析して整数値(int)を返すグローバル関数であり、引数をまず文字列に変換する仕様となっております。その段階で 0.0000005 が "5e-7" という文字列に変換されてしまい、その文字列の先頭の 5 だけが数字として解析されてしまったため、結果として parseInt(0.0000005) === 5 となりました。 なぜ String(0.000005) === "0.000005" に、String(0.0000005) === "5e-7" になるのかについては、この記事の最後で余談として説明します。 整数化には Math.trunc を使おう このように、parseInt は文字列を引数にすることを前提にしているため、速度の面でも可読性の面でも「小数値を整数値に変換したい」という場合に使うのは望ましくありません。最も望
現在ピグ事業部の主力サービスである「ピグパーティ」でサーバーサイドエンジニアをしております新卒2年目の川口です。普段はSRE関連の業務を主とし、サーバーサイドの業務効率改善や、システムの運用保守、時には機能の開発や修正なども担当しております。 ピグパーティは、2015年にiOS/Androidでリリースされたアバターコミュニティアプリで、サーバーサイドはNode.js(JavaScript)+MongoDBを採用しています。 ピグパーティではこれまでにプライベートクラウドからGCPへの移設、Kubernetes(GKE)の採用など、技術的負債の排除や新技術の採用などを積極的に行ってまいりました。今回は、サーバーサイド開発時の大きなボトルネックになっていた、型がわからないことに起因する複数の問題を解決するために、TypeScriptを導入することにしました。その結果、システム規模に対して少な
やっぱりwebpackがわからない(エピソード2)、そもそもnpmからわからないを公開しました。 webpackがわからない 最近はViteが注目されだして、実際にとても良いビルドツールです。Vue.jsのEvan Youさんが開発しただけのことはありますね。ネーミングもイカしてます。しかし、だからといって、では開発環境にViteを採用しようと簡単にはできないのが、業務の辛い所です。新しい技術を採用して、「わしが全責任を引き受けるぜよ」というThe 男気!な人はなかなかいません。 したがって、当分はwebpackを使い続けることになるのですが、これが未だによくわからないという人が意外と多いです。フロントエンドプログラミングの初心者に近い人などは、この段階でつまずくことにより、すっかり自信をなくしてしまうこともあります。 ですが一先ず安心してください。webpackを含むこれらフロントエンド
ビルドサイズ限界まで絞りたい人向け。 あらゆる環境で実践するものではないが、知ってたら簡単に避けることができるのもあるので知っておくと便利なTIPS書いていく。 基本ポリシー 未使用コードはビルド時に全部落とす。 何が未使用コードで、何が定数かわかるようなインターフェースを人間が心がける。 用語 Dead Code Ellimination(DCE) Rollup や Terser で、未使用コードを削除すること
JavaScript、どれくらい速く「関数を値として扱えるので、引数に関数を渡したり、関数をExport/Importできる」という概念を体で覚えるかが学習曲線に大きく影響してそう。
Here is what happens when you try to fetch data directly from the body of a functional component in React 👇 Why does this happen and what tools does React offer to solve this problem? Side effects If your React component affects anything outside of itself, it’s called a side effect. Side effects shouldn’t happen during component render. Therefore they do not belong to the body of a functional com
追記: 2022年1月11日 2:29 JSTにDoS脆弱性としてセキュリティアドバイザーが出されて、悪意あるバージョン(1.4.1や1.4.2)はnpmからunpublishされ、npmの最新は安全なバージョンである1.4.0へと変更されました。 Infinite loop causing Denial of Service in colors · GHSA-5rqg-jm4f-cqx7 · GitHub Advisory Database 2022-01-08 に colors というnpmパッケージにDoS攻撃のコードが含まれたバージョンが1.4.44-liberty-2として公開されました。 GitHub: https://github.com/Marak/colors.js npm: https://www.npmjs.com/package/colors 問題についてのIssu
やること Node.jsとExpressの環境構築をDocker上で行います。 また、TypeScriptでの開発を行うためにTypeScript環境のインストールも行います。 まずNode.js×Expressの環境構築後、TypeScriptをインストール、設定します。 準備 Docker Desktopのインストール こちらからDocker Desktopをインストールします。 Mac/Windows/Linuxに対応しています。 VSCodeのインストール こちらからVSCodeをインストールします。 他のエディタでも問題ないですが、諸々使いやすいのでおススメします。 MacやLinuxをお使いの方であればvimでも問題ありません。
6回目の JavaScript ライジングスター にようこそ! JavaScript疲れから逃れるためにここに来たみなさん、ちょうどいいところに来ましたね。 今回はメタフレームワーク、速度の必要性、界隈のオールスターがテック企業にジョインした話などの話題があります。 しかし、まずはチャンピオンの話です。 今年は誰もが予想していなかった新しい覇者が誕生しました! しかもそれは、なんとコマンドラインツールです! 以下は、2021年の1年間で増加したGitHubのスター数によるランキングです。Webプラットフォームに関するベストプロジェクトを集めたリストであるBest of JSからの一年間の分析です。各プロジェクトをクリックすると、より詳細な情報を閲覧することができます。
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く