2011年3月31日 星期四

Flash 儲存資料

Flash 不能和資料庫直接連結,不過要儲存資料的話有以下兩種方法

1. 儲存 在 本機的 cookie

2. 透過 HTTP GET 或 POST 的方式 向中介網站(PHP,ASP,JSP,...)等 再向資料庫溝通

2011年3月30日 星期三

心得 SQL 查詢資料效率

感覺這好像是常識,不過看到還是提一下,舉例來說

資料庫裡有一個table 欄位有
Email,FirstName,LastName,Password,PhoneNumber,UserId
等六個欄位

使用 select * 的 話 比 select 'Password' 所花費的效能就有些差距












圖一 select* 所花得 CPU time 有 3533












圖二 select 'Password' 所花得 CPU time 有 2555



所以不要為了省事 還是老老實實的選取所要用的欄位~

轉貼 AC3 讀取傳送JSON

假設有一個JSON 紀錄學生 id 和 name

[
{"id":"001","name":"Andy"},
{"id":"002","name":"Ben"},
{"id":"003","name":"Chris"},
{"id":"004","name":"Dora"}
]


資料放在Localhost 的本端資料庫上



以下是AC3 的語法





import com.adobe.serialization.json.JSON;


/// Set db path
var url:String = "http://localhost:8888/getStudentJSON"; /// 註1
var urlRequest:URLRequest = new URLRequest(url);

//宣告變數
var LODAR:URLLoader = new URLLoader();

//讀取
LODAR.load(urlRequest);

//監聽事件,當傳輸結束呼叫 decodeJSON function
LDR.addEventListener(Event.COMPLETE,decodeJSON );


function decodeJSON(evt:Event):void
{
/// 宣告 student 陣列
var student:Array = JSON.decode(URLLoader(evt.target).data);

/// 取得每個學生的姓名
for (var i=0; i<student.length; i++) {
trace( student[i].name );
}
}



註1
遠端的位置

參考:

[1] as3corelib

[2] as3 讀取和發送JSON

Flash CS5 引用外部 library 以 com.adobe.serialization.json.JSON 為例







要引用外部的函式庫的話,在CS5 的環境下,流程是這樣


1. 先下載函式 這裡我以 JSON 的函式為例

到這裡下載 https://github.com/mikechambers/as3corelib/blob/master/src/com/adobe/serialization/json/JSON.as

2. 解壓縮

3. 打開CS5

4. 在CS5 選擇 編輯->偏好設定


5. 類別中選擇 ActionScript, 之後在語言 地方 點 ActionScript3.0設定



6. 在 來源路徑中選擇 剛剛解壓縮的資料夾下面的 SRC 資料夾位置


7. 點下 確定 完成設定




之後就可以順利在 ActionScript 中 import 函式庫了

import com.adobe.serialization.json.JSON;

轉貼 Flash AC3 讀取外部資料

AC3 不同於 AC2 在讀取外部資料(或資料庫)的方式,採用不同語法 ,是用 urlRequest 和 URLLoader 的方式來接資料, 而 AC2 是用 Loadvars 的方式, 所以想使用AC3 開發的話,看到 Loadvars 就可以略過了。


以下是簡單的code:




/// Set path
var url:String = "http://localhost:8888/hello"; /// 註1
var urlRequest:URLRequest = new URLRequest(url);

var LDR:URLLoader = new URLLoader();

LDR.load(urlRequest);

//LDR.dataFormat = URLLoaderDataFormat.; /// 註2

LDR.addEventListener(Event.COMPLETE,Loadcomp);

function Loadcomp(event:Event){
trace(LDR.data);
}




註1
所請求的網址,可以是PHP,JSP,Servlet,XML or txt 檔

註2( [2])
接收資料類型
a. BINARY : String = "binary"
[靜態] 會指定以原始二進位資料的形式接收下載的資料。
b. URLLoaderDataFormat TEXT : String = "text"
[靜態] 會指定以文字的形式接收下載的資料。
c. URLLoaderDataFormat VARIABLES : String = "variables"
[靜態] 會指定以 URL 編碼的變數形式接收下載的資料。


參考:

