Cloudflare、ヘッドレスブラウザ＋Puppeteerがすぐ使える「Workers Browser Rendering API」発表
Cloudflare、ヘッドレスブラウザ＋Puppeteerがすぐ使える「Workers Browser Rendering API」発表 Cloudflareは、同社が提供するCloudflare Workersの新機能として、ヘッドレスブラウザとそれをコントロールするPupeteerを呼び出せる「Workers Browser Rendering API」（以下、Browser Rendering API）のクローズドベータを発表しました。 We’re excited to announce a private beta of the Workers Browser Rendering API. With browser automation, you can programmatically do anything that a user can do when interactin
WebAssemblyランタイム「Wasmer 2.1」リリース。WASI用に仮想ファイルシステムを実装し、ブラウザでもWASIが利用可能に
WebAssemblyランタイム「Wasmer 2.1」リリース。WASI用に仮想ファイルシステムを実装し、ブラウザでもWASIが利用可能に 米Wasmer社はオープンソースのWebAssemblyランタイム「Wasmer 2.1」の正式リリースを2021年12月2日付けで発表しています。 Wasmer 2.1では、仮想ファイル機能を提供することでWebブラウザやNode.jsで互換性のあるWASI APIを実現、iOSへの対応などの強化が行われました。 BREAKING NEWS: Wasmer 2.1 released. Features added, bugs smashed, don't wait, try it now! - Wasmer-JS - Virtual Filesystem - iOS Support - Singlepass in Windows - Faster
Denoよどこへ行く - keroxpのScrapbox
最近めっきりDenoに触ってない。一言で言うと飽きてしまった。 とはいえどうなってるかくらいの情報は追っているのだが、どうも使いたいと言う気分にならない。 今自分はDenoコントリビューターではないのでいち開発者としての外から見たDenoの現状を語ってみる 最近のDenoはWeb標準に追従している 具体的には、fetch APIの実装に始まり、ブラウザに実装されているAPIの実装を頑張っている windowオブジェクトもあるし、webcryptoやWebGPUのような、ブラウザでも誰も使ったことのないようなAPIまで実装している 自分はどうもこの流れに乗れなかった この方針は現在のDenoコアチームの強い姿勢であり、最近JavaScriptの標準化団体であるTC39に参加したという だがDenoがサーバーサイドの言語である以上、ブラウザに存在する様々なブラウザ的問題を解決するための仕組みや
Progressive Web Appsの振り返りとこれから | gihyo.jp
Progressive Web Apps（以下、PWA）は2018年ごろからホーム画面へのインストール機能やキャッシュ戦略等の技術視点でエンジニアの間で話題に挙がるようになりました。現在ではWebパフォーマンス、ユーザビリティ向上、PoC（実証実験）といったビジネス視点でも注目されており、多くのWeb実装にPWAが取り入れられています。 今回の記事では、国内のPWAの動向を振り返り、改めてPWA開発のスタンダードとこれからのPWAについてまとめます。 日本国内でのPWAの動向 2015年にPWAという名称が生まれ、Google Chromeを始めとした各ブラウザが順次PWAに対応していきます。2018年にiOSのSafariがService Workerに対応したことををきっかけに国内でもPWAが注目され始めました。筆者もその頃からPWAに興味を持ち、2019年2月に立ち上がったTechコ
Node.js や deno に Web Standard な API をなんでも取り入れるのが良いことなのかについて - from scratch
この記事は Node.js Advent Calendar の 11 日目の記事です。 qiita.com Web API と Node.js ES2015 以前の Node.js は Web Standard な API の中で足りないものを自分で補う形で進化を続けてきた。 Callback や Event 主体での非同期処理や Common JS な形でロードできる独自のモジュールの仕組みがその筆頭だと思う。ただ逆に Web Standard な API が流行ると今度はそれに追従していかないといけなくなってきた。 ES2015 以後に流行ったものといえば、 Promise 主体での非同期処理であり、 async-await での処理だと思う。また、 ES Modules の台頭もあり、今日では Node.js でも普通に呼び出すことが可能になった。 今ではどちらも Node.js で
見ているサイト上に露出している機密情報(APIトークン、IPアドレスなど)を見つけるブラウザ拡張を作りました
見ているサイト上に露出している機密情報(APIトークン、IPアドレスなど)を見つけるブラウザ拡張を作りました SecretlintというAPIトークンなどの機密情報がファイル内に含まれているかをチェックできるツールを書いています。 Secretlintはコマンドラインツールとして動くので、主にCIやGitのpre-commit hookを利用して、リポジトリに機密情報が入るのを防止できます。 SecretlintでAPIトークンや秘密鍵などのコミットを防止する | Web Scratch 一方で、実際のウェブサービスなどは機密情報がファイルにハードコードされているわけではなく(Secrelint自体がこういうハードコードを防ぐツールです)、環境変数やDatabaseに保存していると思います。 このような場合にも、コードのミスなどによって公開するべきではない情報(秘密鍵、APIトークン、Sl
Firefoxは危険なJavaScriptに対応しない - Qiita
Firefox / Safari MozillaはMozilla Specification Positionsというリストを公開しています。 IETFやW3C、TC39などが提唱しているWeb技術に対して、Mozillaはどのように評価しているかという立ち位置を表明したものです。 あくまで現時点での評価であり、もちろん今後の仕様変更などに伴い評価は変わる可能性があります。 Mozilla's Positions Mozillaはどのように評価しているかの分類。 under consideration 評価の検討中。 important 優れた概念であり、Mozillaにとっても重要である。 worth prototyping 優れた概念であるが、プロトタイプを作成し、フィードバックを得て磨きをかける必要がある。 non-harmful 有害ではないが、良いアプローチではなく、取り組む価値
FLoC APIを試す
GMOアドマーケティングのT.Nです。 アドテク業界ではCookieレス時代に向けて、 各社対応を進めているところだと思いますが、 弊社でもGoogleのPrivacy Sandboxについて調査を行い、定期的に勉強会を開催しています。 勉強会でFLoCについての発表を担当したため、今回はそれを記事にしました。 今回の記事は全体的に以下のページを参考にしています。 https://web.dev/floc/ https://github.com/WICG/floc FLoCとは FLoCの目的は、 3rd Party Cookieやフィンガープリントなどで個人のプライバシーに関する情報を集めることなく、 興味・関心に基づく広告を実現することです。 FLoCはFederated Learning of Cohortsの略です。 Federated Learningとは 日本語では連合学習。
リソースの読み込みを助けるウェブブラウザ API の世界
ウェブブラウザはネットワークから様々なリソースを集め、それらを処理して組み合わせてウェブページをレンダリングします。リソースが揃わないとレンダリングできないので、この一連の処理のどこかが遅れるとページの表示も遅くなります。レンダリングをすみやかに開始できるようにウェブブラウザはリソースの取得やその処理を最適化するための API を提供しています。本記事ではそれらを網羅的に紹介し、ウェブアプリの性能改善を図る上でどのようなブラウザ機能が使えるのかを知ってもらうことを目的としています。各機能の具体的な適用事例については他の記事に委ねます。 本記事の内容は記事公開時点での情報に基づいており、閲覧時点では既に古くなっている可能性があります。最新の正確な情報は一次情報源を参照してください。また特定のブラウザ実装について言及する場合は、断りがない限り Chrome を想定しています。誤りや補足、質問な
Supabseチームはどのようにフロントエンドの高速化に成功したのか - バンクーバーで考え中
この記事は、Supabaseチームによる記事「Making the Supabase Dashboard Supa-fast」の和訳記事です。 Supabaseのダッシュボードは、この1ヶ月でより機能が充実しました。Monacoによる強力なSQLエディタを用意しました。私たちは、データベースのAirtableのようなビューを構築し、編集が簡単になりました。 機能・性能・DX-3つの選択 特にシングルページアプリケーションでは、新しい機能を追加すると、パフォーマンスがすぐに低下することがあります。ここでは、開発者の体験(DX)を損なうことなく、アプリケーション内で良好なベースラインパフォーマンスを保証するために行ったステップを紹介します。 ベースラインを確立し、目標を設定する。 測定できないものは直せない パフォーマンスを向上させるために、容易に解決できる問題がいくつかありましたが、その前に
WebRTC を今から学ぶ人に向けて
この資料には宣伝が含まれます ライセンス Creative Commons — 表示 - 非営利 - 改変禁止 4.0 国際 — CC BY-NC-ND 4.0 内容 これから WebRTC を学ぶ人が何を学ぶべきで、何は学ばないべきなのかを書く。定期的に更新していく。 趣味で学びたい人はターゲットに入っていません、仕事で利用する場合のみがターゲット。 まとめ 急がば回れで、W3C の資料を理解できるまで読み込む。 下手にフレームワークに依存したりして簡単な仕組みを覚えてしまうと後からツライ。 Media Capture and Streams WebRTC 1.0: Real-Time Communication Between Browsers Identifiers for WebRTC's Statistics API 作って学ぶも良いが、まずは出てくる単語などの意味を理解できるの
Promise のキャンセルについて - Qiita
[ English version ] JavaScript と Node.js についてのこの徹底した投稿では、Promises のキャンセルの歴史、なぜNode.jsに関係があるのか、そして async/await APIで使おうとしたときに注意すべきことについて学ぶことができます。 この投稿は、JavaScript の Promise API をよく理解していて、 Node.js の経験がある方のためのものです。 歴史 2014 年に Promise API がブラウザに導入されて以来、人々は Promise で他に何ができるかを調べていました。ブラウザに最初に登場した関連APIは、HTTP リクエストのための fetch() でした。 HTTP リクエストの問題は、サーバーのリソースを消費することであり、サーバーに送信されるリクエストの数が多い場合はお金がかかります。このため、特に
Async Clipboard APIでJavaScriptからクリップボードを操作する
JavaScriptからのクリップボードの操作は、長いあいだ開発者たちに切望されていました。かつてはFlashを使って実現するハックなどがありましたが、各ブラウザがexecCommandによるクリップボード操作を実装したことで、現在は落ち着きつつあります。 ただ、APIが綺麗に整備されているとは言いにくく、あまり現代的ではありません。そこで、スマートかつ現代的にクリップボードを扱うことができる、Async Clipboard APIの実装が進みつつあります。 Async Clipboard APIはその名の通り非同期でクリップボードを扱うAPIです。Async Clipboard APIはPromiseを返すので、直感的に扱えるようになっています。 従来のAPIでも、execCommandを用いることによってクリップボードを操作することができました。しかし、バグが多くブラウザ間の整合性が取
Safariは危険なJavaScriptに対応しない - Qiita
Firefox / Safari 先日Appleが、Safariは幾つかのWebAPIに対応しないと公言しました。 日本語記事も幾つか出ています。 しかし、どのサイトも対応しないAPIの一覧を並べてはいるのですが、それぞれのAPIが具体的にどのようなものなのかを記載した記事が見当たらなかったので、以下はそれらについて調べてみたものです。 対応しない理由 a threat to user privacy、すなわち、あくまでブラウザフィンガープリントなどの手段によって個人を特定・追跡できてしまうからという理由です。 セキュリティ的にも問題なAPIが並んでいるのですが、そちらは理由ではありません。 対応しないWeb API Web Bluetooth caniuse RFC 非公式日本語訳 解説 ブラウザからBluetoothを通して接続先のデバイスにアクセスすることができます。 データ転送形式
[サーバーサイドAPIデバッグ術]ブラウザのリクエストを簡単にリトライしてサーバーの挙動を見る方法 - Qiita
APIの開発してますか？挙動の確認を見る時どうしてますか？ curlを手書きしている？パラメータがないリクエストなら手軽で良いですね。 Postmanのようなツールを使っている？素晴らしい！ ブラウザで実際に画面を表示している？うーん…それって繰り返したいとき大変なんじゃ…… とはいえ、ブラウザで実際に画面を表示すると、パラメータの組み立てが非常に楽というメリットがあります。 認証情報付きリクエストとか組み立てるの大変ですもんね。 ここで、ブラウザのリクエストをそのまま繰り返したり、ちょっとだけパラメータを組み替えられたら便利だと思いませんか？ 今回はそんな方法を紹介します。 cURLでコピーしてリトライする Chromeの開発者ツール（Windows F12、Mac Cmd + Opt + I)を開いてネットワークタブを開いてください。 この状態で目的のページを開いてください。 Pres
![[サーバーサイドAPIデバッグ術]ブラウザのリクエストを簡単にリトライしてサーバーの挙動を見る方法 - Qiita](https://cdn-ak-scissors.b.st-hatena.com/image/square/84467c1b0e76683d1e14fbd4622fd1b2fb45d4f5/height=288;version=1;width=512/https%3A%2F%2Fqiita-user-contents.imgix.net%2Fhttps%253A%252F%252Fcdn.qiita.com%252Fassets%252Fpublic%252Farticle-ogp-background-412672c5f0600ab9a64263b751f1bc81.png%3Fixlib%3Drb-4.0.0%26w%3D1200%26mark64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTk3MiZoPTM3OCZ0eHQ9JTVCJUUzJTgyJUI1JUUzJTgzJUJDJUUzJTgzJTkwJUUzJTgzJUJDJUUzJTgyJUI1JUUzJTgyJUE0JUUzJTgzJTg5QVBJJUUzJTgzJTg3JUUzJTgzJTkwJUUzJTgzJTgzJUUzJTgyJUIwJUU4JUExJTkzJTVEJUUzJTgzJTk2JUUzJTgzJUE5JUUzJTgyJUE2JUUzJTgyJUI2JUUzJTgxJUFFJUUzJTgzJUFBJUUzJTgyJUFGJUUzJTgyJUE4JUUzJTgyJUI5JUUzJTgzJTg4JUUzJTgyJTkyJUU3JUIwJUExJUU1JThEJTk4JUUzJTgxJUFCJUUzJTgzJUFBJUUzJTgzJTg4JUUzJTgzJUE5JUUzJTgyJUE0JUUzJTgxJTk3JUUzJTgxJUE2JUUzJTgyJUI1JUUzJTgzJUJDJUUzJTgzJTkwJUUzJTgzJUJDJUUzJTgxJUFFJUU2JThDJTk5JUU1JThCJTk1JUUzJTgyJTkyJUU4JUE2JThCJUUzJTgyJThCJUU2JTk2JUI5JUU2JUIzJTk1JnR4dC1hbGlnbj1sZWZ0JTJDdG9wJnR4dC1jb2xvcj0lMjMxRTIxMjEmdHh0LWZvbnQ9SGlyYWdpbm8lMjBTYW5zJTIwVzYmdHh0LXNpemU9NTYmcz03NGM3ZTU3YzEwMjEzZGMwYTFmNDExNzI4ZjUxZDdlNA%26mark-x%3D142%26mark-y%3D57%26blend64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZoPTc2Jnc9NzcwJnR4dD0lNDBmcnVpdHJpaW4mdHh0LWNvbG9yPSUyMzFFMjEyMSZ0eHQtZm9udD1IaXJhZ2lubyUyMFNhbnMlMjBXNiZ0eHQtc2l6ZT0zNiZ0eHQtYWxpZ249bGVmdCUyQ3RvcCZzPTg2ODIyNjE3ODY1MjYwMTIxYjliOTFiNTFiOTkyMGM1%26blend-x%3D142%26blend-y%3D436%26blend-mode%3Dnormal%26txt64%3DaW4g5qCq5byP5Lya56S-44K544K_44OH44Kj44K544OI%26txt-width%3D770%26txt-clip%3Dend%252Cellipsis%26txt-color%3D%25231E2121%26txt-font%3DHiragino%2520Sans%2520W6%26txt-size%3D36%26txt-x%3D156%26txt-y%3D536%26s%3Da401d4ee46962c2773356684d5ff99b5)
Periodic Background Sync 及び Web を Install するということ | blog.jxck.io
Intro メールクライアントや RSS リーダーのようなユースケースを PWA で実装する場合、バックグラウンドで定期的にタスクを実行したいケースがある。 このユースケースに特化した API として提案されているのが、 Periodic Background Sync(PBS) だ。 しかし、この API を取り巻く議論は「Web にアプリのような API を持ち込む上での難しさ」を物語っている。 この API が Web において正当化できるかどうかは、 Project Fugu に代表される Application Capabilities を Web に持ち込む場合の試金石になりそうだ。 現時点での、仕様、実装、議論について解説する。 Periodic Background Sync Web で定期的なタスクを実行する場合、タブが開いていれば setInterval() などで行う
curlで覚えるWebDriver (1/2) | Folioscope
WebDriver について調べる機会があったので簡単にまとめました。 この記事では curl を使って、WebDriver によるブラウザ操作をしてみます。 WebDriver と Selenium の歴史 Selenium は現在最も広く使われている、Web ブラウザの自動化・テストフレームワークです。 多くの言語をサポートしており、Java や C#などの言語から、Web ページを開いたり要素の検証ができます。 そのため Web サービスの End-to-end (E2E) テストの自動化で主に利用されています。 Selenium 1 (Selenium RC) と呼ばれていた時代は、ブラウザを操作するために Selenium Core という JavaScript をブラウザ上でロードしてました。 しかしブラウザのセキュリティ強化により、Selenium Core の JavaSc
Real World HTTP 第2版
TOPICS Web 発行年月日 2020年04月 PRINT LENGTH 496 ISBN 978-4-87311-903-8 FORMAT PDF EPUB 本書はHTTPに関する技術的な内容を一冊にまとめることを目的とした書籍です。HTTPが進化する道筋をたどりながら、ブラウザが内部で行っていること、サーバーとのやりとりの内容などについて、プロトコルの実例や実際の使用例などを交えながら紹介しています。GoやJavaScriptによるコード例によって、単純なHTTPアクセス、フォームの送信、キャッシュやクッキーのコントロール、Keep-Alive、SSL/TLS、プロトコルアップグレード、サーバープッシュ、Server-Sent Events、WebSocketなどの動作を理解します。 第2版ではHTTP/3の規格化など、初版の発行後に起きたウェブ技術への変化にともなう内容のアップデ
牧歌的 Cookie の終焉 | blog.jxck.io
Intro Cookie は、ブラウザに一度保存すれば、次からその値を自動的に送ってくるという、非常に都合の良い仕様から始まった。 State Less が基本だった Web にセッションの概念をもたらし、今ではこれが無ければ実現できないユースケースの方が多い。 冷静に考えればふざけてるとして思えないヘッダ名からもわかるように、当初はこのヘッダがこんなに重宝され、 Web のあり方を変えるかもしれないくらい重要な議論を巻き起こすことになるとは、最初の実装者も思ってなかっただろう。 そんな Cookie が今どう使われ、 3rd Party Cookie (3rdPC) の何が問題になっているのかを踏まえ、これからどうなっていくのかについて考える。 Cookie のユースケース Web にある API の中でも Cookie はいくつかの点で特異な挙動をする 一度保存すれば、次から自動で送る
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
ブラウザ/セキュリティ/プライバシー周りの一次情報に近い二次情報の情報源をまとめたもの
