UTRUST信諾科技有限公司: 3月 2011

2011年3月28日星期一

D0002雲端服務 CDN Host

文： Canboo T.

CDN Host，是幫一些JavaScript Framework函式庫做異地Host服務，讓網路瀏覽者透過CDN(Content Delivery Network)抓取欲使用到的JavaScript Framework的速度（如JQuery Framework、YUI Framework）不會因所在地而影響到存取速度。
比如說，貴公司的網站主機擺放在美國，而網站使用到JQuery Framework 1.5.1的檔案，可能會因為使用者為了要存取這隻js而影響到整個頁面的存取速度。為了因應這種狀況，使用CDN Host會是一個不錯的解決方式，換個角度來說，這是另外一種雲端服務吧！
目前Google有幫一些熱門的JavaScript Framework做了Host服務，至於有哪些Framework請連結到Google Libraries API進行觀看：http://code.google.com/intl/zh-TW/apis/libraries/

Google Libraries API官網有對使用方式做一個說明，引入方式可分為兩種，一種就是直接存取雲端的實體位置，網路上的文件通常是稱為「靜態引入」，以引入JQuery 1.4.2檔案為例，引入的語法為：
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
另外一種引入方式就是透過Google的API進行存取，通常是稱為「動態引入」，要使用動態引入時，必需要先引入Google API，語法為
<script type="text/javascript" src="https://www.google.com/jsapi?keyINSERT-YOUR-KEY"></script>
其中INSERT-YOUR-KEY必須要換成自己所申請的Google Key（若沒有請至http://code.google.com/apis/loader/signup.html進行申請），在引入好後就可以開始進行動態引入：
<script type="text/javascript" language="javascript">
google.load("chrome-frame", "1.0.2");
google.load("dojo", "1.6.0");
google.load("ext-core", "3.1.0");
google.load("jquery", "1.5.1");
google.load("jqueryui", "1.8.11");
google.load("mootools", "1.3.1");
google.load("prototype", "1.7.0.0");
google.load("scriptaculous", "1.8.3");
google.load("swfobject", "2.2");
google.load("yui", "3.3.0");
google.load("webfont", "1.0.19");
</script>
動態引入的參數為(Library名稱,版本)。
最後，該說說用CDN Host有什麼好處，在本文一開始所提到的存取速度，其實是一個比較易顯的好處，經筆者實際測試，如果網站伺服器速度快的話，使用Google CDN可能會感覺不出來差異或是會慢一點，不過在瀏覽器上面有一個技術叫做「快取」，如果使用者在某個網站載入過您所要載入的js檔案，那使用者在瀏覽您的網站就不會再次的載入這個檔案，也就是會節省掉不少存取頁面的時間。
此外，減少主機存放空間及網路流量也是好處之一，以JQuery為例，完整檔案一個也是上百KB，壓縮過後的min版本也是要20多KB，如果有上百個瀏覽者進行存取，昂貴的頻寬也就會被佔用掉，若此類檔案擺在Google家，有人幫你管控該類檔案的gzipped相關快取、壓縮技術，又省自家主機頻寬，可是多美好的一回事。
最後還可以說的好處就是技術人員在說的，更改引入檔案版本可是更為便利！

2011年3月20日星期日

ASP.Net程式語言跨入AIR技術Part.2

上次提到的範例”向世界問好”(也就是Hello World)的程式，程式碼如下：
Html程式部分：
<html >
<head>
<title>Hello, World!</title>
</head>
<body>
           <h1>Hello, World!</h1>
</body>
</html>
除了html程式外尚須要一個XML程式，程式如下
<?xml version="1.0" encoding="utf-8"?>
<application xmlns="http://ns.adobe.com/air/application/1.0">
           <id>com.dmci.air.HelloWorld</id>
           <filename>Hello World</filename>
           <version>1.0</version>
           <initialWindow>
                     <content>HelloWorld.html</content>
                     <visible>true</visible>
           </initialWindow>
</application>
下面來說明上述程式的作用：
1.<id>com.dmci.air.HelloWorld</id>這一行表示id是程式的唯一AIR標識，建議使用類似這樣的語法：com.dmci.air.HelloWorld。可以是虛構的值，但是一定要是唯一且有意義的值，最大長度為255字元。
2.<filename>Hello World</filename>這行表示程式的名稱，使用者會看到它，出現在關於選單、捷徑名稱、開始選單等位置。
3.<version>1.0</version>這一行為版本宣告，是虛構的值，主要用來識別程式的版本，只要能識別不同版本都OK。
4.<initialWindow></initialWindow>這中間所包含的值為設置程式主視窗的內容和外觀。
5. <content>HelloWorld.html</content>這個就是主要內容基本HTML檔案的名稱。
6. <visible>true</visible>這是表示使否顯示程式給使用者看，預設值為false，所以有必要加這一行來顯示執行結果。
程式寫好後要測試，可以用簡單的命令AIR Debug Launcher(adl)來測試，語法為adl ApplicationXMLFile.xml，執行後能看到結果畫面表示程式是OK的，測試完畢如果要發佈程式，必須要創建一個憑證給程式，然後打包程式成安裝檔案，這樣使用者拿到檔案後就可以直接安裝使用了，這部分就下次在談囉！(待續…)

2011年3月13日星期日

U Web網站快捷建置服務行銷策略

如果把產品比喻做木材，那行銷策略可用來比喻作讓木材燃的更旺火種，產品化的過程，產品本身就有很多功課要做，以行銷的立場來看，這是產品企劃的工作重點。

產品企劃

