外部RSSを取得できません

###前提・実現したいこと
javascriptのみでrssを読みこむプログラムを作っています。

「jquery.xdomainajax.js」を使うと
クロスドメインを突破できることを知り、
導入をしてみたのですが、rssを取得できませんでした。

同一ドメインのrssでの読み込みは成功するのですが、
外部ドメインのrssになると読み込めませんでした。

環境は無料ブログです。なので、「.php」や「.htaccess」
は使えません。

外部のrssをどうしても読み込めなくて困っています。

###発生している問題・エラーメッセージ

外部のrssファイルを読み込めない。

###該当のソースコード
test.html

<html>
<head>
<meta http-equiv="Content-Style-Type" content="text/css" />
<meta http-equiv="Content-Style-Type" content="text/javascript" />
<link href="test.css" type="text/css" rel="stylesheet" />
<script type="text/javascript" src="http://www.google.com/jsapi"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script type="text/javascript" src="test.js" charset="shift_jis"></script>
<script type="text/javascript" src="jqueryxdomainajax.js"></script>
</head>
<body>
<div class="feedset1"><div id="feederogch0"></div></div>
<div class="feedset1"><div id="feederogch2"></div></div>
<div class="feedset1"><div id="feederogch4"></div></div>
<div class="feedset1"><div id="feederogch6"></div></div>
<div class="feedset1"><div id="feederogch8"></div></div><div class="clean"></div>
<div class="feedset1 feedset2"><div id="feederogch1"></div></div>
<div class="feedset1 feedset2"><div id="feederogch3"></div></div>
<div class="feedset1 feedset2"><div id="feederogch5"></div></div>
<div class="feedset1 feedset2"><div id="feederogch7"></div></div>
<div class="feedset1 feedset2"><div id="feederogch9"></div></div><div class="clean"></div>
</body>
</html>

test.js

var now = (new Date()).getTime();
function initialize()
{
	var myAry = ["feederogch0","feederogch1","feederogch2","feederogch3","feederogch4","feederogch5","feederogch6","feederogch7","feederogch8","feederogch9"];
	gazoiri("●●/?xml",myAry);
}
function gazoiri(flink,e)
{
	var tcontent = test(flink);
	tcontent.done(function(result)
	{
		var container = [];
		var icount = 0;
		for(var i = 0; i < e.length; i++){container[i] = document.getElementById(e[i]);}
		$(result).find("item").each(function()
		{
			var itm = $(this);
			var lnk = itm.find('link').text();
			var txt = itm.find('title').text();
			var im  = [];
			var dt  = [];

			itm.children().each(function()
			{
				im = itm.find('content\\:encoded').text();
			});			
			itm.children().each(function()
			{
				dt = itm.find('dc\\:date').text();
			});
			var htmlstr1 = [];
			var htmlstr2 = [];
			var entdate = new Date(dt).getTime();
			if(icount < 5)
			{
				if(entdate < now)
				{
					var img = get_img(im);//img取り出し用関数
					if(img == ''){img = imgTmp(img,30);}
					var title = cut_str(txt);//文字数調整用関数
					set_mozi(htmlstr1,1,lnk,txt,title);//html用に文字列を形成する関数
					set_mozi(htmlstr2,2,lnk,img,txt);
					set_html(container[icount*2],htmlstr1);//htmlに反映する関数
					set_html(container[icount*2+1],htmlstr2);
				}
			}
			icount++;
		});
	});
}
function test(flink)
{
	return $.ajax
	({
		type: 'GET',
		url: flink,
    });
}
function get_img(content)
{
	var img = '';
	var tmp1 = content.indexOf("src");
	if(tmp1 != -1)
	{
		var tmp2 = content.indexOf("\"",tmp1+5);
		if(tmp2 != -1)
		{
			var temp = content.slice(tmp1+5,tmp2);
			var imgT = new Image();
			imgT.src = temp;
			img = '<img src=' + temp;
		}
	}
	var img1 = img.indexOf("http://");
	if(img1 == -1){img = '';}
	return img;
}
function imgTmp(img,gazoNo)
{
	if(gazoNo == 30){img = '<img src="image/noimage.gif"';}
	return img;
}
function cut_str(title)
{
	if(title == ''){var tmp = '無題';}
	else
	{
		if(title.length > 15){var tmp = title.slice(0,15)+'…';}
		else{var tmp = title;}
	}
	return tmp;
}
function set_mozi(htmlstr,flag,str1,str2,str3)
{
	if(flag === 1)
	{
		htmlstr.push('◆<a href="');
		htmlstr.push(str1);
		htmlstr.push('" target="_blank" title="');
		htmlstr.push(str2);
		htmlstr.push('" >');
		htmlstr.push(str3);
		htmlstr.push('</a>');
		htmlstr.push('<br />');
	}
	else if(flag === 2)
	{
		htmlstr.push('<a href="');
		htmlstr.push(str1);
		htmlstr.push('" target="_blank">');
		htmlstr.push(str2);
		htmlstr.push(' alt="');
		htmlstr.push(str3);
		htmlstr.push('" /></a>');
	}
}
function set_new(htmlstr,str,entdate)
{
	var newmark = "";
	var pastTime = 86400000;
	if(now >= entdate && now <= (entdate + pastTime)){newmark ='<strong style="color:red">new!</strong>';}
	htmlstr.push(' ');
	htmlstr.push(changeDate(str));
	htmlstr.push(' ');
	htmlstr.push(newmark);
	htmlstr.push(' ');
}
function changeDate(str)
{
	var t1="/";
	var t2=":";
	var t3=" ";
	var myDate=new Date(str);
	var YY=myDate.getFullYear()-2000;
	var MM=myDate.getMonth()+1;if(MM<10){MM="0"+MM;}
	var DD=myDate.getDate();if(DD<10){DD="0"+DD;}
	var hou=myDate.getHours();if(hou<10){hou="0"+hou;}
	var min=myDate.getMinutes();if(min<10){min="0"+min;}
	var sec=myDate.getSeconds();if(sec<10){sec="0"+sec;}
	var date=YY+t1+MM+t1+DD+t3+hou+t2+min+t2+sec;
	return date;
}
function set_html(container,htmlstr){container.innerHTML = htmlstr.join("");}
google.setOnLoadCallback(initialize);

