トラップメモから
Webアプリはあまり書いたことがなかったのでたくさんありました
①問題
②調査結果
③対応
１．step02 フォロアー数を抽出しcsvファイルに追記する
１）Automatorでのブロック間データ受け渡し
①ブロックでの出力が結果欄に表示されるが次のブロックでデータを受け取れない
②繋がっているような絵になっているがデータは来ていない
③データ受け渡し用のブロックを間に入れる
２）Applescript内でのjavascript実行
①Applescript内でjavascriptが動かない
②ブラウザの許可が必要
③Safariメニュー 開発＞Apple EventからのJavascriptを許可 を選んでチェックを入れる
３）Applescriptによるブラウザのソース保存
①保存されない
②ブラウザがページ読込を完了する前に読み込みが起動して正しく読めない
③ページ読込が完了するまで待つ
・とりあえずdelayで様子を見て（5秒では不足する場合あり）
・delayに代えて読込完了待ちコードを入れる
curlコマンドをお薦めする情報もあるがjavascriptで表示するページを読み込めない
ページ読込の完了を待つお手本
AppleScriptでSafariのwebarchiveを保存したい
discussionsjapan.apple.com
ブラウザページのソース保存お手本
Save the source of an open webpage from Safari with AppleScript stack overflow
AppleScriptで開いたページのソースをサファリから保存する
stackoverflow.com
４）Applescriptによるブラウザページのソース保存
①手動保存は正常にできるがApplescriptで保存すると文字化けする
②文字コードが違う
③«class utf8» を指定する
write myString as «class utf8» to newFile
«(ｫ) Latin-1:0xAB UTF8:0xC2AB
»(ｻ) Latin-1:0xBB UTF8 0xC2BB
文字化けについて
hirakun.blog57.fc2.com
２ step03 csvファイルでチャートを描画する
１）javascriptでcsvファイルを開く
（１）ローカルファイルの読み込み
①アップロード前のローカルディスクにあるcsvファイルをブラウザから読めない
②仕様
③クロスドメインで検索
開発環境を整えるか何かで代用する
２）コード変換
（１）ファイルデータの配列転換
①javascriptでcsvデータの配列をX軸Y軸に振り分けたいが新しい二次元配列に代入できない
②javascriptには、多次元配列という定義がない
③配列の階層ごとに初期化する
var array = []; array[0] = []; // 二次元目の初期化が必要 array[0][0] = "data";
３）チャート描画
（１）Chart.js 描画
①下書きプレビューで描画する時もあるが、その後描画されなくなる
②サーバが関与するとcanvas タグが消される
③script タグの中に入れて保護する
とりあえずdocument.write で動いたので様子見
２）Chart.js X軸日時フォーマットの設定
①X軸目盛ラベルが思うようにフォーマットできない
②データ数等の状態で変化する
③仕様書をよく読む、callback 関数を使って整える（未実装 データが増えたら実装を検討）
例：X軸目盛ラベルをskipで指定した数により間引く
var skip = 10; // 1/10に間引く xAxes: [{ type: 'time', time: { unit: 'day', displayFormats: { day: 'YYYY/MM/DD' } }, ticks: { callback: function (value, index, values) { if (index % skip != 0) { return ""; } return value; } },
３）google chart 配列データを使う（未実装）
①データとして配列データを丸投げできない
②仕様
③data.addColumnとdata.addRowでデータを渡す
４）google chart 配列データを使う（未実装）
①ローカルで表示するのにサーバで表示しない
②data.addRowに渡すデータ型の扱いが異なると思われる
③データ型を指定して渡す
３．step04 csvファイルを下書きにアップロードする
１）はてなブログAtomPub各パラメータを取得する
（１）下書きのentry_ID を取得する
①どこのどれが entry_ID かわからない
②仕様
③ブログAtomPubで取得して要素のIDを特定する
ここを参考にしました
cartman0.hatenablog.com
（２）下書きのentry_ID を取得する
①entry_ID 取得用pythonのBeautifulSoupがエラー "Couldn't find a tree builder" で止まる
②パーサー（構文解析器）がない
③lxml パッケージをインストールする
詳細は下記リンクに 凄い助かりました
qiita.com
２）下書きページへアップロードする
（１）csvファイルの中身をxlmファイルに埋め込む
①手動貼り付けと異なるデータ構成になる
アップロードすると手動貼り付けで出来ていたbrタグが無くなる
brタグを挿入しても消される
下書きページの見栄えも悪い
②仕様
③別の区切り文字を挿入する
（２）ファイルを下書きページへアップロードし更新する
①新規アップロードはできるが更新アップロードできない
②仕様
③PUTを使う POSTは新規用
POST リソースのURIはサーバが決める
PUT リソースのURIはクライアントが決める
（３）アップロードする
①pythonがImportErrorで動かない
②同じ名前の別のファイルやフォルダがプロジェクト内にないか？
③ファイル名を変更するか移動する
これが犯人でした org.py
詳細は下記リンクに 凄い助かりました
qiita.com
４．Automatorでpythonを起動し自動化
１）Automatorのシェルでpythonを使う
①シェル内でimportができていない
②PATHが通っていない Automatorのパスはターミナルのパスと異なる
③PATHを設定する
２）Automatorのシェルでpythonを使う
①シェル内でimportができていない
②違うpythonが動いている
③pythonをフルパス指定で記述する
【まとめ】
１．良かったこと
１）使いやすいエディタを見つけた
pythonを使うことになったのであちこちでお薦めされているAtomを使ってみたところとても快適
いつも使っているマイクロチップのIDEと同じように使える
２）MacBook Pro (13-inch, Late 2011)で十分
画像処理とかなければまだまだ使える
３）はてなブログのサーバによるcanvasタグ消滅回避
Chart.jsでチャートを描くつもりで進めていたところ、サーバはcanvasタグが嫌いなようでどうにもならず
一旦はあきらめましたが、とりあえずscriptが関わることはscriptの中で済ませれば何とかなりそう
２．課題
１）クロスドメイン制約
これくらいのコードでもデバッグが面倒
pythonを使えるようにしたので次に作る機会があったらhttp.serverを試してみたいと思います
【開発環境】
MacBook Pro (13-inch, Late 2011)
OSX El Capitan 10.11.6
メモリ 8G
SSD 500G
標準アプリ
Automator 2.6
Safari 11.1.2
カレンダー 8.0（未使用）
インストール
Python 3.7.2
beautifulsoup4 4.8.1
lxml 4.4.1
requests 2.22.0
Atom 1.41.0
外部
はてなブログ
Chart.js 2.7.2
moment.js 2.24.0
フォロアー数解析の準備は以上でおしまい
