Web取込機能について

Web取込機能は、Webページに表示されている文字列を ことせかい に取り込む機能です。 全てのWebページを取り込めるわけではありませんが、いくつかの対応サイト等では既存の なろう検索 で取得した小説と遜色のない形で文書を取り込むことができるはずです。

Web取込機能について、簡単な使い方と、うまく動かない場合の例を動画にしてみました。ざっくりと使い方を知るためには動画を観るのもいいかもしれません。

Web取込機能の使い方

動画のものと重複するところもありますが、Web取込機能の使い方について書き下しておきます。

Web取込機能を使うには、ことせかい の「Web取込」タブを利用します。 Web取込タブにて、取り込みたい内容を表示した状態で、右下にあります「取り込む」ボタンを押すことでそこに表示されている文字列を借り読み込みで取り込みを開始します。

「取り込む」ボタン

借り読み込みが完了すると、読み込まれた文字列やタイトル等の情報がダイアログて表示されます。

借り読み込み結果のダイアログ例
この画面に表示されている情報で問題がなければ「このまま取り込む」ボタンを押すことで、指定されたタイトルで本棚に登録されます。

本棚に登録された文書は、自作小説とほぼ同じ扱いとなりますので、タイトルや本文の修正が可能です。 また、借り読み込み結果のダイアログで「続ページ:有り」と表示されたものについては、表示されている物以降に続く文書を別の章として順次読み込んでいきます。 この続ページについては、設定タブの「小説の自動更新」がONになっている時には定期的に続ページが更新されているかどうかを確認して、更新があった場合には新しい章として追加します。

細かな機能

Web取込機能はWebブラウザを内包しておりますので(そのおかげで一旦レーティングが17+になりましたが、通常の方法ではGoogleへとアクセスできなくすることでレーティングを9+に戻しました)、所謂普通のWebブラウザっぽい事ができるようにしてあります(けれども、本気のWebブラウザを作ろうとするととても大変なので、簡易版という感じで作成しております)。 以下に、ざっと画面構成とそれぞれの説明を記しておきます。

Web取込タブは以下のようなボタン等があります。

