概要 原著者の許諾を得て翻訳・公開いたします。 英語記事: Randall Degges - Please Stop Using Local Storage 原文公開日: 2018/01/26 著者: Randall Degges 日本語タイトルは内容に即したものにしました。 画像は元記事からの引用です。 初版公開: 2019/10/19 追記更新: 2024/04/05 -- リンク情報を記事末尾に移動しました 本気で申し上げます。local storageを使わないでください。 local storageにセッション情報を保存する開発者がこれほど多い理由について、私にはさっぱり見当がつきません。しかしどんな理由であれ、その手法は地上から消えてなくなってもらう必要がありますが、明らかに手に負えなくなりつつあります。 私は毎日のように、重要なユーザー情報をlocal storageに保存す
他の投稿はこちら Webアプリの限界を超える方法 Webアプリの限界を超える方法(セキュリティ編) ブラウザでブラウザを操作してスクレイピングを行う Webブラウザでシリアル通信を行う ブラウザでICカードを読み込む場合、IEでActiveXを使用し、FeliCaリーダーに接続する方法が一般的です。 また最近では、WebUSBでFeliCaリーダーに接続する方法も出てきました。 今回は、WebUSBもActiveXも使用せずに、ブラウザからFeliCaリーダーに接続する方法を紹介します。 概要 構成は以下の通りです。 FeliCaリーダーを読み込むネイティブアプリを作成する ネイティブアプリ上でWebSocketサーバーを立ち上げる ブラウザからネイティブアプリのWebSocketサーバーにローカルホスト接続する ネイティブアプリでFeliCaリーダーからICカードを読み込み、WebSoc
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? 他の投稿はこちら Webアプリの限界を超える方法(セキュリティ編) ブラウザで(WebUSBもActiveXも使わずに)FeliCaリーダーを読み込む ブラウザでブラウザを操作してスクレイピングを行う Webブラウザでシリアル通信を行う Webアプリの限界 経験豊富なwebプログラマなら、Webでは実現困難な機能を知っているでしょう。 ローカルの特定のパスに存在するファイルを自動的にアップロードしたい、 ブラウザからクローラーを起動して情報収集したい、などなど。 Webをよく知らない顧客や、技術不足のSEがそんな機能を開発しろと言い出し
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? Webでのプッシュ技術 HTTPはクライアント（ブラウザ）からリクエストしてサーバからレスポンスが返る一問一答型のプロトコルなので、基本的にはサーバ側からブラウザに新着情報をリアルタイムで通知（プッシュ）できるようにはできていません。 しかしそれでもプッシュをしたいという場合にどうするかという話が出てきます。やり方には以下のようなものがあります。 ポーリング クライアントからサーバに定期的に新着を問い合わせるようにします。 最も原始的かつ確実なやり方。欠点は、最大でポーリング間隔の分だけ通知が遅延しうることです。 ロングポーリング（“C
Photo by slavik_V こんにちは。谷口がお送りします。 Webの仕事を目指している人やプログラミング初心者、さらにはブログをやっている人など、HTMLとCSSを習得したい人は多いと思います。特に最初は「Webサイトを作ってみたいけどどうしたらいいんだろう……」「自分のブログを豪華にしてみたいんだけど、HTMLっていまいちよく分からない……」など、さまざまな悩みがあるのではないでしょうか。 HTMLとは、Webページを作成する時に使用されるマークアップ言語の一つです。 マークアップ言語とは、プログラミング言語と違い「タグ」を使って、「ここからここまでが見出しです」「ここからここまでが一つの段落です」等といった印をつける言語です。基本的にプログラミング言語のような「入力値を取得し計算処理をする」「条件を満たすまで処理を繰り返す」といった処理や計算はできません。 CSSは、Webペ
Service Workersでプッシュ通知を受信できるようになったわけですが([1]: GCM)([2]: Web Push)、Chromeではバージョン48まではGCMで通知だけができるようになっただけで、メッセージ本体は通知を受けてからService Workerでサーバから改めて受け取るような実装をする必要があったりします。 ここで、Service Workersでは、XMLHttpRequestが使えません。その代わり、XMLHttpRequest (以下、XHR)に代わるWHATWGの仕様としてFetch APIがあり、Service WorkersではこのFetch APIを使うことになっていますので、その使い方を簡単に紹介します。 Fetch API自体は、Service Workers専用のものではなく、メインスレッドでもXHRの代わりに使うことが可能です。現時点で実装し
HTML5(Canvus)、Javascript向けの画像処理ライブラリについてまとめたので紹介します。 続きを読む
WebRTCセキュリティレポート あらまし WebRTC(Web Real-Time Communication)は、Webアプリケーション技術の昨今のトレンドの一つだ。WebRTCを利用すると、プラグイン無しで、また他の条件も無しでリアルタイムコミュニケーションを実現できる。だが、そのオープンソースとして性質から、WebRTCを採用しようとする人がセキュリティ上の不安を覚えることもあるだろう。本レポートはWebRTCのセキュリティについて明らかにし、他の技術と比較してWebRTCのセキュリティが優れていることを解説する。 1. 導入 WebRTCはオープンソースのWebベースの技術であり、ユーザがリアルタイムメディア通信を、プラグイン無しで実現可能な技術だ。適切なブラウザを利用すれば、ウェブサイトをブラウズするだけで、他者に発信して通話することができる。 WebRTCの主なユースケースは
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? はじめに Webで使えるビデオチャットサービスを開発しましたので、システム構成や使用したフレームワークやサービス、開発のポイントなどまとめてみました。 (去年にはQiitaの投稿を作っていたのですが、下書き保存したまま忘れて今頃の投稿になってしました。。) 月々のランニングコストは1000円以内、開発工数は1人月以内で作成しています。 WebRTCが出てきたおかげで、かなり容易にビデオチャットサービスが開発できるようになっていますので、よければ参考にしてください。 開発のポイント、コードだけでなく、開発の動機から、システム構成を決める為
1. Copyright © NTT Communications Corporation. All right reserved. 第15回 HTML5+JS 勉強会 WebRTC⼊入⾨門+最新動向 ~本格的な普及が始まる前にマスターしておこう~ NTTコミュニケーションズ株式会社 技術開発部 Webコア Technical Unit ⼤大津⾕谷 2015年年7⽉月 2. Copyright © NTT Communications Corporation. All right reserved. ⾃自⼰己紹介 / ⼤大津⾕谷 亮亮祐（おおつや りょうすけ） n NTTコミュニケーションズの HTML5チームのリーダ n WebRTCプラットフォーム “SkyWay”のプロダクトマネージャ n WebRTC Conference Japan 幹事 n
ブラウザでWebGLが使えるようになって3DCGプログラミングはずいぶん身近なものになりました。と書いてるそばから違和感を感じるくらい生のWebGLをJavaScriptで書くのは敷居が高かったりします。できなくはないけど前提となる知識がかなり必要な感じ。 three.jsが登場したときは、これで普通に3DCGができるということで一気にひろまりました。とはいえ、それでもまだやることは多く、画面に四角い箱を表示する場合以下のようなプログラムを書くことになります。 ・シーンを作成 ・ライトを作成、位置と向きを設定、シーンに追加 ・カメラを作成、位置と向きを設定、シーンに追加 ・マテリアルを作成、色を指定 ・BoxGeometryを作成、サイズを指定 ・メッシュを作成、位置と向きを設定、シーンに追加 ・レンダラーを作成 ・レンダリングループ処理 これらのひとつでも間違えたりパラメーターが適切でな
こんにちは。 福岡でグルー株式会社というスタートアップをやっている迫田（さこだ）です。 先日公開された第一回目の記事では、主に簡単な会社紹介と弊社でのさくらのクラウドの使い方をご紹介させて頂きましたが、皆様ご覧頂きましたでしょうか？まだの方は是非ともご覧くださいね！ さて、先日「1meeting（ワンミーティング）」というウェブブラウザのみでビデオチャットが簡単に出来るサービスをリリースしました。今回はこのサービスの裏側で何をやっているのか、技術的な部分をご紹介したいと思います。 1meetingとは まずはこの1meetingというサービスですが、専用ソフトのインストール不要、プラグイン等のインストール不要、ユーザー登録、ログインも不要、とにかく簡単にインスタントなビデオチャットが始められるサービスとしてリリースしました。 また、相手端末との接続がP2Pになっているため、中間のサーバを経
はじめに まだ実験中なのですが、Unity WebGL x WebSocket で大量のクライアント間で大量のオブジェクトを同期できる仕組みを作っています。UNET や Photon によって近いうちに対応されると思うのですが、現状では使えないのと、制限なく扱えたりチューニング次第で速く出来る可能性があるので作ってみようと思いました。 昨日、技術デモを公開しまして、最大で同時に 30 〜 40 人ほどの方に同時に遊んでもらいました。皆様ありがとうございました！200 オブジェクトくらいならフレーム落ちすること無くサクサク動いたと思うので、現状の仕組みや知見などを備忘録も兼ねて共有できればと思います。 開発環境 Mac OS X 10.10.1 Unity 5.0.0b18 デモ いつ止めるかは未定ですが、以下から遊ぶことが出来ます。 hecom.in - このウェブサイトは販売用です！ -
This post is a No.12 article of WebRTC Advent Calendar 2014 この記事は、WebRTC 2014 アドベントカレンダーの12日目の記事です。 TL;DR RTCPで通信状況（統計情報）を送受信側で伝え合って、音声・映像の品質にフィードバック 特にWebRTCでは、RTCPを暗号化したSRTCPを利用 はじめに WebRTC Meetup Tokyo #3で、WebRTCを支えているプロトコルについて、簡単なLTをしました。 LTの中でDTLS、RTP、SCTPについて喋ったのですが、LTという時間の都合上、説明を端折ったところがあるので、本記事ではその補足をします。 ちなみに、資料は以下にあります： RTPは再送を諦めているだけじゃない Slide27枚目で、パケットロスが起きた場合の対応として、「再送をGiveUp」すると説明
This Version: https://www.w3.org/TR/2018/SPSD-html5-20180327/ Latest Published Version: http://www.w3.org/TR/html5/ Latest Version of HTML: http://www.w3.org/TR/html/ Latest Editor's Draft of HTML: http://www.w3.org/html/wg/drafts/html/master/ Previous Version: http://www.w3.org/TR/2014/REC-html5-20141028/ Previous Recommendation: http://www.w3.org/TR/1999/REC-html401-19991224/ Editors: WHATWG: Ia
W3Cが発表したプレスリリース（日本語）の冒頭を引用します。 2014年10月28日(アメリカ)： ワールド・ワイド・ウェブ・コンソーシアム(W3C)は、ウェブページやウェブアプリケーションを構築する際に使用されるフォーマットHTMLの第5版であるHTML5を勧告として公開し、オープン・ウェブ・プラットフォームの礎を築きました。HTML5は、アプリケーション開発者やアプリケーション産業がこの先何年に渡って信頼するに足る、アプリケーション開発のための機能を提供します。HTML5は今や幅広いデバイスで、そして世界中のユーザが利用可能であり、かつ豊富な機能を持つアプリケーションの開発コストを削減します。 W3Cディレクターを務めるティム・バーナーズ＝リーは、「ビデオやオーディオをブラウザ上で見たり、ブラウザ上で通話をすることは、今や当然の事として受け止められている」と述べています。「写真や店舗の
WebRTCにおけるNAT越えの課題へのアプローチ - Qiita に移転しました。
13. Over The Top 手段の例 市場 ユーザ メリット 事業者 メリット 利用方法 Skype, WebEx (YouTube, Ustream) キャリアに縛られない独自の仕組みを 提供する少数のベンダーが参加可能 世界中の人と無料/安価で会話できる 限定的なAPI提供 一部連携可能 ユーザが組み合わせて利用 http://www.slideshare.net/mganeko/2013-web-rtctechcross/6 より改変して引用 15. キャリア型通信 Over The Top Webブラウザ型 手段の例 市場 ユーザ メリット 事業者 メリット 利用方法 固定電話 携帯電話 (TV放送) Skype, WebEx (Youtube, Ustream) WebRTC インフラを持つ キャリアが支配 キャリアに縛られない 独自の仕組みを提供 する少数のベンダー が参
概要 分散ハッシュテーブルの実装の一つである Chord を WebRTC を用いて実装しました。 tsujio/webrtc-chord - GitHub Chord とは Chord は分散ハッシュテーブル (DHT: Distributed Hash Table) の実装の一つです。 分散ハッシュテーブルはその名の通りハッシュテーブルを分散して管理するものであり、P2P においては例えばファイル共有ソフトで「あるファイルを提供しているノードはどれか」といった情報をピア間で分散管理し高速に検索できるようにする用途で利用されています。 Chord の解説としては以下のスライドが分かりやすいです。 ChordアルゴリズムによるDHT入門 webrtc-chord その分散ハッシュテーブルの実装の一つである Chord を、Web ブラウザー間で P2P 通信を行う機能を持つ WebRTC
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
