| 06 | 2026/07 | 08 |
| 日 | 月 | 火 | 水 | 木 | 金 | 土 |
|---|---|---|---|---|---|---|
| 1 | 2 | 3 | 4 | |||
| 5 | 6 | 7 | 8 | 9 | 10 | 11 |
| 12 | 13 | 14 | 15 | 16 | 17 | 18 |
| 19 | 20 | 21 | 22 | 23 | 24 | 25 |
| 26 | 27 | 28 | 29 | 30 | 31 |
[PR]上記の広告は3ヶ月以上新規記事投稿のないブログに表示されています。新しい記事を書く事で広告が消えます。
今の職場の近くに丸亀製麺がある。
値段も手ごろで、トッピングも自分でカスタマイズできるので、
利用することが多い。
食欲があまりないときにもちょうどいいし。
1/27に行ったときには、新メニューがあった。
「こだわり玉子のチーズ釜玉」
「うどんにチーズかぁ・・・」
と思って躊躇していたら、
一緒に行ったＡ氏が挑戦してみるというので、
自分も乗ってみた。
上に乗せる玉子は、
「こだわり玉子」（生）か「温泉玉子」を選べたので、
自分もＡ氏も温泉玉子にした。
ところが、店員のおばちゃんが
「こだわり玉子の方が断然おいしいよ。」
というので、Ａ氏はこだわり玉子に変更した。
そうしたら、自分の方もこだわり玉子になってしまった。
生の卵黄は好きだけど、卵白が苦手。
でも一応食べられるからそれを甘んじて受け入れた。
味の方は、
「まずくはないんだけど、やっぱ卵白がなぁ・・・」
という感じでした。
温泉玉子だったら、また違った感じになってたのかな？
[0回]
現在携わっているプロジェクトで開発中のシステムが
やたらと「記号」に対して脆弱である。
（一応リリースはしたけど・・・）
そこで、記号に対して強いシステムを作るポイントを少しずつまとめていく。
ちなみに
・ASP.NET(VB)
・Oracle 10g
が前提。
【ポイント１】
「プログラムによってJavaScriptを動的に生成する際、シングルクォーテーションや円記号の扱いに注意する。」
DBから取得したデータの値を含んだJavaScriptをHTML上に展開する際、シングルクォーテーションや円記号が含まれていると、JavaScriptの構文エラーとなり、正しく動作しなくなる。
極端な例であるが、DBから取得した値をダイアログに表示させるスクリプトを動的に生成したとする。
例：alert('名称');
データが「MOS BURGER」の場合、
alert('MOS BURGER');
となり、正しく動作する。
しかし、データが「McDonald's」の場合、
alert('McDonald's');
となり、動作しない。
対策として、文字列を囲う文字をダブルクォーテーションに変更するという方法もあるが、
文字列にダブルクォーテーションが含まれていた場合、同じ問題が発生する。
そこで、「'」を「\'」に置換してから、展開するようにする。
ただし、円記号もJavaScript上では特殊文字であるので、「\」を「\\」に置換する必要がある。
■検証
テキストエディタに
<script>alert('McDonald's');</script>
と入力し、test1.htmlとして保存。
テキストエディタに
<script>alert('McDonald\'s');</script>
と入力し、test2.htmlとして保存。
test1は何も起きないが、test2の方はちゃんとアラートが表示される。
-------------------------------------------------------------------------
得意先検索ポップアップの一覧に「McDonald's」が表示されると、
チェックボックスにチェックを入れて選択ボタンを押しても
「選択されていません。」と出るのは、
シングルクォーテーションによってJavaScriptが壊れたからです。
（今のプログラム、作り悪すぎ・・・）
-------------------------------------------------------------------------
↓↓↓ システム屋なら読んでおいて損はないかも。
[1回]
前回の続き。
「Get Code」ボタンを押すと以下の２つのコードが得られる。
■コード１
「1.ページにJavaScript SDKを含めます(理想的には、<body>のすぐ後に配置します)。」
<div id="fb-root"></div>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/ja_JP/all.js#xfbml=1";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
■コード２
「2.プラグインを表示したい場所にプラグインのコードを配置します。」
<div class="fb-like" data-href="http://atchi.blog.shinobi.jp/" data-send="false" data-width="450" data-show-faces="false"></div>
コード１はFacebook用のJavaScriptを
読み込むためのコード。
コード２は、実際に「いいね！」ボタンを
表示するためのコード。
さきほどの設定内容が
コードに反映されているのが分かる。
Send ButtonとShow Facesのチェックを
外して取得した状態。
テンプレートの編集で、
このコードを指示通りの箇所に記述すれば、
難なく「いいね！」ボタンが設置される。
ここで注意しなくてはならないのが
コード２の「data-href」という属性。
ここで設定するURLが「いいね！」の対象となる。
トップページに設置するのであれば、
「data-href」は固定でいいが、
ブログの各エントリに設置するのであれば、
これを動的に変える必要がある。
つまり、14番目のエントリであれば、
http://atchi.blog.shinobi.jp/Entry/14/
となってほしいし、3番目のエントリであれば、
http://atchi.blog.shinobi.jp/Entry/3/
となっている必要がある。
そこで、「変数」の出番となる。
忍者ブログには独自構文が用意されており、
各種データを変数で取得できる。
（一覧はここを参照）
変数の利用方法は、HTMLに
<!--$変数名-->
と記述する。
「g_user_id」（あなたのID）と
「entry_link」（詳細記事のURL）を
結合させて利用すればよいので、
data-hrefの値を
http://<!--$g_user_id--><!--$entry_link-->
に書き換える。
ちなみに、
<!--$g_url--><!--$entry_link-->
とすると、スラッシュが１つ余分に入ってしまう。
書き換えたコード２を、
制御構造である<!--entry-->の
セクション内に記述すれば
各エントリに対する「いいね！」ボタンが
設置できたことになる。
あとは微調整すればＯＫ。
[1回]
活動の記録をWebに残したい、
文章力を向上させたい、
2012年こそは何か始めたい、
そんな思いからブログを始めてみました。
稚拙な文章・内容ですが、
お付き合いいただけたら幸いです。