Web取込タブの画面
  1. 戻るボタン: 元のWebページに戻ります
  2. 進むボタン: 戻るボタンで戻っていた場合、先のWebページに進みます
  3. ホームボタン: 最初のページに戻ります
  4. ブックマークボタン: よく使うページをブックマークできます。ブックマークしたものは最初のページに追加されます。ブックマークされているページでは栞のアイコンにチェックマークがつきます。(なお、ブックマークされているWebページでブックマークボタンを押すとブックマークが消えてしまいます。もし全てのブックマークを消してしまうとどこのWebサイトへも行けなくなってしまいますので、標準のブックマークを置いておきます。Safari等でダウンロードして「ことせかい にコピー」等を選んでブックマークを取り込んでください。(多分 ことせかい側 のWeb取込タブからだとうまく取り込めない気がします)
  5. リロードボタン: Webページを再読込します
  6. 取り込みボタン: 現在表示されているWebページの文字列を、ことせかい に取り込みます
  7. URLバー: 現在表示されているWebページのURLが表示されます。URLを直接入力することはできませんけれども。(これは、「無制限のWebアクセス」というレーティングを17+に引き上げる要因になるためです)

Safari からの取込

このWeb取込機能は、Safariからも利用することが可能です。 Safariから利用する機能は、Safari のシェアボタンを利用します。(それ以外のアプリからのシェアボタンでは恐らくは正常に機能しません)ですので、まずは Safari を起動してください。 Safari にはシェアボタン(四角い箱から上向きの矢印が出ているボタン)があります。表示されていない場合はページを一番上までスクロールさせてみると出てくると思います。

Safari のシェアボタン
シェアボタンを押すと、カラーのアイコンの行と白黒のアイコンの行が出て来ると思います。「ことせかい へ読み込む」機能は白黒のアイコンの行に属しています。もし、「ことせかい へ読み込む」のボタンが無い場合は、白黒のアイコンの行を横にスクロールしていって「その他」を選んだ先に出てくる「ことせかい へ読み込む」機能をONにしてください(ついでに「ことせかい へ読み込む」の位置を上にズラしておくと少し便利になるかもしれません)。「ことせかい へ読み込む」ボタンが表示されるとこのようになります。
ことせかい へ読み込むボタン
このボタンを押すと、「このページを"ことせかい"で開きますか?」といったダイアログが出ます。 このダイアログで「開く」を選択すると、ことせかい アプリへと移動します。 ことせかい アプリに移動した後は、借り読み込み結果のダイアログが出ます。この後の操作についてはWeb取込機能と同じです。

Web取込機能の仕組み

Web取込機能はWeb上で発表される小説を読み込むために、以下のような仕組みを導入しています。

  1. 表示されている文字のうち、内容の部分だけを抜き出す
  2. 複数ページにわたる小説の場合、続くページを取得する
  3. 小説のタイトルを抜き出す
  4. 小説の作者名を抜き出す
これらは全てxpathを用いてHTML内の要素を抽出しています。 このxpathの情報は ことせかいWebページ読み込み用情報 と、AutoPagerize の二種類のデータベースを利用しています。 前者の「ことせかいWebページ読み込み用情報」では4つ全ての情報を、後者の「AutoPagerize」では前半2つの情報が記述されています。なお、AutoPagerize のデータベースは ことせかい とは関係のない目的のデータベースで、ことせかい はその情報を使わせて頂いている側となります(wedataに登録されたデータはパブリック・ドメインとなるらしいので、有難く使わせて頂いています)。

うまくいかないサイトについて

ところで、上記の2つのデータベースに登録されていないWebページについては先程の4つの仕組みがうまく機能しません。 うまく機能しなかった場合は最初に挙げました動画の二つ目(うまくいかない場合)のように、表示されている全ての文字が取り込まれます。 これをなんとかするには、

という方法が考えられます(もっと素晴らしい方法があれば教えてください)。 一つ目の方法は毎回の作業になりますのでちょっと手間がかかると思いますが、自分だけの範囲で完結しますので一人で済ませたい人にはいいかもしれません。 二つ目の方法は今後同じWebサイトを何度も使う場合には良いと考えられますし、他のユーザが同じWebサイトを取り込もうとした時にも効果が出ます。が、この方法を大量の人から受けると ことせかい の開発者が大変になります(ことせかい の開発者は一人なので限界がありますことをご了承ください)。 三つ目の方法はxpathを書く技術とOpenIDが必要となりますが、どなたでも参加でき、今後同じWebサイトを取り込もうとする人にも効果のある良い方法です。編集作業自体に報酬は何も出ませんが、できましたらば、この手法で貢献して頂けると ことせかい の開発者としては嬉しいです。

ことせかいWebページ読み込み用情報 の編集について

以下にことせかいWebページ読み込み用情報を編集しようとした時のガイドを書いておきます。

編集を行うには、OpenID と xpath を書く知識が必要です。また、編集作業に貢献していただいても ことせかい の開発者側からは特に何の報酬も出せません事は予めご承知おきください。

wedata について

ことせかいWebページ読み込み用情報は、wedataというサービスを利用させて頂いています。 wedata は「Wikiのように誰でも書換えられるデータベースを作成するシステムです」と説明されています。詳しくはwedataサイトのwedataについてを参照してください。

OpenID について

OpenID ははてな などで取得することができます。 どこか適切な所で取得してください。

xpath について

xpath は XML や HTML の文書について、そのエレメント(特定の部分)を指定するための言語です。「xpath 書き方」で検索 したりすると、ざっくりとした書き方とかは解るかと思います。

xpath を書く時について

xpath の書き方について、私がやっている方法をざっと説明しておきます。
  1. Google chrome で目的のWebサイトを開きます
  2. デベロッパーツールをONにします
  3. デベロッパーツールの左上にある四角に矢印がついているようなアイコンで、HTMLのエレメントを選択できるようにして、xpathを書きたいエレメントを選択します
  4. Elementsタブで目的のエレメントが選択された状態になるので、そのエレメントが選択できるようなxpathを考えます
  5. xpathを考えたら、Consoleに
    document.evaluate("//ul[@class='about']", document, null, XPathResult.ORDERED_NODE_SNAPSHOT_TYPE, null).snapshotItem(0)
    といった感じで入力して xpath を実際に動作させてみて選択されることを確認します(この例では "//ul[@class='about']" の部分が xpath です
  6. 問題なく選択されているのを確認して、wedataの情報を更新します
パソコンで操作している場合、Webサイトによってはモバイル版のページを開かねばならないことに注意してください。

xpathのデバッグについて

ことせかい のアプリ側では、毎回 wedata の情報を読み込んでしまうのは冗長であるということから、wedata から取得した情報は一定の時間(だいたい1日位)はlocalに保存されたキャッシュを参照するようにしています。 そのため、ことせかいWebページ読み込み用情報を編集しても、すぐには反映されず、アプリ側での動作確認ができません。 これを回避するには、ことせかい のデバッグモードをONにする必要があります。 デバッグモードは、「設定タブ」の「ルビはルビだけ読む」のON/OFFを5回(ON→OFF→ONで2回と数えるなら10回)繰り返すことでONにすることができます。 この、デバッグモードがONになった後に出てくる設定項目に、「SiteInfoを毎回読み直す」という項目があるので、それをONにすることで、毎回ことせかいWebページ読み込み用情報を読み直すようになります。

また、あまり使いやすいものではないかもしれませんが、デバッグモードがONになると、デバッグログを参照できます。一応、xpath周りのログもデバッグログには保存されますので、自分の書いたxpath情報がうまく実行されているかどうかを確認できるかもしれません。

デバッグ機能をうまく使ってことせかいWebページ読み込み用情報を編集して頂けるととても助かります。よろしくお願いします。