@nuxtjs/feedでATOMを設定する
RSSフィードを、比較的新しい仕様のATOM1.0にしてみました。
このブログでは、@nuxtjs/feedというプラグインを利用しています。
設定値を調べてみると、RSS2.0になっていました。
Feedを示すxmlは、いくつかのバージョンがあります。
メジャーなものでいえば、RSS1.0、RSS2.0、ATOMという具合です。
RSS2.0でも問題はなかったのですが、せっかくなので新しいのにしたいですよね。
まずは、どんな感じで設定すれば良いかをリサーチ。
ATOMで実装しておられる方のブログを発見。
このブログでは、すでにRSS2.0を設定しているので、type: 'rss2'
をtype: 'atom1'
に変更するだけで良いみたいですね。
getUTCFullYearのエラーが出る
まずはシンプルに、nuxt.config.jsに書かれた設定値を触ります。
feed: [
{
path: '/feed.xml', // The route to your feed. async create (feed) {
// 省略 }, cacheTime: 1000 * 60 * 15, // How long should the feed be cached type: 'atom1' // Can be: rss2, atom1, json1 // ↑ここをRSS2からatom1に変えた }
],
これでgenerateすると・・・エラーが出ました。
なんでや・・・
Cannot read property 'getUTCFullYear' of undefined
解決法はバッチリこちらの方が書いてくれていました。
Javascriptで.getFullyear() is not a function.が出た時の確認事項 | ハックノート
こんな感じでテスト的に書いてみたら、見事エラーが消えました!
date: new Date('2018/06/12')
なるほど、Date型ですか・・・
metaタグの変更も忘れずに・・・
最終的に、メタタグに以下のような記述が残るように書き直しましょう。
こうなってたのを・・・
<link rel="alternate" type="application/rss+xml" title="RSS 2.0" href="/feed.xml">
このようにしました。
<link rel="alternate" type="application/atom+xml" title="Atom 1.0" href="/feed.xml">
@nuxtjs/feed
の設定値をまとめてみる
とにかくドキュメントや情報が古いものが多いです。
ATOM1.0そのものの設定値については、以下のサイトを参考にしました。
Atom1.0仕様メモ (2007-06-03)
一方こちらは、@nuxt/feedで使われてるらしいモジュール。
パラメータの実装はこちらを参考にしました。
https://github.com/jpmonette/feed
結局、@nuxtjs/feedの設定値はこんな感じになりました。
稚拙ではありますが、何かのお役に立てればと思います。
feed: [
{
path: '/feed.xml', // The route to your feed. async create (feed) {
feed.options = {
author: {
name: 'Chaos Boy', }, title: title, id: domain, link: domain + 'feed.xml', language: 'ja',// これ、反映されない favicon: domain + 'img/favicon.ico', copyright: "All rights reserved 2018, Chaos Boy", subtitle: description, image: domain + 'img/author.png' }
const fs = require('fs')
posts.sourceFileArray.reverse().forEach(post => {
const key = post.replace('stories/','stories/json/').replace('.md','.json')
const article = require('./stories/json/' + posts.fileMap[key]['base'])
const articleUrl = domain + 'posts/' + article.sourceBase.replace('_','/').replace('.md','/')
const published = fs.statSync('./stories/' + article.sourceBase)
const updated = article.base.substr(0,10).replace('.json','')
const heroImg = domain + 'img/blog/' + article.img feed.addItem({
title:article.title, id: articleUrl, link: articleUrl, description: article.digest, content: article.bodyHtml, published: new Date(published.mtime), date: new Date(updated), image: heroImg, // これも、反映されない })
})
feed.addCategory('blog')
feed.addContributor({
name: 'Chaos Boy', link: domain
})
}, cacheTime: 1000 * 60 * 15, // How long should the feed be cached type: 'atom1' // Can be: rss2, atom1, json1 }
],
バリデーターを利用して正しい記述かチェックする
由緒あるW3Cのサイトに、フィードが正しい記述かを調べてくれる、バリデーターが用意されています。
フィードに問題があれば、エラーを表示してくれます。
また、エラーではないが、より良い記述になるというtips的なものを教えてもくれます。
Feed Validator for Atom and RSS
上述の設定で、エラーは回避できます。
ただ、全ての要因をクリアすることはできていません。
より拘るなら、カスタムが必要ですね。
本当にやりたかったこと
記事を更新されるとツイートするように、IFTTTを利用しています。
この時に、設定値にkeywordsなどを入れておけば、ハッシュタグにキーワードを関連づけて、ツイートさせられるのではないかと考えたからです。
結局、ATOMの仕様にキーワード的なスペースが無いようなので、今回は諦めます・・・。
まとめ:SlackのRSSが動き出した!
ATOMフィードにアップデートして、デプロイしたところ、SlackのRSSから更新通知が一気に9通くらい来ました。
SlackのチャネルにRSS登録してたこともすっかり忘れてたので、ちょっと驚きました。
ATOMにしたことにより、正常に動き出したようなので、ちょっと安心です。
そして、ちょっと気になったところ。
その後、内容の回収をしてアップロードしたのですが、また大量のSlack通知が。
通知された記事は、最近、記事の手直しをしたものでした。
うーん、過去記事をいじる度に反応してしまうのか・・・?
Slackなら登録している人もいないでしょうから良いですが、Feedlyなんかはどうなんだろうか・・・
しばらく様子を見たいと思います。