###試したこと
・「jquery.xdomainajax.js」を読み込む
・$.ajax内に「dataType:json」を追加したが、結果は読み込めませんでした。現在は外してあります。

###補足情報(言語/FW/ツール等のバージョンなど)
より詳細な情報

masaya_ohashi

2017/03/02 04:45

エラーメッセージがあればエラーメッセージも書いてください。あと、コードは```で囲むと見やすく整形されます。あと、RSSのURLを直接ブラウザで開くことができるか確認してください。

dandelion

2017/03/02 06:08 編集

回答ありがとうございます。RSSのURLは直接ブラウザで開けれます。エラーメッセージはFireFoxのデバッグで確認しても出ていないようです。しかし、ajaxで取得したオブジェクト内を確認しても空オブジェクトしか返してないようです。あと、コードが読みにくかったことに関してはすみませんでした。

masaya_ohashi

2017/03/02 05:03

https://developer.mozilla.org/ja/docs/Tools/Network_Monitor これで該当のRSS取得時にデータがどうなっているか確認して見てください。

dandelion

2017/03/02 05:43 編集

回答ありがとうございます。上記のURLに書いてあったネットワークモニターで該当のRSSファイルを開いて確認したところ、一つはステータス「200」を、もう一つはステータス「304」を返しておりました。

masaya_ohashi

2017/03/02 07:11

レスポンスの中身をネットワークモニターで確認してください。レスポンスの中身が空ならなにかアクセスに問題があり、中身があるならスクリプトのどこかに問題があることになります。

dandelion

2017/03/02 09:07

回答ありがとうございます。応答の確認はできております。中身も空ではないようなので、javascript内部に間違いがありそうです。もう少しプログラム内を確認したいと思います。

行動規範の内容に同意します

回答1件

ベストアンサー

読み込み順が逆では？

HTML
1<script type="text/javascript" src="jqueryxdomainajax.js"></script>
2<script type="text/javascript" src="test.js" charset="shift_jis"></script>

追記：

【Chrome デベロッパーツール Networkパネルの使い方 | Web Tips】
http://weback.net/utility/1491/

【JavascriptのChromeでのデバッグ方法個人的まとめ2016 - Qiita】
http://qiita.com/snoguchi/items/8f6bb62a3166eca23ac3#networknetworkで通信をチェック

投稿2017/03/02 05:48

編集2017/03/02 06:15

kei344

総合スコア69400

dandelion

2017/03/02 06:16 編集

回答ありがとうございます。ご指摘の通りに読み込み順を入れ替えてみたのですが、やはり外部RSSが読めませんでした。問題点がプログラムの別の場所にあるようです。

kei344

2017/03/02 06:16

result をconsole.log(result);として中身が返ってきているかは確認されましたか？

dandelion

2017/03/02 06:21

回答ありがとうございます。 ajaxの戻り値をFirFoxのデバッグで確認したところ、オブジェクトは帰っては来ていたのですが中身が空でした。

kei344

2017/03/02 06:32

【クロスドメインアクセスの最近 jquery.xdomainajax.js 読めないサイトあり？】 http://redv40.blogspot.jp/2014/09/jqueryxdomainajaxjs.html 上記のような記事もあるので、別のサイトなどでテストしてみてはいかがでしょうか。jquery.xdomainajax.js は内部的にYahoo!USAのYQLというサービスを利用しているので、それの仕様が変わった可能性もあるかもしれません。クロスドメインはPHPなどサーバ側言語で中継する方法で回避するほうが手早いと思います。

dandelion

2017/03/02 07:03

回答ありがとうございます。 PHPなどは試したいのですが、環境が無料ブログですので、「.php」や「.htaccess」が使えず、 jQueryのみで解決するしか方法がない状態です。

kei344

2017/03/02 09:02

無料ブログなのであれば、ファイルパスに問題は有りませんか？少なくとも jquery.xdomainajax.js が質問文では jqueryxdomainajax.js になっています。

dandelion

2017/03/02 09:13

回答ありがとうございます。「jquery.xdomainajax.js」が「jqueryxdomainajax.js」になっているのはネット上の公開ファイル「jquery.xdomainajax.js」をファイル保存した際に「.」が入っていると保存ができないためファイル名を変更しております。デバッグで確認しているので「jqueryxdomainajax.js」は読み込めている模様です。

kei344

2017/03/02 10:53

【RSS - 静的なページに(ワードプレスが入っていない)RSSを読み込みたい(67732)｜teratail】 https://teratail.com/questions/67732 こちらにYQLを直接たたく方法が提案されているのですが、一度試してみてはいかがでしょう。

dandelion

2017/03/02 11:02

ありがとうございます。試してみます。

dandelion

2017/03/19 07:25

kei344さんありがとうございました。教えていただいたページを参考に jquery.xdomainajax.jsを改造したところ正常に表示することができました。

行動規範の内容に同意します