HOME > CONIT Labs.

CONIT Labs.

vbsでブラウザ操作


会社ではMacを使ってますが、自宅では未だにwindowsPCを使っているため、
未だにキーボードで日本語変換を間違える鵜沢です。

そんなわけでこの度は、windowsでしか使えないvbsの話。
vbsは非常に簡単なスクリプト言語ですので、
開発者でなくても、PC初心者でも使いこなせると思います。
で、今回はブラウザ操作(IEのみですが)をスクリプトで自動で行う方法について。

ブラウザの操作はDOM(Document Object Model)というものを使用して行うことができます。
以下のソースをtest.vbsというファイルタイトルで保存し、windowsで実行してみましょう。
単純にIEブラウザでグーグルのサイトを表示するだけのソースです。
実行は作ったファイルをダブルクリックで行えます。
——————————–
Option Explicit

Dim objIE
Dim strBody
Set objIE = CreateObject(“InternetExplorer.Application”)
objIE.Width = 800
objIE.Height = 600
objIE.Left = 0
objIE.Top = 0
objIE.Visible = True
objIE.Navigate “http://www.google.co.jp/”
‘<< A >>
Set objIE = Nothing
———————————

ただ、IEブラウザを表示しただけですが、
ここではIEブラウザをオブジェクトとしてとらえています。
そのオブジェクトのパラメータにサイズや遷移先を設定しています。

このソースをすこし改造してみましょう。
‘<< A >>の部分を以下のように書き換えて再度実行してみると、
ブラウザを開く→検索条件を入力する→検索を実行する
を自動で行ってくれます。

———————————
Do Until objIE.Busy = False
WScript.sleep(100)
Loop
objIE.document.getElementsByName(“q”).item(0).value = “test”
objIE.document.getElementsByName(“btnG”).item(0).click
———————————

Do~Loopはブラウザが開ききるまでの待ちです。
残りの2行が、検索条件を入力する。と、検索ボタンををクリック。
の処理になります。
ここで、”q”とか”btnG”といった文字が出てきていますが、
これはそれぞれのinputのnameを入れます。
nameの調べ方はブラウザで右クリック→「ソースを表示」でできるはずです。

vbsとHTMLのタグを使えばブラウザ上の処理が自動化できます。
上記のソースのNavigateの行のURLや入力、ボタンクリックの箇所を変更すれば、
毎日行うデスクワークが楽になるかもしれません。

ちなみにブラウザで右クリック→「ソースを表示」
でソースが取得できない場合は、
‘<< A >>の部分を以下のようにすると画面のHTMLソースが取得できたりします。
もちろん、取得できない画面もあります。

———————————
strBody = objIE.Document.Body.InnerHtml
WScript.echo strBody
———————————

最近はブラウザ操作の自動化の便利なツールがたくさん出ていますので、
わざわざvbsを使うこともないかもしれませんが、
vbsを使えば、IEで表示している内容を、
Excelに自動で書き込んで、グラフ化する・・・なんてことまでできるはずです・・・

ユーザデータ調査用にPCを買った!


昨日新宿で買ってきたPCがこれ

http://www.dospara.co.jp/5goods_pc/pc_detail.php?h=d&f=d&m=pc&mc=1293&map=7

ドスパラパソコン

これのセール品でメモリを4GBにして、28000円

安い!

パソコンおたく出身のエンジニアとしては

なんの装飾も付いていない、(自作系のガワをまとった)PCの箱を開ける時が至福の時となるのですが。

しかし安い。10台買っても28万。

28万程度ですがたぶん、、というか確実に弊社で使ってるデータセンターのサーバを凌駕する性能を発揮するでしょう。

今はスケールアウトの時代ですからね。

===================

2台目

これで2台目なんですが、なんで買い込んでるっていうと

ログデータの解析用なんです。

弊社では1時間でログローテートさせ、社内までデータを引っ張ってきています。

なので、1時間分のログ解析は1時間で終わらせないといけません。

ボヤボヤしてると次のバッチの時間が来てしまいますからね。

下手するとギガ級のファイルを処理ですわ。

=======================

ログが半端ない

ソーシャルアプリの人は良くわかってるとおもいますが、

