<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>Tender Surrender &#187; JavaScript</title>
	<atom:link href="http://devlog.agektmr.com/en/archives/tag/javascript/feed" rel="self" type="application/rss+xml" />
	<link>http://devlog.agektmr.com</link>
	<description>SocialWeb Evolves</description>
	<lastBuildDate>Mon, 05 Jul 2010 05:13:06 +0000</lastBuildDate>
	<generator>http://wordpress.org/?v=2.9.1</generator>
	<language>EN</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<atom:link rel="hub" href="http://pubsubhubbub.appspot.com"/><atom:link rel="hub" href="http://superfeedr.com/hubbub"/>		<item>
		<title>Footprint gadget for your FriendConnect</title>
		<link>http://devlog.agektmr.com/en/archives/325</link>
		<comments>http://devlog.agektmr.com/en/archives/325#comments</comments>
		<pubDate>Wed, 07 Jan 2009 16:07:32 +0000</pubDate>
		<dc:creator>Eiji</dc:creator>
				<category><![CDATA[FriendConnect]]></category>
		<category><![CDATA[Google]]></category>
		<category><![CDATA[Mac]]></category>
		<category><![CDATA[OAuth]]></category>
		<category><![CDATA[OpenSocial]]></category>
		<category><![CDATA[SocialWeb]]></category>
		<category><![CDATA[Widget]]></category>
		<category><![CDATA[JavaScript]]></category>

		<guid isPermaLink="false">http://devlog.agektmr.com/en/?p=325</guid>
		<description><![CDATA[
topsyWidgetPreload({ "url": "http%3A%2F%2Fdevlog.agektmr.com%2Fen%2Farchives%2F325", "style": "big", "title": "Footprint gadget for your FriendConnect" });
I developed FriendIntroducer as an experiment and was trying to understand how FriendConnect is different from ordinaly OpenSocial implementation. So this time, I&#8217;ve tried to develop a gadget which you can find FriendConnect interesting, Footprints. You know the idea if you&#8217;ve tried MyBlogLog before.
What [...]]]></description>
			<content:encoded><![CDATA[
<div class="topsy_widget_data topsy_theme_light-green" style="float: left;margin-right: 0.75em; background: url(data:,%7B%20%22url%22%3A%20%22http%253A%252F%252Fdevlog.agektmr.com%252Fen%252Farchives%252F325%22%2C%20%22style%22%3A%20%22big%22%2C%20%22title%22%3A%20%22Footprint%20gadget%20for%20your%20FriendConnect%22%20%7D);"><script type="text/javascript">topsyWidgetPreload({ "url": "http%3A%2F%2Fdevlog.agektmr.com%2Fen%2Farchives%2F325", "style": "big", "title": "Footprint gadget for your FriendConnect" });</script></div>
<p>I developed <a href="http://devlog.agektmr.com/archives/310">FriendIntroducer</a> as an experiment and was trying to understand how FriendConnect is different from ordinaly OpenSocial implementation. So this time, I&#8217;ve tried to develop a gadget which you can find FriendConnect interesting, Footprints. You know the idea if you&#8217;ve tried MyBlogLog before.</p>
<h2>What is Footprints?</h2>
<p>Footprints is a gadget to track visitor of you blog. Look at the gadget on bottom left of this blog.&nbsp;If you&#8217;re not joined or signed in, do it to check what it does.</p>
<p>Footprint is a pretty popular idea on japanese social networks. Once upon a time, SNS were all closed and it was difficult to find people you may know. Footprint functionality was a good tool at that time to find who&#8217;s interested in you.</p>
<p><img width="223" height="211" class="alignnone size-full wp-image-326" title="Footprints1" src="http://devlog.agektmr.com/wp-content/uploads/2009/01/e38394e382afe38381e383a3-5.png" alt="Footprints1" /></p>
<p>As you could imagine, this gadget records visitor and its time. When viewed by others, timestamp will be displayed how long ago, you&#8217;ve visited. Also, you can remove your own footprint if you want.  The xml is located at:</p>
<p><a href="http://devlab.agektmr.com/OpenSocial/FriendConnect/Footprints.xml" target="_blank">http://devlab.agektmr.com/OpenSocial/FriendConnect/Footprints.xml</a></p>
<p>Feel free to take it and use it on your blog.</p>

]]></content:encoded>
			<wfw:commentRss>http://devlog.agektmr.com/en/archives/325/feed</wfw:commentRss>
		<slash:comments>4</slash:comments>
		</item>
		<item>
		<title>Cajaとは何か</title>
		<link>http://devlog.agektmr.com/en/archives/49</link>
		<comments>http://devlog.agektmr.com/en/archives/49#comments</comments>
		<pubDate>Tue, 22 Apr 2008 16:26:50 +0000</pubDate>
		<dc:creator>Eiji</dc:creator>
				<category><![CDATA[OpenSocial]]></category>
		<category><![CDATA[Caja]]></category>
		<category><![CDATA[JavaScript]]></category>
		<category><![CDATA[Shindig]]></category>

		<guid isPermaLink="false">http://devlog.agektmr.com/en/?p=49</guid>
		<description><![CDATA[
topsyWidgetPreload({ "url": "http%3A%2F%2Fdevlog.agektmr.com%2Fen%2Farchives%2F49", "style": "big", "title":  [...]]]></description>
			<content:encoded><![CDATA[
<div class="topsy_widget_data topsy_theme_light-green" style="float: left;margin-right: 0.75em; background: url(data:,%7B%20%22url%22%3A%20%22http%253A%252F%252Fdevlog.agektmr.com%252Fen%252Farchives%252F49%22%2C%20%22style%22%3A%20%22big%22%2C%20%22title%22%3A%20%22Caja%E3%81%A8%E3%81%AF%E4%BD%95%E3%81%8B%22%20%7D);"><script type="text/javascript">topsyWidgetPreload({ "url": "http%3A%2F%2Fdevlog.agektmr.com%2Fen%2Farchives%2F49", "style": "big", "title": "Cajaとは何か" });</script></div>
<p>OpenSocial周りの調査をしていると、Cajaという言葉に遭遇します。セキュアなJavaScriptを実現するもの、ということだけ分かっていたのですが、詳細を調べてみました。</p>
<h2>クロスサイトスクリプティングとブログパーツ</h2>
<p>gooやlivedoor、fc2などのホスティングを含めたブログサービスを使ったことのある方はご存知と思いますが、サービスによってブログパーツが貼れるもの、貼れないもの、一部だけ許可しているものがあります。なぜでしょうか？</p>
<p>Cookieには同一ドメインから実行されたスクリプトしか参照できないという特徴があります。これを利用して、Cookieをセッション情報や閲覧履歴の保存場所として活用しているサービスは少なくありません。上記ブログサービスがブログパーツを許可しないのは、これらの情報を悪意のあるJavaScriptから守るためです。逆に言うと、同一ドメイン上でJavaScriptが実行できれば、そのセッション情報や閲覧履歴を盗むことができてしまいます。これをXSS(クロスサイトスクリプティング)と言います。</p>
<p>XSSが発生するのは、投稿フォームを使って、そのドメイン上のページにJavaScriptを埋め込み、実行できるケースが挙げられますが、ブログパーツが貼れること自体もJavaScriptが埋め込めるという意味では同じであり、まともに作られたサイトであれば、まずこういったことは出来ません。</p>
<p>とはいえ、実際にブログパーツを貼付けることができるブログは存在しますし、セキュリティの問題を回避しつつこれを実現するためのアプローチがいくつか存在します。</p>
<h2>JavaScriptを貼付けるためのアプローチ</h2>
<h3>ドメインを分ける</h3>
<p>ブログを表示するドメインをセッション情報等のクリティカルなCookieを保存していないものにしてしまいます。盗むものがなければ、泥棒が入ったところで何も困ることはありません。このアプローチをとっているものにはlivedoorブログが挙げられます。</p>
<h3>安全性の確認できたJavaScriptのみ許可する</h3>
<p>サービス提供者が安全なブログパーツのリストを作り、ブログ管理者がそこから選ぶ、というアプローチです。ブログパーツの選択肢が狭くなるためユーザーには好まれませんが、全く貼れないよりはよいはず。gooブログやはてなダイアリがこのアプローチをとっています。</p>
<h3>iframeで表示する</h3>
<p>iframe内に別ドメインで表示してしまえば、上記「ドメインを分ける」と同様に扱うことができます。このアプローチを取っているものにiGoogleが挙げられます。iGoogleはブログではありませんが、ブログパーツ=ガジェットと捉えれば同じ問題を扱っていると言えます。</p>
<h3>JavaScriptの危険な部分を無力化する</h3>
<p>サーバーがJavaScriptを出力する前に危険な部分を書き換え、無力化してしまいます。このアプローチをとっているブログがあるか知りませんが、やり方としては誰でも思いつくのではないでしょうか。ただ、これを実現するためには膨大な労力と知識が必要となります。これがオープンソースで存在しているとすれば、どんなに素晴らしいでしょう。そして、これを実現することができるのが今回紹介する、Cajaです。</p>
<h2>Cajaで実現できること</h2>
<p>Cajaはカハと読みます。CajaはGoogleのオープンソースプロジェクトの名前で、これを使うことで、同一ドメイン上のページに安全に外部のJavaScriptを貼付けることが可能になります。</p>
<p><a href="http://devlog.agektmr.com/wiki/index.php?JavaScript%2FCaja" target="_blank">Caja紹介(日本語訳)</a></p>
<p><a href="http://code.google.com/p/google-caja/wiki/AttackVectors" target="_blank">開発に当たってCajaを使って防がれるべきとされた攻撃方法の一覧</a></p>
<h2>どこでCajaを使うのか</h2>
<p>CajaはOpenSocialコンテナ上での利用を想定して作られているようです。<a href="http://devlog.agektmr.com/wiki/index.php?JavaScript%2FCaja" target="_blank">Caja紹介(日本語訳)</a>の説明も、Shindigでアプリケーションを利用することが前提となっており、Cajaを使ってガジェットをインラインで表示した方がパフォーマンスが向上する旨が記載されています。</p>
<h2>Cajaの形態</h2>
<p>実はここがまだ調べきれていない部分なのですが、どうやらJavaによるサーバーサイドでのリライトと、JavaScriptのライブラリで構成されている、ぽいです。この辺はもう少し調べる必要がありそうです。</p>
<p>何か他に情報をお持ちの方がいらっしゃいましたらぜひ、教えてください。</p>

]]></content:encoded>
			<wfw:commentRss>http://devlog.agektmr.com/en/archives/49/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>
