7月 22

Chrome on Stylishで使ってる個人的スタイルシート

*::selection{
    background-color : #333 ;
    color : #fff ;
}

/*
 * MS Pゴシック嫌い! MS ゴシックも嫌い!
 * お前の顔もみたくない!
 * ビットマップフォント最低!
 * 適用前 : MS Pゴシック
 * 適用後 : (本文:IPA明朝、見出しその他 : M+ 1P)
 */

/*
 * MS 明朝嫌い!
 */
 
@font-face{
 font-family : "MS 明朝" ;
 src : local("Times New Roman") ;
  unicode-range: U+0000-007F;
}
@font-face{
  font-family : "MS 明朝" ;
  src : local("IPA P明朝") ;
  unicode-range: U+0080-FFFF;
}
@font-face{
  font-family : "MS P明朝" ;
  src : local("Times New Roman") ;
  unicode-range: U+0000-007F;
}
@font-face{
  font-family : "MS P明朝" ;
  src : local("IPA P明朝") ;
  unicode-range: U+0080-FFFF;
}
@font-face{
  font-family : "Georgia" ;
  src : local("Times New Roman") ;
  unicode-range: U+0000-007F;
}
/*
 * Georgiaって英字と数字で不揃いだから嫌い。
 */
@font-face{
  font-family : "Georgia" ;
  src : local("IPA P明朝") ;
  unicode-range: U+0080-FFFF;
}
/*
 * Consolas好きだけど日本語部分はMS Pゴシックになるから嫌だ。
 */
@font-face{
  font-family : "Consolas" ;
  src : local("IPA明朝") ;
  unicode-range: U+0080-FFFF;
}

@font-face{
  font-family : "arial" ;
  src : local("Times New Roman") ;
  unicode-range: U+0000-007F;
}
@font-face{
  font-family : "arial" ;
  src:   local("IPA P明朝") ;
  unicode-range: U+0080-FFFF;
}
@font-face{
  font-family : "Arial" ;
  src : local("Times New Roman") ;
  unicode-range: U+0000-007F;
}
@font-face{
  font-family : "Helvetica Neue" ;
  src : local("IPA P明朝") ;
}
@font-face{
  font-family : "Arial" ;
  src:   local("IPA P明朝") ;
  unicode-range: U+0080-FFFF;
}

@font-face{
  font-family : "Segoe UI" ;
  src : local("Times New Roman") ;
  unicode-range: U+0080-FFFF;
}
@font-face{
  font-family : "monospace" ;
  src : local("IPA P明朝") ;
  unicode-range: U+0080-FFFF;
}
@font-face{
  font-family : "helvetica" ;
  src :  local("IPA P明朝") ;
  unicode-range: U+0080-FFFF;
}
@font-face{
  font-family : "verdana" ;
  src : local("IPA P明朝") ;
  unicode-range: U+0080-FFFF;
}
@font-face{
  font-family : "Tahoma" ;
  src : local("IPA P明朝") ;
  unicode-range: U+0080-FFFF;
}
@font-face{
  font-family : "ヒラギノ角ゴ Pro W3" ;
  src : local("IPA P明朝") ;
}
@font-face{
  font-family : "trebuchet ms" ;
  src : local("IPA P明朝") ;
}
@font-face{
  font-family : "Comic Sans MS" ;
  src : local("IPA P明朝") ;
  unicode-range: U+0080-FFFF;
}
@font-face{
  font-family : "Monaco" ;
  src : local("IPA明朝") ;
  unicode-range: U+0000-007F;
}
@font-face{
  font-family : "Monaco" ;
  src : local("IPA明朝") ;
  unicode-range: U+0080-FFFF;
}
input , select{ 
  font-family : "IPA P明朝" ;
}
@font-face {
  font-family: "MS Pゴシック" ;
  src : local("IPA P明朝") ;
  unicode-range: U+0000-007F;
}
@font-face {
  font-family: "MS Pゴシック";
  src: local("IPA P明朝");
  unicode-range: U+0080-FFFF;
}
@font-face {
  font-family : "ms pgothic" ;
  src : local("IPA P明朝") ;
  unicode-range: U+0000-007F;
}
@font-face {
  font-family : "ms pgothic" ;
  src : local("IPA P明朝") ;
  unicode-range: U+0080-FFFF;
}
@font-face {
  font-family : "MS gothic" ;
  src : local("Ricty") ;
  unicode-range: U+0080-FFFF;
}
@font-face {
  font-family : "ms gothic" ;
  src : local("IPA P明朝") ;
  unicode-range: U+0000-007F;
}
@font-face {
  font-family: "MS ゴシック";  /*置換したいフォントを指定*/
  src: local("IPA明朝"); /*新しく適用させたいフォントを指定*/
  unicode-range: U+0000-007F;
}
@font-face {
  font-family: "MS ゴシック";  /*置換したいフォントを指定*/
  src: local("IPA明朝"); /*新しく適用させたいフォントを指定*/
  unicode-range: U+0080-FFFF;
}
@font-face {
  font-family : "MS UI Gothic" ;
  src : local("IPA P明朝") ;
  unicode-range: U+0000-007F;
}
@font-face {
  font-family : "MS UI Gothic" ;
  src : local("IPA P明朝") ;
  unicode-range: U+0080-FFFF;
}
/*
 * メイリオも癖があって好きになれない。
 */