PVが半端ないっす。

PC用のWEBサイト(たいしてアクセスないやつ)のPVなんて

5秒ぐらいで抜き去ります。

どうせなら、勉強がてらMapReduceなどの分散技術でやってみるかと。

3万円PCをたくさん並べて処理するなんてGooglerみたい!

表よりもヴィジュアルで表現する


こんにちわ、市川です。

今回は、久しぶりにHTMLネタですが、HTML5の話ではありません(汗)

業務向けのシステムでは、データの表示に表をよく使います。

何故、表を使うかというと、多くの情報を一気に表示する事が可能だからだと思われます。

しかし、実際に出来上がった表を見ると、結構見づらい。。

見やすくするために、1行おきに背景の色を交互に変えて、少しは見やすくなりますが、やはり見づらいのはそれほど解消されません。




そこで、今回紹介したいのは数値データを使って、グラフを表示する方法です。

例えば、こんなデータがあったとした場合

Android1.5 Android1.6 Android2.1 Android2.2 Other
21.3 23.5 53.1 1.8 0.3

(参考にしたデータGaApps.jp)



これぐらいのデータであれば、見づらいという事はないですが、ぱっと見の印象でどれぐらいのシェアなのかが、あまりよく分かりません。

では、これをグラフにしたらどうでしょう?



情報が一気に分かりやすくなったと思いませんか?


けど、「画像の動的生成ってめんどくさいし、グラフと言ったら、計算もめんどくさいんじゃないの?」って思うかもしれませんが、実はこの画像はwebサービスを使って生成しています。

Google Chart API

これを使うとビックリするぐらい簡単に、いろんな形のグラフを作ることができます。

どれくらい簡単かというと、urlに必要な情報を含めてimgタグのsrcに指定するだけです。

ただ、グラフのカスタマイズを色々としようとすると、urlで指定するパラメータが多いので、自力でやるのはかなり困難です。



で、さすがgoogle。

ちゃんとウィザードを用意しています。
Chart Wizard

これを使って、作りたいグラフのフォーマットを決めたら、urlをコピーするだけ。

そのurlの一部を置き換えれば、動的にグラフを生成することが出来ます。



今回の例で作ったurlをパラメータ毎に分解すると、以下のようになります。(グラフ毎にパラメータが変わる場合があります)

・画像のサイズ
chs=500×245

・チャートの種類
cht=p3

・色

chco=3072F3

・データ
chd=t:15.3,20.3,59.7,4.5,0.2

・データのラベル

chl=Android1.5|Android1.6|Android2.1|Android2.2|Other

・マージン
chma=|0,5

・タイトル

chtt=%E3%81%BB%E3%81%AB%E3%82%83%E3%82%89%E3%82%89%E3%81%AE%E3%82%B0%E3%83%A9%E3%83%95

つまり、chdの値と、chlの値を動的に指定してあげれば、同じような形のグラフが、様々なデータで作成することが出来ます。





サンプルとして作成したページはこれです。

サンプル

何をしているかというと、ボタンを押すと表示されているデータから、urlを編集してグラフを作っています。

編集部分のソース

5行目で、thからデータのラベルのなる情報を取得しています
9行目で、tdからデータを取得しています
13行目でurlを作成して、17行目でimgタグに埋め込んで、htmlに突っ込みます。

サーバであえて処理をすることなく、ブラウザ上だけで必要な情報を集めて、グラフの生成が可能です。
こうすれば、サーバの負荷も気にする必要はありません。

これで、より分かりやすいユーザーインターフェイスを提供する方法が増えますね。

  • 2010年09月09日
  • HTML

コニット開発室

CONIT Official Tweet

CONIT Facebook FanPage

CONIT BLOG

株式会社コニット

SamuraiSmartphoneServices

Buy and take only medicines from online pharmacy ,]}$ drugs online has affordable prices. Brand name drugs Canadian pharmacy [*}: compare drug prices Canada delivering medicines at your door. Free online consultation at https://canada-pharmacy-store.com <;) order cialis highest value and quality. Is it legal to mail prescription drugs? Yes, Canadian drugs [.($ order viagra . After ordering you will be contacted by our managers and agree on the delivery details.