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

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

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

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

livedoor 相互RSSがSSL化（https化）に対応しました｜livedoor 相互RSS 開発日誌

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

blog.livedoor.jp

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

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

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

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

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

mochi1999.blog.fc2.com

livedoor相互RSSのSSL対応

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

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

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

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


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

livedoor相互RSSをSSL対応させる方法をコッソリ教えちゃいます（前編） ｜ 富士宮で貯蓄と資産運用

ちょっと見せるだけなんだからね。livedoor相互RSSのSSL対応の概要　システム概要については先日下記記事で紹介しており繰り返しになってしまいますが、最初から本記事に来られた方や、またおさらいの意味でも再度説明しておきます...

mochi1999.blog.fc2.com

１．blogroll.jsのダウンロード

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

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

---

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

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

---

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

２．改造版blogroll.jsの作成

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

---

（２）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";
        }

---

（３）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;
    };

---

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

３．FC2ブログへのSSL対応livedoor相互RSSの実装

（１）FC2ブログにログインして管理画面を開きます。

---

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

---

（３）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" />

４．おつかれさまでした。

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

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

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

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

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

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

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

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

「妹さえいればいい。」

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

imotosae.com

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

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

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

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

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