@font-face {
  font-family : "メイリオ" ;
  src : local("IPA P明朝") ;
  unicode-range: U+0000-007F;
}
@font-face {
  font-family : "メイリオ" ;
  src : local("IPA P明朝") ;
  unicode-range: U+0080-FFFF;
}
@font-face {
  font-family : "Meiryo" ;
  src : local("IPA P明朝") ;
  unicode-range: U+0000-007F;
}
@font-face{
  font-family : "Meiryo";
  src : local("IPA P明朝") ;
  unicode-range : U+0080-FFFF ;
}
h1{
  font-family : "M+ 1p Black" ;
}
h2{
  font-family : "M+ 1p Black" ;
}
h3{
  font-family : "M+ 1p Heavy" ;
}
h4{
  font-family : "M+ 1p Bold" ;
}
h5{
  font-family : "M+ 1p Medium" ;
}
h6{
  font-family : "M+ 1p Medium" ;
}
strong , b , em , dt{
  font-family : "M+ 1p 06" ;
}

1月 23

漢字可能な和文フリーフォント78書体ほどの表示サンプルPDF

なんとなく、できていた。OpenOfficeでなんとなく書いていたら、できてしまっていた。後悔はしていない。

続きを読む »

1月 02

管理者権限なしでフォントをインストールする方法2選

自分の使っているPCのアカウントには管理者権限がないです。そのせいで制約が多かったりするのですが意外にも「なくても」できてしまうものは多いのです。

AMP Font Viewer

AMP Font Viewerの例

これを以前は使っていました。もともとフォントの管理をしてくれるソフトで、英語なのですが日本語化もできたりします。

これをスタートアップに立ち上げてフォントを入れたフォルダを読み込んで一時インストールすればシステムにはフォントがインストールされます。

そしてAMP Font Viewerを閉じたときにアンインストールされるという寸法です。

一時インストール方法

  1. AMP Font Viewer 日本語版からAMP Font Viewerをダウンロードします。
  2. どこかに解凍してfontviewer.exeを実行します。
  3. 「未インストールフォント」からインストールしたいフォントのあるディレクトリを選んで、「フォルダのフォント一覧」をクリックします。
  4. フォントを全て選択して「一時インストール」を実行します。

スタートアップに登録しておくと起動時にAMP Font Viewerが実行されます。当然ですが。

スタートアップに登録するにはWindows7の場合「(ユーザーディレクトリ)\AppData\Roaming\Microsoft\Windows\Start Menu\Programs\Startup」にあります。もちろんここへのアクセスも管理者権限なしでアクセスできます。ここにfontviewer.exeのショートカットを作ると起動時に実行してくれるのでいろいろ便利なのですが・・・

PortableApps.com Platform

PortableApps.com Platform

最近はこの「フォントを入れたフォルダを読み込んで一時インストール」という流れも面倒になってきたため、さらに効率の良い方法を探したところ、このPortableApps.comのランチャーで「/PortableApps.com/Data/Fonts」というフォルダにフォントファイルを入れておいてやると、勝手に読み込んでくれます。そしてStart.exeをスタートアップに登録しておくと何もしなくても管理者権限なしでフォントを一時インストールして読み込んでくれます。

