SQLの窓

2013年11月13日


JSONP の原理と、簡単な利用方法の実際のコード( 実装は jQuery が良いですが、Access-Control-Allow-Origin: * のほうが楽だし読込み先を制限できます )

まずは、クロスドメインでもなんでも無く、JavaScript として自分のコードでその動作の基本を作成するとこうなります。
<script type="text/javascript">
var myfunc = new Function("obj", "window.mydata = obj");

myfunc({
 "jsonp1": "ようするに",
 "jsonp2": "こういうこと"
})

alert(mydata.jsonp1 + "|" + mydata.jsonp2);
</script>

次に、JSONP と呼ばれている部分を外部にしてクロスドメインするとなるとこういう事になります
<script type="text/javascript">
var myfunc = new Function("obj", "window.mydata = obj");
</script>

<script src="http://toolbox.winofsql.jp/jsonp.php" type="text/javascript"></script>

<script type="text/javascript">
alert(mydata.jsonp1 + "|" + mydata.jsonp2);
</script>
その際、jsonp.php の中はこうなっています。
<?php
header( "Content-Type: text/javascript; Charset=utf-8" );
?>
myfunc({
 "jsonp1": "ようするに",
 "jsonp2": "こういうこと"
})

さらにこれを実用的にするには、もっといろいろテクニックがいるわけですが、jsonp.php のようなコードは、そのサイトに置くだけで誰からもアクセスする事ができるようになります。

が。

そういうスクリプトはWEBサーバが管理できない場合に使えばいいと思うので、実際は PHP 内部にでも 「Access-Control-Allow-Origin: *」 をヘッダで返すようにすればいいと思うのですが。


関連する Microsoft ドキュメント

Function オブジェクト

関連する記事

jQuery で JSONP。なるほど、良くできてる。



posted by lightbox at 2013-11-13 00:22 | JavaScript | このブログの読者になる | 更新情報をチェックする

2013年06月11日


document.createElement("a") で新しいウインドウ(タブ)を開く


いまどきはタブで開くと思いますが、昔は click() で開いたのは IE だけだったような記憶があります。Google Chrome と Firefox と IE で試しましたが、いずれも動作しました。

ただ、Google Chrome だけが、appendChild しなくても実行できました( どこにも属さない状態で動く )
<script type="text/javascript">
function openLink(url) {
	var obj = document.createElement("a");
	obj.href = url;
	obj.target = "_target";
	document.body.appendChild(obj)
	obj.click();
	document.body.removeChild(obj)
}
</script>
<input type="button" value="Open Link" onclick='openLink("http://winofsql.jp/open_link.htm");'>

開かれたほうでは、window.open 時と同じように、IE の場合のみ window.close() だけでは、確認ダイアログが表示されるので以下の『閉じる2』のようにする必要があります
<!DOCTYPE html>
<html>
<head>
<meta charset="shift_jis" />
<title>画面遷移</title>
<script type="text/javascript">
</script>
</head>
<body>
<input type="button" value="閉じる1" onclick='window.close();' />
<input type="button" value="閉じる2" onclick='(window.open("","_self")).close();' />
</body>
</html>




posted by lightbox at 2013-06-11 21:04 | JavaScript | このブログの読者になる | 更新情報をチェックする

2011年07月29日