[1] ActionScript3 (AS3) URLLoader 讀取外部變數

[2] ActionScript 3.0 語言和組件參考

2011年3月25日 星期五

轉貼 Parse XML using JQuery

xml 來交換文字訊息算是不錯的方式,所以查了一下就轉貼一下用法


範例code

1. XML


<?xml version="1.0" encoding="utf-8" ?>
<RecentBooks>
<Book>
<Title>My Cool Book Title</Title>
<Description>The my cool book is possibly the best cool book in that any developer could use to be a great web designer.</Description>
<Date>12/1/2010</Date>
</Book>
<Book>
<Title>Another PHP book</Title>
<Description>Learn everything about PHP with 'Another PHP book,' your ultimate guide to the ins and outs of PHP.</Description>
<Date>4/1/2010</Date>
</Book>
<Book>
<Title>jQuery Techniques</Title>
<Description>jQuery techniques runs you through real life examples of jQuery from beginner to expert</Description>
<Date>6/2/2010</Date>
</Book>
<Book>
<Title>MySQL Database Book</Title>
<Description>Brush up your knowledge with the best MySQL database book on the market.</Description>
<Date>14/2/2010</Date>
</Book>
</RecentBooks>





2. JQuery Code



$(document).ready(function () {
$.ajax({
type: "GET",
url: "books.xml",
dataType: "xml",
success: xmlParser
});
});

function xmlParser(xml) {

$('#load').fadeOut();

$(xml).find("Book").each(function () {

$(".main").append('<div class="book"><div class="title">' + $(this).find("Title").text() + '</div><div class="description">' + $(this).find("Description").text() + '</div><div class="date">Published ' + $(this).find("Date").text() + '</div></div>');
$(".book").fadeIn(1000);

});

}





3. 網頁上 加一個 div tag 名為 'main'



不過值得注意的是 XML 只限讀取同一網域的文件, 若要使用這種功能的話只能用JSON的方式


參考網頁: http://papermashup.com/parse-xml-with-jquery/

2011年3月11日 星期五

轉貼 javascript 修改背景圖片

如提, 以下範例是 將 header 這個 id 名稱的背景切換


在html 中有一個 header

<div id="header"> </div>




function ChangeBackground(){

var header = document.getElementById('header');
header.style.background = "url(/images/test.gif)";

}



參考自
javascript 修改背景图片!

母網頁呼叫 iframe 子網頁函式

如題,若使用iframe 想從母網頁呼叫子網頁的變數,可以利用以下的 function

注意, 要用 setTimeout否則 母網頁會不認識 子網頁的變數 ,以下的方式我在IE 和 FireFox 中試過可行


setTimeout("ShowChildMessage()",0);

function ShowChildMessage(){
/// Set Weather
var child =top.frames[0];

// alert(child);
/// 子網頁的function
child.Show();
}






參考

1. IE6中Js第一次不执行,刷新后才执行


2. 有没有办法一次改变框架中的两个页面

2011年3月10日 星期四

轉貼 html input text 和 password 長度不一致

搜尋了一下 , 原因是因為 編碼的部份不一樣,在中文預設的瀏覽器下,text 格式的內容會是中文形式的編碼,但是password 格式的編碼固定是英文的編碼

解決的方是有以下

1. 用 css 設定 text 和 password 的width 屬性


<input type="text" style="width:170;" name="test1">
<input type="password" style="width:170;" name="key1">


2. 用 css 設定 input 的字型 + 用 css 設定 text 和 password 的size屬性

<input type="text" size="20" name="test1">
<input type="password" size="20" name="key1">



input {
font-family:'Verdana';
}



參考來源
1. java word,請問如何令 Input text 及 password 長度變一致??

2. 解决IE下input=text和input=password的长度不一致

2011年3月9日 星期三

Google App Engine 中使用圖形驗證碼

網頁上在註冊或登入時常會看到 請輸入旁邊圖片所顯示的文字 來當做驗證碼的功能,比較專業的說法叫做 CAPTCHA (Completely Automated Public Turing Test to tell Computers and Humans Apart)(參考1) 。

