livedoor相互RSSをSSL対応させる方法を教えちゃいます(後編)

妹さえいればいい。 可児那由多 変態さん 20171119-Kani-Nayuta_s.jpg

SSL化のためにこんなところまで来るなんて…
あなたは本当に変態さんですね。





livedoor相互RSSが正式にSSL化されました。


 2018年1月31日にlivedoor相互RSSが正式にSSL化されたことが発表されていました。

livedoor 相互RSSがSSL化(https化)に対応しました|livedoor 相互RSS 開発日誌

いつもlivedoor 相互RSSをご利用いただきまして誠にありがとうございます。このたび、SSL化(https化)の対応が完了しましたのでお知らせします。SSL化(https化)されたタグを取得したい場合は、チャンネルごとに「貼付けコード」を再取得されるか、タグの中にあるURLの


 本記事に記載されている設定・変更を行わなくても、タグコード変更にてSSL化を行うことができます。
 詳細は上のブログカードリンク先を参照してください。
 なお、本記事自体は削除せず、SSL移行過渡期における時代のアダ花的記録として残しておくことにします。

Google Apps Scriptでの暫定SSL化を行っていただいた方へ
 前編記事にて作成したグーグルドライブ上のアクセスファイルを削除する際には、まず起動トリガーを解除するようにしてください。

 具体的な手順については下ブログカードの記事を参考にしていただけるようお願いします。

livedoor相互RSSが正式にSSL化されました。 | 富士宮で貯蓄と資産運用

livedoor相互RSSが正式にSSL化。 先日ブログリンクを追加しようと思ってlivedoor相互RSSにアクセスしたら、2018年1月31日にlivedoor相互RSSが正式にSSL化lされたことが発表されていました。全然知らんかったわぁ。全く連絡ぐらいよこせっちゅーの!!



livedoor相互RSSのSSL対応


 livedoor相互RSSをSSL対応させるためのシステムは下図のようになっています。

ライブドア相互RSS基本システム2


 システムとしては大きく以下の2つに分かれています。

(A)Cronのように定期的スクリプトを起動させることができる「Google Apps Script」を使って、livedoorサイトに記録されている"roll_data.js"を1時間ごとにグーグルドライブ上にコピーします。

(B)FC2ブログ上にアップロードした"改造版blogroll.js"がグーグルドライブ上にコピーされている"roll_data.js"を呼び出します。


 今日は一昨日の前編に続き、システムB構築のための"改造版blogroll.js"の作成と、FC2ブログへのSSL対応livedoor相互RSSの実装方法を紹介していきます。


1.blogroll.jsのダウンロード


 "改造版blogroll.js"のマスターファイルとなるblogroll.jsをダウンロードします。

(1)下のリンクをクリックしてblogroll.jsにアクセスします。
   http://blogroll.livedoor.net/js/blogroll.js



(2)blogroll.jsを保存します。
  <Google Chromeの場合>
   blogroll.jsがプレビュー表示されるので、
   右クリック→【名前を付けて保存】で適当な場所に保存します。

SSL対応02-blogrollの保存(GC)



  <IEの場合>
   ダウンロードウィンドウが表示されるので、
   保存【▼】をクリック→【名前を付けて保存】で適当な場所に保存します。

SSL対応02-blogrollの保存(IE)




(3)相互RSS表示用のCSSファイルをカスタマイズせずにlivedoorサイトから呼んでいる場合は、同様にCSSファイルを(1)(2)の手順でダウンロードしておきます。
   http://blogroll.livedoor.net/css/default2.css

2.改造版blogroll.jsの作成


(1)ワードパッドやテキストエディタで保存したblogroll.jsを開きます。



