Content Security Policy Level 3におけるXSS対策 - pixiv inside
こんにちは、セキュリティエンジニアのkoboです。ピクシブには2018年4月に入社しており、セキュリティ観点でのアプリケーション開発や脆弱性報奨金制度の運用などを行っています。 本記事では、現在ピクシブの一部のサービスで取り組んでいるContent Security Policyについて知見を共有します。 概要 Content Security Policy (CSP) は、XSSを主としたウェブアプリケーションセキュリティの問題を軽減するために考案されたブラウザのセキュリティ機構です。 ウェブアプリケーションは、 Content-Security-Policy ヘッダをHTTPレスポンスに含めることで、意図していないJavaScriptの実行やリソースの読み込みをブラウザ側で制限することができます。 CSPは2012年頃よりブラウザに実装されていますが、2016年のGoogleの調査によ
あなたの window.open はなぜ開かないのか，Chrome で - マンガ〜ノ伊藤ノ〜ト
先日 window.open をしようとしたらポップアップブロッカーに阻まれて open することができなかった． Blocked まあ，これならよくあることなのだが，いかんせん自分の記憶では onClick のようなユーザーのアクション内で開かれた window.open は阻まれないことになってると思っていた．だからそのときも onClick のイベントハンドラ内で window.open したから大丈夫だろう，と思っていたら，見事にブロックされてしまったのでなぜだろう，となっていた． 検証 なので，検証するために 3 つのケースを用意してみた: 検証ページを用意したのであなたの環境でも試してみてね♥ 今回試すブラウザは Google Chrome を前提にしてます ケース1 const immediate = () => { window.open('https://www.goog
yieldを使って非同期処理を順番に実行する
JavaScriptはシングルスレッドで動作するので、ネットワーク処理などが非同期で行われるようになっています。そうしないとAjaxを使っている間、何も入力や画面スクロールなども受け付けなくなります。 しかし非同期実行のしわ寄せとして、コールバックが多くなってネストが深くなったり、Promiseでも処理が分かりづらくなります。例えば非同期処理を伴ったループ処理を書こうとすると、次のようになります。 loop([1, 2, 3, 4, 5, 6], function(key, value, promise) { value = value * 2; promise.resolve(value); }).then(function(results) { console.log(results); }) function loop(ary, call) { var results = {}; r
V8の Object.entries/values を高速化した - abcdefGets
V8のObject.entries/valuesを高速化したよというお話 Object.entires/values そもそもObject.entries、Object.valuesとは何かというと、 GitHub - tc39/proposal-object-values-entries: ECMAScript Proposal, specs, and reference implementation for Object.values/Object.entriesで提案されていた仕様である。 見事stage4まで到達して採用された。 仕様 機能をおさらいしておく Object.entries(O) const ret = Object.entries({a: 1, b: 2, c: 3}); console.log(ret) // [['a', 1], ['b', 2], ['c',
JavaScriptによるMacの自動操作入門の情報まとめ | 大石制作ブログ
大石制作ブログblog.s004.com デザイナー大石真也が 知りたかったこと、見たかったことのメモと、仕事紹介。 自己紹介・サイト説明依頼・価格・お問合せタスク管理パートナーtwitterfacebookatom feed OS Xをスクリプトで行う自動操作は、AppleScriptで制御する場合はそのまま「AppleScript」、JavaScriptの場合は「JavaScript for Automation(以下JXA)」と呼ばれています。ちょっとややこしいけど、慣れるしかないでしょう。 僕は元々AppleScript自体がほとんど分からない状態だったけど、どうやらAppleはOSXのスクリプティングをAppleScriptからJavaScriptに置き換えたいらしいです。 AppleScriptは全然だけど、JavaScriptならチャンスか？ 気が向いたのでJXAを触ってみる
Learn web development | web.dev
Stay organized with collections Save and categorize content based on your preferences. Explore our growing collection of courses on key web design and development subjects. An industry expert has written each course, helped by members of the Chrome team. Follow the modules sequentially, or dip into the topics you most want to learn about.
Backbone.jsにReduxを導入してみる - Qiita
Reduxを導入する契機 ここ何年間かSPAアプリの構築にはBackbone.jsを使っています。 小さくて自由度が高いので、スマホのハイブリッドアプリによくマッチングするからです。 ただアプリが大きくなるにつれて、モデルのデータ管理が難しくなってきました。 SPAで作るにあたって、他の画面へモデルを引き継いだり、処理が完了すればモデルを初期化する必要が出てきます。 メニュー等で別の画面に直接飛んだり、入力をし直すために画面を戻った際にモデルのデータが意図せぬ状況になるパターンが増えてきました。 また、扱うモデルも増えてきたため、モデル内のデータがどのように変化をしているのかの把握が困難になりつつあります。 そこで目をつけたのがReduxです。 Reduxとは、アプリ全体で唯一のStoreを持ち、Reducerと呼ばれる副作用のない関数がAction(依頼種別とデータが組みになったObje
私がMVCフレームワークをもはや使わない理由
数ヶ月前、私はなぜここにたどり着き、何が可能かを理解する旅に出ました。この旅は、私にアプリケーションアーキテクチャ、MVCという強烈な宗教に対する疑いをもたらしました。そして、リアクティブ、関数型プログラミングの真の実力に触れたのです。また、シンプルさに集中する旅でもあり、私たちの産業はうまくやっているという考えを捨てる旅でもありました。どんなことを見つけたか興味がある方もいるでしょう。 私たちの見ている画面の背後にあるパターンはMVC –Model-View-Controllerです。まだウェブがなくソフトウエアアーキテクチャも分厚いクライアントが単一のデータベースに原始的なネットワークでアクセスするのがせいぜい、という時代にMVCは生まれました。そして数十年後、MVCはまだ現役であり、衰え知らずでオムニチャネルアプリケーションの開発に使われています。 Angular2のリリースの前にM
WebGLを使ってブラウザ上で3Dモデルを描画した話 - DMM.comラボエンジニアブログ
皆様、はじめまして！DMM.com Labo システム本部 事業サービス開発部の久野です。この度、社内の勉強会のLTで話した内容をまとめてみました！ 内容はWebGLというJavaScriptのAPIを使って、ブラウザ上で3Dモデルをアニメーション付きで描画するために何を行ったのか、です。 ▼実際に動作するデモです。 テクスチャを大量に読み込まなければならないので表示まで時間がかかるかもしれません。 ▲ブラウザによっては動作しない可能性がありますがデモプログラムなので悪しからず。 WebGLとはなんぞや？ WebGLとはKronos Groupが管理するOpenGL ES 2.0をブラウザ上のJavaScriptから扱えるようにしたAPIです。GPU(グラフィックカードまたはグラフィックボード)の機能を駆使して高度な3D描画を高速に行うことが出来、昨今のPC、スマートフォン等の主要なブラウ
Using Backbone without jQuery
With the latest changes from #3003, Backbone is now even further decoupled from jQuery. You can use your favorite non-jQuery DOM manipulation library with Backbone.View, or even forgo a DOM manipulation library entirely in favor of native methods. Backbone.View now exposes hooks that allow a View "adapter" to easily overwrite a few key Backbone.View methods that Backbone needs to operate, and leav
JavaScriptのオブジェクトを扱うとき、=はただの値渡しではない - woshidan's blog
2015-01-29 検索で上の方にいたみたいなので、指摘でいただいている修正を下の方に書くのじゃなくて、上の方から直しました。 修正前の記事はこちらから。 JavaScriptのオブジェクトを扱うとき、=は値渡しではない - woshidan's loose leaf 今日の昼間、ちょちょいのちょいだぜー、と思っていた処理の実装がこれが原因で30分以上詰んだので、切なくなったから書く。 参考にしたのはここらへん。 JavaScript でオブジェクトや配列をコピーする方法 | monopocket.jp JavaScript のオブジェクトは参照渡しで代入される | monopocket.jp シャローコピーとディープコピーの違い - くろの雑記帳 javascript - What is the most efficient way to clone an object? - Stac
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
非公開関数のモックを作りたい
画像の最適化 | Web | Google Developers
GitHub - gwuhaolin/web-webpack-plugin: alternative for html-webpack-plugin
GitHub - decaffeinate/decaffeinate: Goodbye CoffeeScript, hello JavaScript!
GitHub - azu/large-scale-javascript: 複雑なJavaScriptアプリケーションを作るために考えること
HTML5 video full screen on mobile browsers (android)
Events not honored on text inputs or textarea elements within iframe on ipad ios 5
GitHub - mbest/knockout-switch-case: Powerful control flow bindings for Knockout
GitHub - brianmhunt/knockout-else: else/elseif for Knockout