検出可能なクルデンシャルの詳細 | Articles | web.dev
検出可能なクルデンシャルの詳細 コレクションでコンテンツを整理 必要に応じて、コンテンツの保存と分類を行います。 パスキーなどの FIDO 認証情報はパスワードの置き換えを目的としていますが、その多くはユーザーがユーザー名を入力する手間を省くこともできます。これにより、ユーザーは現在のウェブサイトに対して持っているパスキーのリストからアカウントを選択して認証できます。 以前のバージョンのセキュリティ キーは 2 段階認証方式として設計されており、潜在的な認証情報の ID を必要とするため、ユーザー名の入力が必要でした。ID を知らなくてもセキュリティ キーが検出できる認証情報は、検出可能な認証情報と呼ばれます。現在作成された FIDO 認証情報のほとんどは検出可能な認証情報です。特に、パスワード マネージャーや最新のセキュリティ キーに保存されているパスキーです。 認証情報を確実に検出でき
HTMLメールの最近の実装方法を解説、tableは不要になりました
HTMLメールの実装で「tableか、、、」とため息をついていた人に朗報です。 tableを使用しなくてはいけなかった理由はWindows上のOutlookだったのですが、新しいOutlookではレンダリングエンジンがEdgeに切り替わります。これにより、tableによる実装は不要になります。 HTMLメールの最近の実装方法を解説します。 Modern HTML email (tables no longer required) by Ollie Williams 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 はじめに HTMLメールの実装でもっとも頭を悩ませている問題 今日、HTMLメールをどのように実装すべきか？ 電子メール用のAMPについて 終わりに はじめに MailChimpによるHTMLメール実装のベストプラクティ
Web の仕様を眺めるシリーズ Control UI Customization | Offers Tech Blog
Offers を運営している株式会社 overflow の あほむ でございます。 本記事は Chrome Platform Status からなんとなく Proposed なステータスのフィーチャーを取り上げて、そのプロポーザルを眺めてみるシリーズです。前回は Capability Delegation でした。 Control UI Customization 今回は Feature: Customizable <select> Element を眺めてみます。本当に眺めるだけで深入りしないので概要のみのライトな記事とご認識ください。 Open UI 方面からの提案 以前紹介した CSS Anchored Positioning と同じく MicrosoftEdge/MSEdgeExplainers に提案書があります。Author の所属も多くが Microsoft 社であり、半数は
Fresh 1.0
Fresh is a new full stack web framework for Deno. By default, web pages built with Fresh send zero JavaScript to the client. The framework has no build step which allows for an order of magnitude improvement in deployment times. Today we are releasing the first stable version of Fresh. Client side rendering has become increasingly popular in recent years. React (and React-like) pages allow program
HTTP 関連 RFC が大量に出た話と 3 行まとめ | blog.jxck.io
Intro 2022/06/06 ~ 9 あたりに、長きに渡って策定作業が行われていた HTTP 関連の RFC が大量に公開された。 RFC 9110: HTTP Semantics RFC 9111: HTTP Caching RFC 9112: HTTP/1.1 RFC 9113: HTTP/2 RFC 9114: HTTP/3 RFC 9163: Expect-CT Extension for HTTP RFC 9204: QPACK: Field Compression for HTTP/3 RFC 9205: Building Protocols with HTTP RFC 9209: The Proxy-Status HTTP Response Header Field RFC 9211: The Cache-Status HTTP Response Header Field
あなたのWebサービスの脆弱性を発見者から教えてもらう方法 - RFC9116が発表されました
先日、RFC9116が発表されました🚀 あなたのWebサービスに潜在する未知の脆弱性を誰かが見つけた時、それをあなたに連絡する方法を提示するsecurity.txtを標準化するものです。 この記事では何故これが必要だったのか、そして私たちがこれを実装する方法を簡潔に説明します。 なぜこれが必要だったのか https://securitytxt.org/のSummary(概要)にはこのように書かれています。 Webサービスのセキュリティリスクが、リスクの重大性を理解している独立したセキュリティ研究者によって発見された場合、それらを適切に開示するためのチャンネルが不足していることがよくあります。 その結果、セキュリティの問題が報告されないままになる可能性があります。 security.txtは、組織がセキュリティ研究者がセキュリティの脆弱性を安全に開示するためのプロセスを定義するのに役立つ標
CloudflareのEarly Hintsを試してみた – TravelBook Tech Blog
「Early Hints」はリソースを先読みするための新しい仕組みです。 今回は Cloudflare の機能を使って、自分たちのサイトを題材に Early Hints を試してみた件について紹介します。 Early Hints とは？ Early Hints とはリソースを先読みするための仕組みです。 Server Push が否応なしにリソースを「プッシュ」するのに対し、 Early Hints はリソースの URL だけを伝えるので、 ブラウザが賢くキャッシュ管理ができたりと効率がよいです。 例えば Web ページだと、サーバーから HTML を受け取る前にアセットの画像や CSS を優先的にダウンロードするといった使い方です。 HTML を生成するのに時間がかかる場合などは特に有効でしょう。 具体的には HTML がステータス「200」で返る前に、URL が書かれた「103」という
XState + Apollo Clientでフロントエンドのステート管理 | メルカリエンジニアリング
こんにちは。メルカリのSoftware Engineerのsotaです。 この記事は、Mercari Advent Calendar 2021 の18日目の記事です。 先日限定公開が始まったmerworkのWebフロントエンドでは、より良いUXを実現するためにコードの段階から設計していこう、というテーマをもとに、ライブラリやフレームワークの選定を行なっています。その中でAPIのデータやアプリケーションのステート管理にはXStateとGraphQLクライアントであるApollo Clientを採用しています。今回はこれらのライブラリを採用した経緯やどのように運用しているかについて解説します。 XStateについて XStateはステートチャートに基づいた状態遷移を管理するJavaScriptライブラリです。ReduxやMobXのようなフロントエンドのステート管理ライブラリと比較すると、XSt
Accessibility Testing 101 | Mercari Engineering
This post is for Day 15 of Mercari Advent Calendar 2021, brought to you by Sahil Khokhar from the Mercari JP Web team. I would like to take this opportunity to continue my efforts towards helping everyone understand Web Accessibility. After explaining The Importance of Web Accessibility and Web Accessibility through Internationalization and Localization in my previous blogs, today I would like to
DeepLのデスクトップアプリをRustとPreactとTailwind CSSでつくった | うなすけとあれこれ
これはなに https://github.com/unasuke/deplore https://github.com/unasuke/deplore/releases/tag/v0.1.0 DeepLのAPI keyを使って翻訳を行う、DeepLが公式に提供しているデスクトップアプリのようなものの個人開発版です。 UI部分にPreactとTailwind CSS (Tailwind UI)、アプリケーションの土台やAPIとの通信部分にはRust (Tauri)を使っています。 名前は、DeepLのアプリなので、 ^d.*p.*l.*$ にマッチする英単語から適当に選んで “deplore” としました。 動機 英語は英語のまま理解できるのがもちろん一番いいのですが、長すぎる英文の概要だけでもサッとつかみたい場合などは機械翻訳は非常に役立ちます。 近年、機械翻訳ではDeepLの精度がとても
新しいHTTPメソッド、QUERYメソッドの仕様 - ASnoKaze blog
新しいHTTPメソッドを定義する「The HTTP QUERY Method」という提案仕様が議論されています。 もともとは、SEARCHメソッドという呼び名が候補としてあげられていましたが、長い議論ののち、一旦QUERYと呼ぶ方向となっております。最終的なFixについては、この draft 02の公開とともに改めてコンセンサスを求めた後に行われます。 QUERYメソッド 「GETリクエストにボディを付けたいという」という質問は長らく有りました。しかし、GETやHEADリクエストでボディをつけることは非推奨となっています (参考URL)。 そのような要望のなかで、リクエストでボディを含められる冪等性の保証された新しいHTTPメソッドが検討されました。それがQUERYメソッドです。冪等性があるため、ブラウザやProxyは自動でリトライすることができます。(なお、POSTはセマンティクス上冪等
mouseover 中に表示される DOM のデバッグ | blog.jxck.io
Update 2024-03-30: Chrome 123 から "Emulate a focused page" が追加された。 これを用いれば良いため、以降の全ての方式は古くなった。 Apply other effects: enable automatic dark theme, emulate focus, and more https://developer.chrome.com/docs/devtools/rendering/apply-effects#emulate_a_focused_page マウスが乗ってないと出ない UI も、そこに Tab などでフォーカスを移し、その状態で Dev Tools の "Emulate a focused page" を有効にすれば良い。 Intro 先日、後輩が「mouseover 中にしか表示されない DOM のデバッグ」に手こずっ
Chromeの操作を記録してPuppeteerやPlaywrightのコードに置き換えてくれる「Headless Recorder」レビュー
ウェブサイトのテスト自動化やスクレイピングに利用されるPuppeteerやPlaywrightといったライブラリを使うと、ChromeやFirefoxなどのGUIを備えるブラウザなしにウェブサイトの情報を取得することができます。そんなPuppeteerやPlaywrightのコードを「ブラウザの操作」から逆に取得できるのが、Chrome拡張機能の「Headless Recorder」です。 Headless Recorder - Chrome ウェブストア https://chrome.google.com/webstore/detail/headless-recorder/djeegiggegleadkkbgopoonhjimgehda Headless RecorderはChromeウェブストアで配信されているので、上記のURLにChromeでアクセスして「Chromeに追加」をクリッ
Playwright
Playwright enables reliable end-to-end testing for modern web apps. Cross-browser. Playwright supports all modern rendering engines including Chromium, WebKit, and Firefox. Cross-platform. Test on Windows, Linux, and macOS, locally or on CI, headless or headed. Cross-language. Use the Playwright API in TypeScript, JavaScript, Python, .NET, Java. Test Mobile Web. Native mobile emulation of Google C
Public Suffix List の用途と今起こっている問題について | blog.jxck.io
Intro Public Suffix List (PSL) は、現在の Web プラットフォームの一端を支えている非常に重要な要素だ。 実はこれが、少数のボランティアにより GitHub でメンテナンスされた、単なるテキストリストであることは、あまり知られていないかもしれない。 最近、このリストへの追加リクエストがあとを絶たず、問題になっている。 そもそも PSL とは何であり、今どのような問題が起こっているのかについて解説する。 Public Suffix List とは何か PSL を解説するには、まず関連する用語について整理する。 Top Level Domain (TLD) 例えば、このブログのドメインは blog.jxck.io であり、これは筆者が取得したドメイン jxck.io のサブドメインだ。 jxck.io は、 .io という TLD のサブドメインを販売しているレ
Spectre の影響を受けないウェブを作るための概念実証について
.app 1 .dev 1 #11WeeksOfAndroid 13 #11WeeksOfAndroid Android TV 1 #Android11 3 #DevFest16 1 #DevFest17 1 #DevFest18 1 #DevFest19 1 #DevFest20 1 #DevFest21 1 #DevFest22 1 #DevFest23 1 #hack4jp 3 11 weeks of Android 2 A MESSAGE FROM OUR CEO 1 A/B Testing 1 A4A 4 Accelerator 6 Accessibility 1 accuracy 1 Actions on Google 16 Activation Atlas 1 address validation API 1 Addy Osmani 1 ADK 2 AdMob 32 Ads
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Redirecting to: https://fullystacked.net/modern-html-email
https://www.solidjs.com/
Build smaller, faster, and more secure desktop applications with a web frontend | Tauri Apps
same-site/cross-site, same-origin/cross-originをちゃんと理解する