不過想要在 google app engine 上要 使用 java 自行產生的話 目前是沒有辦法的,因為BufferedImage 在 google app engine 沒有支援.....

還好搜尋了 一下找到了 reCAPTCHA 這個網站, 不久前也被Google 買下了, 不過也應為如此功能擴大很多,原本好像只有支援php 等少數語言


圖 reCAPTCHA

步驟大該如下
1. 到網頁(http://www.google.com/recaptcha/captcha)輸入Domain Name 申請驗證碼 , public key 和 private key 都要記得

2. 下載 lib (我這裡是用java 為範例,http://code.google.com/p/recaptcha/downloads/list?q=label:java-Latest)

3. 解壓縮 將 recaptcha4j-X.X.X.jar import 到專案中

4. 在專案的驗證碼加入以下的code, 包含定義 驗證後的頁面


範例code 如下

captchTest.jsp


<%@ page import="net.tanesha.recaptcha.ReCaptcha" %>
<%@ page import="net.tanesha.recaptcha.ReCaptchaFactory" %>

<html>
<body>
<form action="captchResult.jsp" method="post">
<%
ReCaptcha c = ReCaptchaFactory.newReCaptcha("your_public_key", "your_private_key", false);
out.print(c.createRecaptchaHtml(null, null));
%>
<input type="submit" value="submit" />
</form>
</body>
</html>



captchResult.jsp

<%@ page import="net.tanesha.recaptcha.ReCaptchaImpl" %>
<%@ page import="net.tanesha.recaptcha.ReCaptchaResponse" %>

<html>
<body>
<%
String remoteAddr = request.getRemoteAddr();
ReCaptchaImpl reCaptcha = new ReCaptchaImpl();
reCaptcha.setPrivateKey("your_private_key");

String challenge = request.getParameter("recaptcha_challenge_field");
String uresponse = request.getParameter("recaptcha_response_field");
ReCaptchaResponse reCaptchaResponse = reCaptcha.checkAnswer(remoteAddr, challenge, uresponse);

if (reCaptchaResponse.isValid()) {
out.print("Answer was entered correctly!");
} else {
out.print("Answer is wrong");
}
%>
</body>
</html>



詳細的流程也可以參考 http://gaejexperiments.wordpress.com/2010/02/22/episode-15-using-a-captcha-in-your-google-app-engine-application/

參考
1. wiki 的定義
2. Google reCAPTCHA Doc

2011年3月8日 星期二

Google App Engine Session 保存時間

在google app engine 中 若要設定 session 的保留時間可以在 web.xml 中 加入以下的敘述

範例是設 90 分鐘



<session-config>
<session-timeout>90</session-timeout>
</session-config>

轉貼 Google App Engine Session 紀錄刪除

Google app engine(GAE) 將 session 的功能 打開之後,變會將所有的session 資料紀錄在

_ah_SESSION

這個JDO 資料庫欄位裡, 不過卻不會刪除的樣子, 積年累月下來也是佔一筆很可觀的資料空間

google 了一下 找到以下的解答

在 web.xml 中加入以下的code


<web-app...>
<servlet>
<servlet-name>_ah_sessioncleanup</servlet-name>

<servlet-class>com.google.apphosting.utils.servlet.SessionCleanupServlet</servlet-class>
</servlet>

<servlet-mapping>
<servlet-name>_ah_sessioncleanup</servlet-name>
<url-pattern>/_ah/sessioncleanup</url;-pattern>
</servlet-mapping>

<security-constraint>
<web-resource-collection>
<web-resource-name>session-cleanup</web-resource-name>
<url-pattern>/_ah/sessioncleanup</url-pattern>
</web-resource-collection>
<auth-constraint>
<role-name>admin</role-name>
</auth-constraint>
</security-constraint>
...
</web-app>


此外 在 cron.xml 新增 以下的程式碼,沒有的話就在web-inf 下新增一筆


<cronentries>
<cron>
<url>/_ah/sessioncleanup?clear</url>
<description>Clean up sessions</description>
<schedule>every day</schedule>
</cron>
...
</cronentries>


http://groups.google.com/group/google-appengine-java/browse_thread/thread/4f0d9af1c633d39a?pli=1