方法

  1. PortableApps.com Suite and PortableApps.com Platform | PortableApps.com – Portable software for USB, portable and cloud drivesからダウンロードします。
  2. インストーラが立ち上がります。ですが安心してください。管理者権限なしで実行することができます。
  3. インストール先のディレクトリをアクセスできる範囲内に指定してインストールしてください
  4. インストールしたディレクトリの「PortableApps/PortableApps.com/」に「Data」というディレクトリを作って、さらに「Fonts」というディレクトリを作ってください。
  5. そこに一時インストールしたいフォントをコピーなり貼り付けなりしてください。
  6. インストールしたディレクトリにあるStart.exeを実行してください。

これでフォントがインストールされました。これも同様PortableApps.com Platformが実行されている間フォントが一時インストールされます。

これも同様「(ユーザーディレクトリ)\AppData\Roaming\Microsoft\Windows\Start Menu\Programs\Startup」にStart.exeのショートカットを作っておくと起動時にインストールしてくれるので便利です。

1月 01

今日のキニナル記事5選 2013/01/01

こんにちは。1月1日ですね、新年の信念はとくにありませんが「今日のキニナル記事5選」として、今日気になった記事を。

非同期処理のコードの例

Deferred/Promisesと非同期処理 – 素人がプログラミングを勉強していたブログ

いやー、JavaScriptって奥が深くて深くて。非同期処理の方法1つにしてもいろいろあるんだなぁー、と思いながら。

dotinstall

2013年も注目したい日本発の教育系サービス7選:GREAT GEEKS:ITmedia オルタナティブ・ブログ

ドットインストールは手軽にいろいろできて便利。これのおかげでEmacsやらYouTube APIやらGoogle Reader APIやら、いろいろ勉強になりました。いやはや来年もお世話になりそう。

クロシージャ

JavaScript のスコープチェーンとクロージャを理解する – tacamy memo

あまり理解してないものを無理に使うとバグの温床。だからこそ理解していないものを理解することは重要なのは分かっちゃいるけど、上のコードを書いてて何がどうなるか、はっきりと答えられるようにはならないと理解できたとはいえないのかな・・・?

IEに高レベル脆弱性

JVNVU#92426910: Internet Explorer に任意のコードが実行される脆弱性

何でもいいから早くIEのシェア減ってくれないかな。っていうよりもJVMの皆様、大晦日にもご苦労様です。コンピュータウイルスは晦日も新年も関係なく感染するものは感染しますからね。

HTML 5.1

HTML 5.1 Nightly

もう時代はHTML 5.1ですよHTML 5.1。HTML 5が勧告候補なんだからHTML 5.1に。個人的に興味深いのはtranslate属性。

12月 30

WikiPedia日本語版の記事総数をデータにしてみた

WikiPediaの1日あたりの記事増加量

WikiPedia日本語版の記事総数をWebアーカイブを元にデータにしてみました。とはいえ不定期なのでデータがばらばらなので1日あたりは平均しての数になります。