(2)roll_data.jsへのアクセス部分を、前編記事でメモしておいたグーグルドライブ上のリンクアドレスに変更します。(下のリストの6~8行目)
(function() {
var script = document.createElement('script');
// XXXX get from document.getElementsByTagName('script').pop().src ????
var host = (typeof blogroll_roll_host == 'undefined') ? "http://blogroll.livedoor.net/" : blogroll_roll_host;

// script.src = host + chid + "/roll_data";
// ↓ グーグルドライブ上roll_data.jsへのリンクアドレスに変更
    script.src = "https://drive.google.com/uc?export=download&id=・・・・";

if (typeof blogroll_is_preview != "undefined") {
script.src += "?is_preview=1";
}



(3)livedoorサイトにアクセスログを記録している部分があるので、そこを先頭に//を付けてコメント化します。(下のリストの14・15・26・27行目の4箇所)
    Blogroll.prototype.add_tracking = function(a, item) {
var channel_id = this.id;
if (typeof blogroll_is_preview != "undefined") {
return;
}
var call_url = this.roll_host + "click_js" +
'?c=' + channel_id +
'&f=' + item.feed_id +
'&url=' + encodeURIComponent(item.entry_link) +
'&sig=' + item.sig +
'&title=' + encodeURIComponent(item.entry_title);

var log_click = function (ev) {
//コメント化 var log_img = document.createElement('img');
//コメント化 log_img.src = call_url + '&_=' + (new Date()).getTime();
};

if (a.addEventListener) {
a.addEventListener('click', log_click, false);
} else if (a.attachEvent) { // for IE
a.attachEvent('onclick', log_click);
}
};

Blogroll.prototype.show_log = function() {
//コメント化 var log_img = document.createElement('img');
//コメント化 log_img.src = this.roll_host + 'img/blank.gif?channel_id=' + this.id;
};



(4)"xxxxxx_blogroll.js"といった別ファイル名で保存します。
   ※xxxxxxには相互RSS貼付コードのID番号を当てておく判別しやすくなります。


3.FC2ブログへのSSL対応livedoor相互RSSの実装


(1)FC2ブログにログインして管理画面を開きます。



(2)先程作成した"xxxxxx_blogroll.js"をアップロードします。
   ※CSSをダウンロードしてきている場合はCSSファイルもアップロードします。



(3)livedoor相互RSSが貼り付けられているプラグインの編集画面を開き、以下のようにコード変更して保存します。(下のリストの7~9行目。CSSの指定があるときは11~13行目も)
<script type="text/javascript">
<!--
var blogroll_channel_id = xxxxxx;
// -->
</script>

<!-- <script type="text/javascript" charset="utf-8" src="http://blogroll.livedoor.net/js/blogroll.js"></script>
 ↓ 先程アップロードした"xxxxxx_blogroll.js"のアドレスに変える -->
<script type="text/javascript" charset="utf-8" src="https://blog-imgs-???.fc2.com/m/o/c/??????/xxxxxx_blogroll.js"></script>

<!-- <link rel="stylesheet" type="text/css" href="http://blogroll.livedoor.net/css/default2.css" />
 ↓ cssを呼び出している場合もアップロードしたCSSファイルのアドレスに変える -->
<link rel="stylesheet" type="text/css" href="https://blog-imgs-???.fc2.com/m/o/c/??????/default2.css" />


4.おつかれさまでした。


 以上でlivedoor相互RSSのSSL対応は完了となります…のはず。

 SSL化したFC2ブログでlivedoor相互RSSが表示されることを確認してみてください。

SSL対応03-対応完了画面


 ちなみに「保護された通信」にならない場合は、livedoor相互RSS側のチャネル設定でアイコンやファビコンを「表示する」に設定してしまっているかもしれません。
 前編記事を参考にもう一度確認してみてください。

 それ以外だと相互RSSとは別の事が原因になっていると思われます。
 一度プラグインから相互RSSを外してみるなどして原因を探ってください。

 そして今更ですが、この記事に書かれている変更等は「あくまでも自己責任」で行ってくださいね。 (*・∀-)☆

 またファビコンを表示したいとか、忍者画像RSSでやりたいとかいった相談にはお答えできません。是非ご自身でチャレンジしてみてください。


今日のアイキャッチ画像は。


 「妹さえいればいい。」から、可児 那由多(かに・なゆた)ちゃんです。


「妹さえいればいい。」

妹さえいれば人生は常に最高なのに、なぜ俺には妹がいないのか……」 妹モノの作品ばかりを書き続けている妹バカの小説家・羽島伊月の周囲には、天才作家にして変態の可児那由多、女子大生の白川京、イラストレーターのぷりけつ、鬼畜税理士の大野アシュリーなど、個性豊かな人物たちが集まっている。


 最初から主人公への好感度MAX振り切れ状態なだけに、ラブコメ的には少し影が薄くなっている感もあります。

 ラノベアニメのオーソドックスな展開としては、2話以降から順番に登場人物にスポットを当ててバックボーンを紹介していく、いわゆる○○回を連ねていく形をとるケースが多く、作品によってはキャラ紹介に終始して1クール終了してしまうものもあったりするわけですが…

 この作品はそういった部分は小出しにしていく感じになっていて、回想を含めた断片的なシーンを繋ぎ合せていく事で徐々にキャラ背景が見えてくるようになると思っています。

 ただアニメ化の際に尺の関係で外されちゃう描写もあったりするので、どこまで見えてくるかは想像力しだいなところも…

 那由多ちゃんの過去はテーマとして重そうな雰囲気も感じるので、あえて序盤はそのあたりの描写を端折っているのかもしれませんね。
SSL妹さえいればいい。可児那由多

6 Comments

mochi  

全然大丈夫ですよぉ o(*^▽^*)o

こんにちは。ぼっちんさん。

> > まさかこんな突っ込んだ話が出てくるとは思わなかったもんで… (;^_^A
> mochiさんとこのような会話が出来てとても楽しくなってしまったものですから、ついつい入り込んでしまってました (^_^; アハハ…
> お手を煩わせてしまって大変に申し訳ございません m(_ _)m

 いやいや。お気になさらないでください。
 ここまで詳しく見てくれて、しかも実際に試してもらって本当嬉しいですよ。 ☆⌒o(*^ー゚)

 ただ技術的な話ってどこまで専門的な言葉を使っていいのか分からないのと、自身の表現力の弱さにどうしても気づかされてしまう部分もあって…
 ホント、ぼっちんさんとお会いして、紙とペンで図を書いて説明しちゃいたいぐらいです。 ニャハハ(*^▽^*)

 まだ、僕の新規チャネル「Akira's Template Blog」において当初最新記事が反映されていなかった理由というのが、僕の中でも(仮定的なものはありますが)疑問として残っていますので、今後は暇をみてそこら辺をもう少し探っていこうかと思ってます。

 そこのところはいずれ障害報告的なものとして問い合わせが来るかもしれませんし、一種の謎解きみたいな楽しさもあったりしますし。
 まぁ、ほとんど後者が理由だったりするんですけどね。 (;^◇^;)ゝポリポリ

2017/11/23 (Thu) 17:29 |  REPLY |   

ぼっちん  

お手を煩わせてしまってすみません

いやぁ、とっても詳しい解説をほんとにありがとうございます ^^

> まさかこんな突っ込んだ話が出てくるとは思わなかったもんで… (;^_^A

mochiさんとこのような会話が出来てとても楽しくなってしまったものですから、ついつい入り込んでしまってました (^_^; アハハ…
お手を煩わせてしまって大変に申し訳ございません m(_ _)m

これで終了させて戴きますね (^^ゞポリポリ
まるで仕事仲間(若い仲間ばかりですけど(笑))と喋ってる気分になってしまって、熱が入ってしまいました ^^

お返事はけっこうですからね~♪

2017/11/23 (Thu) 12:41 | EDIT |  REPLY |   

mochi  

こちらも雨がシトシト降っております (*゚o゚*)~゚ ボー

おはようございます。ぼっさんさん。

> ただ、ちょっと不思議に思うには「瞬時に表示されなくなる」と言うのは、トリガー設定タイムとは関係の無い動作のように思うんですよね。
> 「表示されなくなる」ということは、Googleドライブにクローン化したroll_data.jsのデータがnull状態(空になる)になるからなんじゃないないでしょか?
> ですから、チャンネルデザイン設定変更の保存をするとblogroll.jsの内容にも変更を余儀なくされるから、データであるroll_data.jsとの遮断が起きて「再構築」が操作的に必要になるんじゃないかという気がしたんですけどね (^^ゞポリポリ

 僕も試しにファビコン表示をさせるなどの設定変更してみたんですが、
 すぐに表示されなくなるということはなかったです。

 Googleドライブ上のroll_data.jsを書き込みしているのは「Google Apps Script」だけなので、
 それがnull状態になるとしたら、相互RSS側設定変更とトリガー起動のタイミングが重なってしまい、
 roll_data.jsが再作成されないうちにGoogleドライブ上にコピーしたとか…
 あるんかな?そんなこと? (;^_^A

 ちなみにblogroll.jsの方は全ユーザー共用のものになっていますので、
 相互RSS側設定変更に関わらず不変で、一種のコンパイラ的な役割になっています。

 一方、roll_data.jsはユーザー毎(チャネルID毎)に存在しており、
 ファビコン表示の有無などの各設定フラグも記述されています。

 システム的にはblogroll.jsroll_data.jsを呼び出しているんですけど、
 プログラムの動きとしてはroll_data.jsが各設定フラグを引数として、
 blogroll.js内の関数をコールしている形になっています。

 ややこしくて言葉ではうまく説明できていないかもしれません。
 システムブロック図をもっと詳しく書いておけば良かったかもしれませんが、
 そこだけで1記事消化してしまいそうですね。
 まさかこんな突っ込んだ話が出てくるとは思わなかったもんで… (;^_^A

2017/11/23 (Thu) 10:55 |  REPLY |   

ぼっちん  

おはようございます~

mochiさん、おはようございます~ ^^

や~ 当地は冷たい雨の朝ですよぉ (^_^; アハハ…
まぁ、出かける用事もないですからいいんですけど(爆)

> 後処理的に対応させるという表現からすると、
> blogrollとaタグを絡めてCSSで処理してるでしょうか?

ハーイ(^O^")/ お察しの通りCSSのaリンクに無理矢理アイコンと言うかファビコンっぽいものを押し込みました(笑)
先日のブログカードの「ピン」表示と同じような手ですけど、もっと簡便な方法で(笑)

>「反映されなくなる」というのは「表示されなくなる」ということでしょうか?

そうですそうです、チャンネルのデザイン変更保存した瞬間に「livedoor相互RSS」全体がパッと表示されなくなってしまって焦ったんでした (^_^; アハハ…

> 次のトリガ時間が来るまでは表示されないままになっているのではないかと思います。

あっ なるほどですねぇ、、、
ただ、ちょっと不思議に思うには「瞬時に表示されなくなる」と言うのは、トリガー設定タイムとは関係の無い動作のように思うんですよね。
「表示されなくなる」ということは、Googleドライブにクローン化したroll_data.jsのデータがnull状態(空になる)になるからなんじゃないないでしょか?
ですから、チャンネルデザイン設定変更の保存をするとblogroll.jsの内容にも変更を余儀なくされるから、データであるroll_data.jsとの遮断が起きて「再構築」が操作的に必要になるんじゃないかという気がしたんですけどね (^^ゞポリポリ

その辺り、時間のあるときに実験してみようと思います思います (^^ゞポリポリ
いつになるか分かりませんけど(笑)

> もうlivedoorさん普通にSSL対応して!!って感じです。 (ノд・。) グスン

そそそ(笑) まったくそう思います(笑)
それまでの間、mochiさんのこの超絶テクでありがたく急場を凌がせて戴きます~ m(_ _)m

2017/11/23 (Thu) 08:36 | EDIT |  REPLY |   

mochi  

おめでとうございます!! (*^◇^)/゚・:*【祝】*:・゚\(^◇^*)…でいいのかな? (;^_^A

こんばんは。ぼっちんさん。

> おかげさまでとりあえず完成致しました~♪

 確認しました。
 ちゃんと僕の最新記事も表示されていますね。

 っていうか、ぼっちんさんの相互RSSって、
 アイコンっぽいのが表示されてるじゃないですか!! (ノ゚⊿゚)ノ

 後処理的に対応させるという表現からすると、
 blogrollとaタグを絡めてCSSで処理してるでしょうか?


> それと一つお教え戴きたいんですが、後発的に「livedoor相互RSS」側で「チャンネルの設定」を内容変更するとFC2ブログ側ではそのとたんに反映されなくなってしまうのですね?
> 再度最初から「一連の作業をやり直す」必要があるようなんですが、それで正しいでしょうか?

 「反映されなくなる」というのは「表示されなくなる」ということでしょうか?
 そうだとすると、おそらく「チャンネルの設定」を変更したタイミングで、
 ちょうどGoogle Apps Scriptのトリガが起動されて「表示されなくなる」設定で更新され、
 次のトリガ時間が来るまでは表示されないままになっているのではないかと思います。

 最初から「一連の作業をやり直す」ことで直るのは、
 その際にGoogle Apps Scriptが実行されることで、
 「livedoor相互RSS側」の設定が反映されるからではないかと・・・

 希望的観測混じりの回答になってしまっていますが。 (;^_^A


 あと一つ、これはまだ確認中のことなのですが、
 新規チャンネルを作成したときに、最初からSSL対応のスクリプトで動かしていると、
 最新記事の更新をしてくれないみたいなんですよね。

 元々設置してあったチャンネル分については全然問題なく動作しているのですが、
 新規に設置したAkira's Template Blogのチャンネルで、
 最新記事が反映されない状態でした。(昨日気づいた) 

 どうやらコピー元のlivedoorサイトの"roll_data.js"自体が更新されていないようで、
 そのチャンネルの相互RSSが実際に設置されているかどうかを確認しているのではないかと。

 改造版blogroll.jsでコメントにしてある部分(下2ヶ所が怪しい)において、
 livedoorサイトへとRSS設置を示す「フラグのような何か」を
 書き込みに行っているんじゃないかと推測してはいるのですが。

 とりあえず3年程前にやっていたlivedoorブログの方で、
 一時的にAkira's Template Blogの相互RSSを貼り付けて表示させてみたところ、
 今のところちゃんと最新記事が反映されているようです。

 ぼっちんさんのところが動いているのを見ると、
FC2ブログでも改造前の元のblogroll.jsを一度走らせることで、
 相互RSSがそういうフラグみたいなものを立ててくれるのかもしれません。

 また、もしかするとブログ生死判別の為に、
 定期的にフラグクリア&チェックをしている可能性もあるので、
 (たぶん僕だったらサーバー負荷を軽くするためにそのように設計するでしょうし。)

 このまましばらく様子を見て、途中で最新記事の反映がされなくなるようでしたら、
 ダミーブログ?を用意する必要があるかもです。

 まぁそうであっても、僕はほとんど遊びでやっているのと、
 今でも月に数回のアクセスがあるらしい、ほとんど死んでいるブログも持っているのでまだマシですが、
 相互RSSの為だけに一体どんだけのシステムになってしまうのやら… (;^_^A

 もうlivedoorさん普通にSSL対応して!!って感じです。 (ノд・。) グスン

 コメントなのに長文失礼しました。

2017/11/22 (Wed) 21:19 |  REPLY |   

ぼっちん  

とりあえず完成しました ^^

mochiさん、こんにちは ^^

「livedoor相互RSSのSSL対応」記事、ほんとに詳細に解説してくださってありがとうございます ^^
おかげさまでとりあえず完成致しました~♪

解説にもありましたが
-----------------
 ◆アイコン:表示しない
 ◆ファビコン:表示しない
-----------------
この設定はとてもミソですよね(笑)
「表示する」に設定してしまうと、それは画像ですから http:// の混在コンテンツコンテンツとなってしまう(笑)
そこは「表示しない」に設定しておいて後処理的に対応させる(笑)

それと一つお教え戴きたいんですが、後発的に「livedoor相互RSS」側で「チャンネルの設定」を内容変更するとFC2ブログ側ではそのとたんに反映されなくなってしまうのですね?
再度最初から「一連の作業をやり直す」必要があるようなんですが、それで正しいでしょうか?

なんにしてもSSL対応化出来るこのテクニック、ほんとに感心してしまいました m(_ _)m

2017/11/22 (Wed) 13:02 | EDIT |  REPLY |   

Post a comment