完成了產品的企劃工作，當中的4C、4P~5~6P可以在很多地方搜尋到，在此不再贅述，簡單來說都是為了條列企劃力的簡稱罷了。銷售過程中所需要的工具、作業程序，也需要大量的企劃力從中輔佐，這是行銷企劃的工作。

行銷企劃

行銷企劃工作中最為重要的就是行銷策略的擬定，一個企業要能永續經營，銷售力是不可缺的重要因素，如何應用最佳的行銷策略，關係到銷售力的增減，用錢砸，好方法，但不是所有企業都有足夠的子彈可用，因此網路行銷，這個成長最快速，費用最低廉的媒體工具成了大部分行銷企劃人員的最愛。
新媒體，這是目前眾所矚目的新興產業，新媒體泛指利用電腦(計算及資訊處理)及網路(傳播及交換)等新科技，對傳統媒體之形式、內容及類型所產生的質變。也稱第四媒體，區別於傳統媒體報刊、廣播、電視媒體。
新媒體一詞可以從產業區分、人機介面、藝術運動、及其多媒體形式來詮釋，不同的詮釋是由於不同領域的觀點(產業、科技、藝術、及傳媒)的出發點之不同。
所謂的「舊媒體」所包涵的產業範圍，指的是印刷的報紙及雜誌，電子的廣播與電視。相較之下，新媒體所指的產業範圍不如舊媒體明確。
(資料來源：維基百科)
如何善用四個螢幕(電腦顯示器、行動電話、電視、遊戲機)？一直是所有媒體人玩創意搞噱頭的工作重點之一，UTRUST團隊的新興產品”U Web網站快捷建置服務”的行銷策略，善用網路行銷及實體DM的策略進行大數法則的行銷。
信諾科技之所以命名為信諾，就是希望能以服務誠信優質承諾為原則為企業製作出專業且好用的網站，只需簡單的透過管理後台，就能在網路上自在遨遊。
U Web也取得智慧財產權商標註冊權，在在都證明了我們優質產品化的決心，只要您需要一個專業的團隊來製作您的網站，不想再一頁一頁更新您的網站，重視分析數據及企劃力，”U Web網站快捷建置服務”將會是您最佳的選擇。

服務專線：02-27813033#310 (朱小姐)

2011年3月6日星期日

電子書製作淺談Base64編碼之應用(上)

最近在製做信諾科技電子書介面時需要解決有關Flex存取圖檔的問題，剛好遇到需要跟資料庫進行串連的應用需求；一般的做法可能是直接把圖檔存成獨立檔案，然後再將其路徑寫入資料庫，待下次需要時，先從資料庫讀取路徑後再進行實際載入的動作。雖然這種方式的實做不難，但一想到每次都要分成兩段式來處理，其實蠻不直觀的，如果能夠直接將圖檔資料存入資料庫，然後直接做讀取、寫入的話，豈不是更加方便？當然如果是直接把binary二進位的圖存入資料庫，雖然可行但顯然不怎麼實用，那若是能夠把圖檔當成文字模式來處理呢？又能讓檔案存取的步驟簡化？於是我找到了Base64。
什麼是Base64？根據維基百科的定義是這麼寫的：「Base64是一種使用64基(2⁶)的位置計數法。它使用2的最大次方來代表僅可打印的ASCII 字符。…」，意思是Base64使用了字元A-Z、a-z和0-9共62個字元來表示開始的變量，而最後結束的兩個代表數值的符號則視不同系統而有所差異(例如windows系統以’=’結尾)。簡單地說，就是我們可以將Base64拿來做為一種資料格式轉換模式，比如把binary二進位的數據以Base64編碼方式，轉譯成ASCII字元符號的表示方式，以字串格式的資料型態來做應用。
所以運用base64編碼工具基本上應該可以達到我的需求，而且Flex也提供了相關的類別工具。操作的原理跟步驟很簡單，首先把Bitmap Data的圖檔資料格式轉換成by nary資料型態，然後應用Base64Encoder類別的encode Bytes()方法，進行base64編碼，即可以二進位的binary資料轉換成base64編碼的字串資料型態了。
在範例中的圖檔資料的轉換，主要是由getImageBase64String()函式處理：

private function getImageBase64String(disp:BitmapData):String{

var imgEnc:PNGEncoder = new PNGEncoder();

var bitmapData:BitmapData = new BitmapData(disp.width, disp.height, true, 0);

bitmapData.draw(disp);

var bytes:ByteArray = imgEnc.encode(bitmapData);

var b64encoder:Base64Encoder = new Base64Encoder();

b64encoder.encodeBytes(bytes);

var imageString:String = b64encoder.flush();

return imageString;

}

上述函式中，因為處理的圖檔格式為.PNG，所以我們宣告了一個PNGEncoder類別物件，並呼叫該物件的encode()函式做Bitmap Data與binary資料型的轉換，而且新建一個Bitmap Data複本資料當做被轉換的對象，避免資料來源受到影響。接下來宣告一個Base64Encoder類別的編碼物件，使用encode Bytes()函式將轉換好的二進位binary資料編碼成base64格式的內容，然後呼叫flush()函式將編碼物件的內容資料寫入一個字串變數裏頭，最後將該字串結果回傳給函式的呼叫者。
範例圖示：點選左方不同圖案即可出現對應的base64編碼文字字串

是不是非常輕鬆簡單呢？Base64成就了另一種解決圖、文轉換加密的解決方案。
其應用範圍包括：

1. 網路傳輸

2. 簡單的加密

3. 資料型態的轉換

範例動畫程式原始碼

訂閱：文章 (Atom)

網頁

2011年3月28日 星期一