日本語記事データ(Open Document SpreadSheet形式/138KB(上のグラフとともに文書ライセンスはGPDLとします。)

その結果、

  • 2003/02/10~2003/04/08の間に記事の総数が75倍になり、1日あたり83記事のペースで増えていること
    • 2003/01/20~2003/02/01の間は1日あたり3.25、2003/02/10~2003/04/01の間は1.44の記事増加。
    • 次の2003/04/08~2003/06/04の間は1日あたり29.74というところからも、この急激な増加はどうなってるんだよっていう感じがします。
  • 2004/06/06~2004/06/10の4日間の間に記事数が1日あたり1265も増えていること
    • 4日の間に追加された記事総数は5062。6日の記事総数の1割弱という異常な数をたたき出している。
  • 2010/09/07~2010/09/24の間にも1日あたり370記事のペースで増加。ちなみに8/20~9/7の間は76増加のペース。
  • 記事総数が減っている日は調べた限り見受けられなかった。
    • WikiPediaは新規記事作成はしやすいが削除はし辛いという風潮がみえてくる。
  • 1日あたりの記事増加率(平均値)を平均すると239。最近はそれより多くなることはめったにない。
    • ’06~’07年頃には普通に350~450、多いときで548とかあった。

12月 26

7ウェイト展開の明朝フォント「あおぞら明朝」をリリース

極太明朝、極細明朝を含む「あおぞら明朝」フォント。

フリーの極太明朝フォントって無いんですね。知りませんでした。

フリーで7ウェイト以上展開のフォントってM+とRounded M+のみなんですね。知りませんでした。(商用お試しを除けば)

無い。よし、じゃぁ作ろう。そう思ってできたのがIPA P明朝をベースにした「あおぞら明朝」です。クリスマスの日にもPCはfontforgeにタスクを優先させ見守っていたりしました。はい。

“新聞の見出しのような活気溢れる太明朝”といういかにも需要の高そうなフォントがこれまでフリーにないというのは悲しい事態です。というよりフリーフォントってウェイト展開多いのないですよね。M+フォントは7ウェイト展開でそこを見れば実用的ですが収録文字数が少ない。商用フォントではフォントのウェイトは一通り揃ってることが多いのに。

もっとも作ってみて、やっぱり太さのバリエーションには時間がかかる。IPAフォントの場合12,000文字もあるせいで、7ウェイト作るのに半日中動かしても2~3日はかかる。(まぁいろいろ試したりもしていましたが。)

その分12,000文字収録の7ウェイトフォントが出来上がった、そういう結果になりますが。

IPAフォントベースなんでライセンスもIPAフォントライセンスv1.0を継承します。

あおぞら明朝についてもっと知りたいって人はぜひ。

PDFの表示サンプルとかも作りました。

11月 18

Notepad++のプラグイン「Function List」を編集中に強制終了させない

Function List 2.1.0.1のある図

Notepad++のプラグイン「Function List」は編集中にほとんどの確率で強制終了します。これを回避するには、v2.1.0.1にアップデートしましょう。

Plugin Manager見てもそこのアップデートは出てこないのですが、Souceforgeのフォーラム(英語)を見てみるとこの件の改善策にアップデートしろって回答があったようです。

ちなみにこのバージョンからWindows PowerShellがサポートされました。Windows標準でISEが付いてきますがそれでも、っていう人は。

version 2.1.0.1のFunction Listプラグイン(直リンク/ https://souceforge.net/)からダウンロードしてNotepad++の「Plugin」ディレクトリに入れたら編集時も安定します。

9月 24

HTML5&CSS&JSでWindows 7やVista向けのアプリを作る方法

HTML5とCSS3でWindowsアプリを開発する方法(9x系~8まで対応)

モバイルアプリ開発ではHTML5やCSS3、JSを使った開発が主流になりつつありますが、そんな中Windowsでのアプリ開発は8からMetroスタイルでサポートされたものの、7までは使えません。

しかし、IEに付いているある技術を掘り起こすことでこの悩みは解消できます。

この技術はIE5からサポートされているので、HTML5やCSS3など新技術を使わないのであればWindows 95でも動かせます。

そしてなによりOS標準付属。つまりメモ帳とIEさえあれば開発できちゃうということです。

なおここでは趣旨はHTML5とCSS3なので、IE9を使います。WindowsXPを使ってる人はIE8でガマンしてください。

とりあえず作ってみる

このHTML5&CSS3&JavaScriptで開発できる技術はHTAです。いわゆる。なんか全然流行りませんでしたが、HTML5やCSS3、JSでソフト開発が主流になってきている現代、注目されてもいいはずです。説明ばっかりしていてもなんですので、Hello , Worldをやってみましょう。MSDNから引っ張ってくると、

  Hello, World

すごいシンプルです。業界標準もへったくれもありゃしません。これをテキストエディタで拡張子を.htaにして保存すれば確かに「Hello , World」とウィンドウが表示されてその中に出力されていることがわかります。

ですが、これでは考えたら分かりますがレタリングモードがQuirks。HTML5やCSS3を使う分にはちゃんと表示させたいので、

<!DOCTYPE html>
<html lang="ja>
  <head>
    <meta charset="UTF-8" >
    <title> HTAテスト </title>
    <style>
      *{
        padding : 0px ;
        margin : 0px ;
      }
      div{
        width : 600px ;
        padding : 15px ;
        margin : 0 auto ;
        margin-top : 15px ;
        background-color : skyblue ;
        border : solid 1px skyblue ;
        border-radius : 15px ;
        -ms-border-radius : 15px ;
      }
    </style>
  </head>
  <body>
    <div>Hello , World!</div>
  </body>
</html>

こうしたら角丸のついた背景で「Hello , World」・・・と表示されると思いたいのですが、そうはいきません。何が間違っているのでしょうか。ユーザーエージェントを調べてみましょう。

ちなみに、title要素に指定した内容がタイトルバーに表示されます。

<!DOCTYPE html>
<html lang="ja>
  <head>
    <meta charset="UTF-8" >
    <title> HTAテスト </title>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
    <script>
      $(function(){
        $("div").html(navigator.userAgent) ;
      })
    </script>
    <style>
      *{
        padding : 0px ;
        margin : 0px ;
      }
      div{
        width : 600px ;
        padding : 15px ;
        margin : 0 auto ;
        margin-top : 15px ;
        background-color : skyblue ;
        border : solid 1px skyblue ;
        border-radius : 15px ;
        -ms-border-radius : 15px ;
      }
    </style>
  </head>
  <body>
    <div>Hello , World!</div>
  </body>
</html>

これを.htaにして、文字コードはUTF-8で保存して実行すると・・・

Mozilla/4.0 (compatible; MSIE 7.0; Windows NT 6.1; Trident/5.0; SLCC2; .NET CLR 2.0.50727; .NET CLR 3.5.30729; .NET CLR 3.0.30729; Media Center PC 6.0; .NET4.0C)

そうなんです。これ、標準ではIE7でレタリングしよるんです。IE8が入ってても9が入ってても7です。どうにかならんもんか。これでは「HTML5&CSS3」ではなく「HTML4.01&CSS2.1」になってしまいます。

IEのレタリングモードを強制的に変える

そういえば、レタリングモードをIEでは<meta>タグを用いて変更することができました。ためしにこの方法をとってみましょう。

<!DOCTYPE html>
<html lang="ja>
  <head>
    <meta charset="UTF-8" >
    <meta http-equiv="X-UA-Compatible" content="IE=9" />
    <title> HTAテスト </title>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
    <script>
      $(function(){
        $("div").html(navigator.userAgent) ;
      })
    </script>
    <style>
      *{
        padding : 0px ;
        margin : 0px ;
      }
      div{
        width : 600px ;
        padding : 15px ;
        margin : 0 auto ;
        margin-top : 15px ;
        background-color : skyblue ;
        border : solid 1px skyblue ;
        border-radius : 15px ;
        -ms-border-radius : 15px ;
      }
    </style>
  </head>
  <body>
    <div>Hello , World!</div>
  </body>
</html>

こうすれば、IE9がインストールされていればユーザーエージェントはIE9のもので表示され、さらに角丸になってくれます。補足ですが、JSON.parseやdocument.querySelectorAllなどIE7で対応していないものもちゃんと使えます。

さて、IE9で表示できたところで、他の機能についていろいろ見ていきましょう。

<HTA:APPLICATION>タグ

HTA:APPLICATIONタグは、HTAに関していろいろ設定できる機能です。たとえばコンテキストメニューの無効(JavaScriptから右クリックのハンドルは受け取れる)、タイトルバーや最小化ボタンの表示の有無など。

ActiveXコンポーネント

書くのが面倒なんで自力で調べちゃってください。実はこのHTAやWindows Scripting Hostなどの界隈では、JScriptはそんなに人気が無くVBScriptが主流だという事実がありますが・・・。

ActiveXObjectとググればその他もろもろ色んなAPIが見つかると思います。

もちろん、IE9なのですからjQueryプラグインなどJavaScriptライブラリも使えます。その系でいろいろ実装しちゃうのもいいでしょう。たとえばCodeMirrorでシンタックスハイライト可能なテキストエディタを作ったり。

最後の方はちょっと投げやりですが、とにかくHTML5やCSS3やJavaScriptを使ったOSネイティブのデスクトップアプリをOS標準の機能だけで実装するというものでしたー

9月 23

Webサイトを制作するためのフリーなタダなソフトウェア

書店や図書館でWebサイト制作関係の本を探していると、Adobe PhotoShopやAdobe Dreamweaverの解説書が山ほど出てくる割に、GIMPやその他もろもろのソフトはほとんど出てきません。正直、こんな高価なソフトを買わないとWebサイト制作ってできないの!? と誤解をまねきそうな気がします。というわけでフリーでもそれなりのWebサイトを作るためのソフトをいくつか紹介。

テキストエディタ/HTMLエディタ

テキストエディタ/HTMLエディタは高価なソフトでは「Adobe Dreamweaver」などが挙げられますが、それ以外にもたくさんあるんです。

HTMLエディタ

  • BlueGriffon MozillaベースのHTMLエディタ。HTML5対応など有料ソフトに引けをとらない機能がある。でもアドオンは有料・・・
  • Kompozer Nvuというエディタから派生した上と同じMozillaベースのHTMLエディタ
  • OpenOffice.org Writer-web OpenOffice.org付属のHTMLエディタ。ただしそんなに使えないことに注意

テキストエディタ

オフライン

いわゆるインストールして使う系

  • Notepad++ 色々便利な機能が詰まったテキストエディタ。
  • Emacs Linuxとか使ってるプログラマが好んでいるらしい
  • Vim Linux界隈ではEmacsと二大勢力で対立しているらしい。
  • xyzzy EmacsをLinuxで使ってる人がWindowsで使う場合
  • サクラエディタ かなり設定項目豊富なテキストエディタ。
  • Terapad シンプルなテキストエディタ。
  • Crescent Eve HTMLを書くのに特化したエディタ。
  • Adobe brackets オープンソースのAdobeが開発したHTMLエディタ
  • メモ帳/TextEdit さすがにこの辺はあまり向いてない。標準の状態でも使えるとはいえ。

オンライン

インストールとかしなくてもWebブラウザ上から使えてしまう系

  • JS Fiddle サクッと確認したいときに便利なエディタ。対応しているライブラリのバージョンの設定が強力。それと共有とかしやすい。
  • HTML Instant サクッとHTMLを書きたいときには使いやすい。あとIEでも動く
  • Liveweave サクッと確認したいときに便利なエディタ。
  • CSSDesk HTMLとCSSの編集に特化した系。
  • CSSizer.com こちらも趣旨的には上と同じ。書きやすさはこっちが上
  • Online code editor エディタとしては超シンプル。ところがテンプレート的が豊富
  • Real-time HTML Editor シンプルの極み。
  • Amy Editor HTMLのみならずプログラムコードを書く用のテキストエディタ。
  • Neutron Drive Google Drive上のテキストを編集するのに向いている
  • ShiftEdit Dropbox上のテキストを編集するのに向いている。なんか挙動がおかしいけどHTMLのプレビュー機能付き
  • jsdo.it いろんなところからライブラリが持ってこれる。共有重視
  • BIEditor 筆者が作ったエディタ。

主なものでもこんなに。HTMLでちょこまかタグ打ちをする人にとってはAdobe Dreamweaverなんて買わなくても十分なのさ

画像編集ソフト

高価なソフトでは「Adobe PhotoShop/Illustrator」や「SAI」などが挙げられますが、フリーソフトにだっていいものがあるんです

オフライン

  • GIMP フリーソフトの画像編集ソフトでは多分シェア1位
  • OpenOffice.org 図形描画 存在忘れてません? これもそこそこ使えますよ
  • ペイント そんなに・・・っていうか全然機能ないですけど

この手のソフトにはそんなに詳しくないです・・・

オンライン

  • Pixlr だいぶ・・・いやかなり高性能なソフト
  • Sumo.fm これも画像編集ソフトとしては性能がいい。
  • Adobe Photoshop Express Express版なら無料で使えるんです。知ってました?
  • Google Drive画像描画 存在感がないように思いますが忘れてませんか?
  • SVG-edit SVG形式の、つまりベクター系の画像を編集できる

9月 23

スパム対策のメールアドレスにJavaScriptを使う

スパム対策にはいくつか方法がありますが、確実なのは画像にするのと、JavaScriptで難読化することのようです。

・・・というわけで、JavaScriptスパム対策の方法を「hogehoge@forexample.com]の例で少し見てみたいと思います。

メールアドレスを分解する

var user = "hogehoge" ;
var atmark = "@" ;
var domain = "forexample" ;
var dot = "." ;
var data = "com" ;
document.write( user + atmark + domain + dot + data)

メールアドレスをいくつかに分解してしまいます。ただし、この状態では少し賢いスパムは認識してしまいます。

toLowerCaseとtoUpperCaseを活用する

var user = "hogehoge".toLowerCase().toUpperCase().toLowerCase() ;
var atmark = "@" ;
var domain = "forexample".toLowerCase().toLowerCase() ;
var dot = "." ;
var data = "com".toUpperCase().toLowerCase() ;
document.write( user + atmark + domain + dot + data)

toLowerCaseで大文字にしたり小文字にしたりを繰り返します。これで単なる連結ではなく文字列にある程度の操作を加えているのでスパムに合う可能性が減ります。toStringや、数字があるのならparseIntなんかを使うのもいいでしょう。

関数をいくつか呼んでやる

String.prototype.getElementsByClassName = function(s){ return s } ;
String.prototype.getElementById = function(s){ return s } ;
String.prototype.parseInt = function(s){
    var str = "" ;
    for(var i = 0 ;i < 100 ; i ++){
        if(i % 3 == 0 && i % 5 == 0)
            str += "FizzBuzz\n" ;
        else if(i % 3 == 0)
            str += "Fizz\n"
        else if(i % 5 == 0)
            str += "Fizz\n" ;
        else
            str += i + "\n"
    }
    return s;
}
var user = "hogehoge".toLowerCase().toUpperCase().toLowerCase().getElementsByClassName(user).getElementById(user) ;
var atmark = "@".parseInt(atmark).getElementsByClassName(atmark) ;
var domain = "forexample".parseInt(domain).toLowerCase().toLowerCase() ;
var dot = ".".getElementsByClassName(atmark).getElementsByClassName(dot) ;
var data = "com".toUpperCase().toLowerCase() ;
document.write( user + atmark + domain + dot + data)

String.prototypeオブジェクトにメソッドを追加してやり、無理やり拡張して動かしてやります。このときFizzBuzzでもHello , Worldでもなんでも、とりあえず無意味なプログラムを書いておいてやるとさすがに追ってこないでしょう。

ソースコードの難読化

eval(function(p,a,c,k,e,r){e=function(c){return(c<a?'':e(parseInt(c/a)))+((c=c%a)>35?String.fromCharCode(c+29):c.toString(36))};if(!''.replace(/^/,String)){while(c--)r[e(c)]=k[c]||e(c);k=[function(e){return r[e]}];e=function(){return'\\w+'};c=1};while(c--)if(k[c])p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c]);return p}('I(y(p,a,c,k,e,r){e=y(c){z c.F(a)};A(!\'\'.D(/^/,C)){B(c--)r[e(c)]=k[c]||e(c);k=[y(e){z r[e]}];e=y(){z\'\\\\w+\'};c=1};B(c--)A(k[c])p=p.D(G H(\'\\\\b\'+e(c)+\'\\\\b\',\'g\'),k[c]);z p}(\'h.8.2=d(s){c s};h.8.m=d(s){c s};h.8.e=d(s){1 a="";u(1 i=0;i&t;q;i++){b(i%3==0&&i%5==0)a+="p\\\\n";f b(i%3==0)a+="j\\\\n"f b(i%5==0)a+="j\\\\n";f a+=i+"\\\\n"}c s}1 7="o".6().l().6().2(7).m(7);1 4="@".e(4).2(4);1 9="r".e(9).6().6();1 g=".".2(4).2(g);1 k="v".l().6();w.x(7+4+9+g+k)\',E,E,\'|J|K||L||M|N|O|P||A|z|y|Q|R|S|C||T|U|V|W||X|Y|Z|10||11|12|13|14|15\'.16(\'|\'),0,{}))',62,69,'||||||||||||||||||||||||||||||||||function|return|if|while|String|replace|34|toString|new|RegExp|eval|var|getElementsByClassName|atmark|toLowerCase|user|prototype|domain|parseInt|else|dot|Fizz|data|toUpperCase|getElementById|hogehoge|FizzBuzz|100|forexample|lt|for|com|document|write|split'.split('|'),0,{}))

もはやだれにも読めません。JavaScript Compression/packer/を何度か繰り返し用いて、圧縮率を犠牲にソースコードの難読化を行います。こんな状態のソースをわざわざ実行とかするほど、スパムも暇ではないでしょう。

古い記事へ «