JavaScript と VBScript のカラーコード(#RRGGBB)の文字列と数値間の相互変換

とても短いコードですが、「ええ・・・と」となりそうな内容なので。

JavaScript
var color_code = "#123456";

alert(parseInt(color_code.replace("#","0x")))

var color_num = 1193046;

alert("#"+color_num.toString(16));
VBScript
color_code = "#123456"

MsgBox Clng(Replace(color_code,"#", "&H") )

color_num = 1193046

MsgBox("#" & Hex(color_num))
CLng 関数


posted by lightbox at 2011-07-29 13:30 | JavaScript | このブログの読者になる | 更新情報をチェックする

2010年02月03日


JavaScript : CSV 形式のデータのフィールド分割

正規表現でどうするか質問されたので、ちょっと調べてみると正規表現で無理しているものしか見当たらなかったので作りました。運用した事無いので多少の調整は必要かもしれませんが、これなら誰でも改造できると思います
// 対象文字列
var x = 'a,"b,b",",,,",c';

// まず、" で挟まれた文字列を取り出す
var a = x.match(/"[^"]+"/g);

// " で挟まれた文字列をデータ上存在しない文字で置き換える
var b = x.replace(/"[^"]+"/g,String.fromCharCode(0x1a));

// その文字列をカンマで分割
var y = b.split(",");

// 分割されたフィールドに置き換えられた文字列を戻す
var n = 0;
for( i = 0; i < y.length; i++ ) {
	if ( y[i] == String.fromCharCode(0x1a) ) {
		y[i] = a[n];
		n++;
	}
}

// 結果の確認
str = "";
for( i = 0; i < y.length; i++ ) {
	str += y[i]+"\n";
}
alert(str)



posted by lightbox at 2010-02-03 23:10 | JavaScript | このブログの読者になる | 更新情報をチェックする

JavaScript : SHIFT_JIS としての文字列のバイト計算

定ピッチのフォントを使って、文字列として表示をコントロールしたい場合、日本語としての「全角/半角」を知る為の手段として有効です。
String.prototype.byteLen = function() {

	var str = this.toString();
	var len = str.length;
	var i,cd,blen=0;

	for( i = 0; i < len; i++ ) {
		blen += 2;
		cd = str.charCodeAt(i);
		if ( 0x20 <= cd && cd <= 0x7e ) {
			blen--;
		}
		if ( 0xff61 <= cd && cd <= 0xff9f ) {
			blen--;
		}
	}

	return blen;
}

alert("日本語OK".byteLen())

▼ 0xff61 〜 0xff9f(半角カタカナ)

。「」、ヲヲァィゥェォャュョッーアイウエオカキクケコサシスセソタチツテトナニヌネノハヒフヘホマミムメモヤユヨラリルレロワン゙゚


関連する記事 VBScript と Javascript の表示文字列用バイト計算
タグ:javascript
posted by lightbox at 2010-02-03 12:53 | JavaScript | このブログの読者になる | 更新情報をチェックする

2010年01月27日


JavaScript : 外部呼出しにおける SCRIPT 内で呼び出し元の charset に依存しない日本語の書き方

いずれも こんにちは という日本語ですが、unicode で記述されています。alert で表示されるもの(要するに JavaScript内の文字列)は、「unicode」ボタンで、HTML上で表示されるものは「HTML数値文字列参照」ボタンで変換できます
(function () {
	var work = {
		show: function() {
			alert("\u3053\u3093\u306b\u3061\u306f");
		}
	}
	window.test = work;
	document.write("&#12371;&#12435;&#12395;&#12385;&#12399;");
})();

関連する記事

JavaScript : 入力文字列を 変数用16進数表現 に変換する
JavaScript : 入力文字列を htmlentity に変換する
JavaScript : 外部呼出しにおける SCRIPT要素の charset 属性


タグ:javascript
posted by lightbox at 2010-01-27 09:11 | JavaScript | このブログの読者になる | 更新情報をチェックする
Seesaa の各ページの表示について
Seesaa の 記事がたまに全く表示されない場合があります。その場合は、設定> 詳細設定> ブログ設定 で 最新の情報に更新の『実行ボタン』で記事やアーカイブが最新にビルドされます。

Seesaa のページで、アーカイブとタグページは要注意です。タグページはコンテンツが全く無い状態になりますし、アーカイブページも歯抜けページはコンテンツが存在しないのにページが表示されてしまいます。

また、カテゴリページもそういう意味では完全ではありません。『カテゴリID-番号』というフォーマットで表示されるページですが、実際存在するより大きな番号でも表示されてしまいます。

※ インデックスページのみ、実際の記事数を超えたページを指定しても最後のページが表示されるようです

対処としては、このようなヘルプ的な情報を固定でページの最後に表示するようにするといいでしょう。具体的には、メインの記事コンテンツの下に『自由形式』を追加し、アーカイブとカテゴリページでのみ表示するように設定し、コンテンツを用意するといいと思います。


※ エキスパートモードで表示しています

アーカイブとカテゴリページはこのように簡単に設定できますが、タグページは HTML 設定を直接変更して、以下の『タグページでのみ表示される内容』の記述方法で設定する必要があります

<% if:page_name eq 'archive' -%>
アーカイブページでのみ表示される内容
<% /if %>

<% if:page_name eq 'category' -%>
カテゴリページでのみ表示される内容
<% /if %>

<% if:page_name eq 'tag' -%>
タグページでのみ表示される内容
<% /if %>
この記述は、以下の場所で使用します
container 終わり



フリーフォントで簡単ロゴ作成
フリーフォントでボタン素材作成
フリーフォントで吹き出し画像作成
フリーフォントではんこ画像作成
ほぼ自由に利用できるフリーフォント
フリーフォントの書体見本とサンプル
画像を大きく見る為のウインドウを開くボタンの作成

CSS ドロップシャドウの参考デモ
イラストAC
ぱくたそ
写真素材 足成
フリーフォント一覧
utf8 文字ツール
右サイド 終わり
base 終わり