| mikeo_410 |  |
サイトジェネレータに関する修正記録
このサイトのページは google docs で書いています。google docsは、「共有」「公開」を選択するとHTMLのページを用意します。これをブラウザで開いて「名前を付けて保存」したものがサイトジェネレータの入力です。
パソコンにサイトの構造にフォルダを作成して置いて、「名前を付けて保存」で配置します。この構造に従って、レンタルサーバにアップロードするファイルを用意します。
再検討：
Google Docの「ファイル」「共有」「ウェブに公開」でHTMLを開くURLが決まる。
Google Doc のホスト側にGASでスプレッドシートを作っている。「ウェブに公開」によって付けられたURLとGoogle Driveのファイル階層の対応が目的。また、更新日時を付加した。
スプレッドシートは、開くとスクリプトによって毎回すべて更新される。この処理は少し時間が掛かる。更にHTML化のタイミングは制御できず、待つほかない。
このスプレッドシートも「ウェブに公開」してある。ぎぇぎぇ
クライアント側で、サイトジェネレータを起動すると、まずスプレッドシートをダウンロードする。
チェックボックスを表示して、ダウンロードするドキュメントを選択する。
Google Docに由来しないページが必要だった。クライアントのディレクトリ構造とhtmlファイルからindex.htmlを作るが、ディレクトリにはGoogle Docに由来しないページも保持されていなければならない。異なるパスに同じフォルダ名を作ることも考えられるが、ディレクトリ構造も大きく変えることがあるので２重にすることは避けたい。
レンタルサーバにサイトスクリプティングでページを出すのを止めることが目的でジェネレータを作った。困ったのが各ページに付けていた目次（ショート・インデクス）で、当然ながらページを追加しても既存ページのインデクスには反映されない。
Google Driveは、ファイルを一意IDで識別しており、フォルダを移動しても変わらない。Google Docの題名はファイルを特定するものではない。
しかし、クライアントにダウンロードした後は、題名をファイル名やURLとする。
クライアントは、スプレッドシートをダウンロードして、この関係を知る。Google Drive上の階層も知る。
また、インデクスの並びも題名をソートして行う。フォルダや題名の先頭は漢数字で番号を付けて置くことにする。しかし、この番号を変更すると、クライアントは別なドキュメントと判断することになる。
saveディレクトリの下に、Google Driveの階層をフォルダ名や題名で付与して作成する。同期が問題。
最初にサイトを作り始めたときと、目次の階層が出来ていてページを足すだけになった状況の両方を考えるのは無理なようだ。
レンタルサーバーにアップするためのクライアントのフォルダは、google ドライブに合わせることにして、1つだけにする。クライアントのフォルダの情報をからインデクスを作るのを止める。そのためには、google doc由来でないhtmlもgoogle ドライブに置くことにする。
特に問題なのは、htmlが参照するファイルで、これも紛れないように扱う方法がいる。
使えれば、google doc由来でないページの編集や確認も出来て便利だと考えたが、サーバ更新中となって進まない。
google doc由来ではないページをgoogle driveに置くので、サイトジェネレータでダウンロードもできると特別扱いしなくて良くなる。google doc由来のHTMLのようにブラウザのプロトコルでアクセスできるようにはなっていない。認証の必要なことになるらしい。
Visual Studio のソリューションにNuGetで Google.Apis.Drive.v3 追加。
ブラウザで「Google Cloud Platform」のコンソールを開く。
画面左上の三本線のアイコンで開く、左に表示されるメニューをナビゲーションメニューと言うらしい。
この、「IAMと管理」でプロジェクトを作るものらしい。
「APIとサービス」の画面上に「＋APIとサービスの有効化」があって、API使用を許可するらしい。
「APIとサービス」「API 認証情報」の上の方に「＋認証情報を作成」がある。「OAuth クライアント ID」を選んで、アプリケーションの種類を「デスクトップ アプリ」とする。この操作で作成される.jsonファイルをダウンロードする。
PowerShellで Google Cloud CLI によるログイン。
gcloudコマンドを使う例を見た。これは、gcloud CLI で検索すると「gcloud CLI をインストールする」と言う
https://cloud.google.com/sdk/docs/install?hl=ja
に行き着いた。
Cloud SDK をインストールすることになる。
gcloud auth application-default login
--scopes='https://www.googleapis.com/auth/drive' --client-id-file=\Users\mikeo\Downloads\xxxx.json
この操作で、ブラウザにログイン画面が開き、例の安全でないページを開いて許可する。
この方法は、googleの発行したファイルを、要求したパソコンにあることで認証されるもののようで、パソコンにはクライアントIDが振られていることになる。
Google Docs由来でないページは、xxx.html と xxx_filesフォルダからなる。
サーバにあるスプレッドシートの最初の列は url だが、これを空にして置くこと。このurlはGoogle Docsの「公開」で付与されるurlを入れる場所で、サイトジェネレータの入力となって変換される。
また、Google Docsの題名の最後は、.html だったり、_fileにしないこと。Google Docs由来でないページはこれで区別している。
張り付けた図は常に右端が欠けます。理屈は分かりませんが、親のstyle属税から、
overflow : hidden
を消せば解決します。
|
<img>タグを列挙して、数式の場合にはサイズを追加している箇所で、親の促成を調べ、一律に「overflow : hidden」を削除しました。
他のページをリンクする正しい方法は良くわかりませんが、「挿入」「リンク」で「リンクを検索または貼り付け」の欄に完全なURLを貼れば参照できるようになります。
しかし、HTML化したページを見ると、
<a class="c12" href="https://www.google.com/url?q=http://mikeo410.minim.ne.jp/
%25EF%25BC%2593・・・%25BB.html&sa=D&source=editors&
ust=nnn&usg=xxx">２．地球儀と楕円体の描画</a>
のような形式になっています。
一旦、googleのサイトに送られるので、ブラウザにリダイレクトの表示がでます。
また、このエンコードは、%に続いて4桁の16進数が続いていますが、%の次は全て25で、2度URLエンコードしたようです。
「リンクを検索または貼り付け」には、「検索」をする方法があります。フォルダ名の先頭を入力して検索して設定するとgoogle ドライブのファイルのURLになります。これは、希望しないので、このサーバのページを開いて、アドレスバーをコピーして貼り付けます。この際、ブラウザは、URLエンコードしたものをクリップボードに入れます。
これが、2回エンコードされる理由のようです。
ただし、直接、"./１．このサイトについて/５．Google Docs について.html"のように入力すれば、エンコードされずに、そのまま href に設定されるので単純ではないようです。
href が "https://www.google.com/url?" で始まる場合、qパラメータを直接hrefに設定するようにします。この際、先頭が%25であったらURLデコードします。結果の先頭が%25であればもう一度URLデコードします。
これは、google ドライブ上のページの名前の先頭を全角で付けるという前提を置くものです。
"https://www.google.com/url?" が複数つ続く場合があって、どういうケースか分からないが ?q= の "=" が%エンコードされている箇所があった。
繰り返し、処理する。
Uri クラスを作ると、URLをScheme、Host、LocalPath に分割できました。
LocalPathはデコードされています。
これをもう一度デコードするには、Uri.UnescapeDataString() が使えます。
Hostが ".google." を含む場合は、href を書き換えないことにします。
それ以外は、パラメータは削除します。したがって、googleサイト以外の外部サイトのリンクを挿入する場合パラメータが削除されることになります。
書いているものが文書なのでページは章で構成されていると考えています。ページはWEBページという意味でhtmlファイルに相当します。ページは「巻」でページ区切りはありません。章はネストします。章は、章番号と章見出しから始まります。章番号は、ドットで区切って章の階層を表します。章見出しは階層に合わせて文字サイズを換えます。
これが私の希望する章立てです。これは、 google Docs の考えとは異なるようです。
段落見出しは、単に文字の大きさの指定のようです。番号とは無関係です。番号付きリストを適用すれば章番号に見えます。章番号は、インデント操作で、ドットで区切った階層表現が切り替わります。これは、段落見出しの番号とは無関係で、見出し1をインデントすれば見出し1のまま、「1」、「1.1」と番号が変わります。
したがって、章番号は、文書の始めの方で、見出しに番号を付け、それを「書式の貼り付け」でコピーして使うことになります。番号と見出しを組み合わせたスタイルとしては保存されないようです。
html化した後の章見出しは以下のようになっています。
|
段落スタイルの見出し1は<h1>に相当します。これは単に文字サイズを決めるのみで、章の階層を示しません。
オーダーリストを使って番号が与えられますが、章見出しは全て独立で、ネストしません。したがって、start属性で個々の番号が直接指定されます。
したがって、cssによるカウンタは不要に思えますが、styleの大半はカウンタに関するものです。
start属性の数字は誤っている場合があることが分かりました。google Docsでは正常なのに、HTML化すると新たな章の次のレベルが1から始まらないと言うものです。
以下のようにします。
<div><span>章番号</span><span>見出し</span></div>に換えます。
パソコンに SaveHml と site ディレクトリを用意します。
SaveHtml/ 以下には、googleドライブ上のドキュメントと同じ構造のフォルダを用意して、Google Docsドキュメントを「ファイル」「共有」「ウエブに公開」を選択して、公開されたhtmlドキュメントを開きます。「名前を付けて保存」で、SaveHtml/ 以下の対応場所に保存します。
保存されるのは、x.html と、x_filesフォルダです。x_filesフォルダには、張り付けた図や、数式が図になったものが入ります。図がなければ、x_filesは作られません。
x.htmlは、スクリプトなど表示されないものは削除し、ヘッダ、フッタを付与して、site側にコピーします。x_filesフォルダはそのままコピーします。
フォルダ、ファイルの配置を反映したindex.htmlを作ります。
各ページには、同じ階層のインデクスを付与します。
基本的には、Google Docsドキュメントで作成したドキュメントですが、中には別の方法で作成したページもサイトに含めたいと思います。
その方法は、site/下に、直接.htmを入れることにします。
siteには、SaveHml/から変換されたものと、それ以外があります。
site/下に、直接.htmを置くことがあるので、消してしまわないように注意が必要です。
各ページの先頭部分に同じ階層のインデクスを作ります。SaveHml/以下のフォルダ、ファイル構造から、インデクスを作っていましたが、site/下に、直接.htmを置いたものが反映されません。そこで、site/側でインデクスを作成することにしました。
全体を再構成するために、SaveHml/側から変換されたものを、site/側から削除して、再変換すると、各ファイルのヘッダのインデクスは、中途半端な状態から作られ網羅しません。2度、変換をすれば各ファイルのヘッダのインデクスは完全になります。
これは、スクリプトで動的に作成する方が賢いものと思いますが、今回は単純な静的htmlで作ってみます。
サイトジェネレータは、SaveHml/と、site/側の対応するものの更新日を比較します。SaveHml/側が更新された場合のみ変換をします。
主にデバッグのために、SaveHml/以下の .htmlの更新日時を現時点に設定しなおします。