2011-09-15 10 views
0

私のウェブページ上の他のサイトからの画像のコラージュを表示しようとしています。 img srcを設定できるので、直接リンクを知っていればうまく動作します。しかし、私はページの名前とそのページ上の画像のIDを知っている場合、srcを取得するためにいくつかのjQuery呼び出しを行うことができます。idによるドメイン間の要求

このような何かが、別のページで呼び出さ:ありえないが、このために設計されたJavaScriptの

var imageSource = $("#pictureid").attr("src"); 
+0

あなたはhttp://easyxdm.net/wp/を試すことができますが、あなたのケースでうまくいくかどうかわかりません。 – newbie

答えて

0

あなたが望むのは、他のサイトへのAJAX呼び出しをHTMLに挿入してから、それを調べてimgタグのsrc属性を探してみることです。すべての最新のブラウザには、これを禁じていますが、現在のドキュメントのドメイン外のものにAJAX呼び出しを行うことはできません(つまりexample.orgのページで実行されているスクリプトはfoobar.comにAJAX呼び出しを行うことはできません)。

これは、サーバー側の手法に頼らざるを得ないことを意味します。サーバー側の言語では、外部ページからHTMLをロードします(ほとんどの環境にはlibcurlへのバインディングがあります)それを解析して画像を見つける。 URLを取得したら、動的HTMLに簡単に挿入できます。

これは、権限のない種類の画像がネチケットに違反していることを示しています。あなたの管轄に応じて、違法である可能性もあります(あなたの訪問者に帯域幅を提供するために他人のサーバーを酷使している、いくつかの管轄区域で違法なハッキングの定義に該当するかもしれないもの)。いいことは、画像自体を引き出し、自分のサーバーでコピーをホストすることで、独自の帯域幅を使ってそれを提供することです。もちろん、あなたが使用する画像の著作権およびライセンス条項を尊重します。

+0

法的な情報をありがとう、私はまだ考えていなかった何か。プロジェクトは実際にはブラウザ拡張であるので、htmlはサーバー上ではなくクライアント側でホストされます。私は物事をクライアントの側に保つことを試みているこれを考える。クライアントから直接アクセスするのではなく、Webページにアクセスするためにサーバーを経由するのは不思議です。 – Bnicholas

+0

javascriptがブラウザエクステンションで実行されている場合、同じ起源ポリシーはそれほど厳密ではないかもしれませんが、実際に何かを伝えるにはあまり経験がありません。あなたはそれを取り除くことができるかもしれません。 – tdammers

+0

Chrome拡張APIを使用すると、これらのことが本当に簡単になります。 – Bnicholas

0

クライアント側。何をしたいのですか?これはいくつかの方法で行うことができます。最も簡単なのはYahooのYQLやNode.JS、PHP、またはあなたの好みのサーバサイド言語を使用する他の方法です。

0

いいえ、サイトに画像を含める場合は、そのURLを指定する必要があります。

0

はこのような何か試してみてください:

最初にAJAXが同一生成元ポリシーによって妨げられるので、私たちは、私たちの要求をバウンスするために、短サーバー側のスクリプトが必要になります。 PHPには次のようなものがあります:

<?php if (isset($_GET['url'])) readfile($_GET['url']); ?> 

これはget.phpに保存されているとします。それを使用するには、取得するページのURLを指定してクエリ文字列のurlフィールドを設定します。スクリプトは、そのページからすべてのHTMLを取得して出力します。たとえば、get.php?url=http://stackoverflow.com/は、stackoverfllowのインデックスページのすべてのHTMLを取得します。

次に、urlで指定された画像のsrcを取得するjQueryを作成しましょう。このように:

var url = 'http://www.pics.com/'; 
var selector = '#pic8'; 

$.get('get.php', { url: url }, function(htmlResponse) { 
    var pic = $(htmlResponse).find(selector); 
    alert(pic.attr('src'); 
}, 'html'); 

これでうまくいくはずです。

関連する問題