The Will Will Web

今天客戶給我一堆照片說要放到網站上去，一共 150 張照片 ( 502MB )，而每一張都是超高解析度的圖檔，我必須要將這些照片批次轉檔成較小的尺寸，才能讓這些圖片適合放在網站上瀏覽。由於客戶已經將圖片上傳到網站主機了，而這台主機是一台 Linux 伺服器，我不想將圖檔下載回來後處理再上傳，因此我決定直接在 Server 上執行批次轉檔的動作。

這讓我想到我之前曾經用過的 ImageMagick 套件有附一個 convert 工具程式可以用來轉換圖檔的大小、格式。在使用之前必須先安裝，如果你是用 Fedora 系列的 Linux 的話，可以用以下指令安裝：

yum install ImageMagick

如果你是用 Ubuntu Linux 的話，可以用以下指令安裝：( 注意：大小寫不同喔! )

apt-get install imagemagick

安裝完成之後，就可以用以下指令進行轉換動作：

convert -size 700x466 IMG_0001.JPG -resize 700x466 IMG_0001.JPG

將原本的圖片(3500 x 2330)直接縮小成 700 x 466 的大小，檔案大小從原本的 3MB 左右降到 220KB 左右，我再寫個 Shell Script 批次執行所有圖片轉換，就大功告成啦！

ImageMagick 附的 convert 工具除了能轉檔以外，其他能做的工作那可就多了，有興趣的人可以到官網看看相關指令工具的使用說明。

相關連結

• ImageMagick: Convert, Edit, and Compose Images
• ImageMagick: Command-line Options
• Examples of ImageMagick Usage (Version 6)

我想很多習慣用線上版的 MSDN 查詢資料的人都知道每次要開啟一頁都要等好久，最主要是左側的目錄(TOC)資料很多，每次讀一個頁面大約要下載 1MB 左右的資料，又慢又浪費頻寬，微軟最近推出了個 LOBAND (低頻寬) 的版本，讓你在看線上 MSDN 文件時速度會快很多喔。

以 GridView Class 頁面為例， 其網址為 http://msdn.microsoft.com/en-us/library/system.web.ui.webcontrols.gridview.aspx，如果你要進入此頁的「精簡版」只要在 .aspx 前面加上 (loband) 就可以進入了，也就是 http://msdn.microsoft.com/en-us/library/system.web.ui.webcontrols.gridview(loband).aspx，不止英文版能用，中文版也是可以使用的，你只要將 en-us 改成 zh-tw 就可以了，所以我之前說的自動將 MSDN 英文文件翻譯成繁體中文版一樣也是可以用的。

所以原本的「完整版」（如下圖）

切換過去之後就會變成「精簡版」（如下圖）

如果你以後都要保持用「精簡版」查看文件的話，只要按下上圖右上方的 "Persist low bandwidth view" 之後就不用再手動加上 (loband) 到網址上了。

相關網址

• MSDN Low-Bandwidth Rendering Option

基本上，網頁遇到「中文字」超過一行時都可以正常的斷字，只是若是英文字寫了一大串沒有空白的字，就會導致網頁版型被撐開，如下圖例就是因為網址過長而導致網頁被撐版，進而影響頁面的呈現。

IE 從 5.5 ~ 8.0 版的 CSS 都有支援一個 word-wrap 屬性，當你指定屬性值為 break-word 時就可以強迫瀏覽器進行斷字的動作，這樣就可以避免文字被斷行了。

不過要在 Firefox 中使用 word-wrap 就不可行了，一直到前天才正式發佈的 Firefox 3.0 也還是不支援 word-wrap 屬性，不過 word-wrap 屬性已經被編進 CSS 3.0 的規格中了，相信遲早有一天可以支援的。

不過在 Firefox 中也不是完全沒辦法，網路上有篇文章就有寫到如何在 Firefox 中實現自動斷字的方式，有興趣的可以上去看看。

我這裡摘要一下要達到目的必須的步驟：

1. 在 CSS 中定義一個 wordwrap 類別

.wordwrap
{
    word-wrap: break-word;
    -moz-binding: url('wordwrap.xml#wordwrap'); 

    display: block;
    overflow: auto;
}

這幾行 CSS 定義都是有意義的，內容這四行我大致解釋一下：

第一行：給 IE 看的，讓斷字產生。

第二行：給 Firefox/Mozilla 看的，透過 binding 的方式執行一段 JavaScript，當 Element 套用此 wordwrap 類別時讀取 wordwrap.xml 檔案，裡面有定義一組JavaScript程式可動態執行。

第三行、第四行：wordwrap.xml 裡面定義當 overflow 事件發生時執行一段程式讓文字斷行，所以 display 屬性一定要設定成 block 才有可能引發 overflow 事件（使用 inline 是沒辦法的），而最後的 overflow 就設定成 auto 即可。

2. 新增一個 wordwrap.xml 檔案

<?xml version = "1.0"?>
<bindings xmlns = "http://www.mozilla.org/xbl" xmlns:html = "http://www.w3.org/1999/xhtml">
  <binding id="wordwrap" applyauthorstyles="false">
    <implementation>
      <constructor>
        //<![CDATA[
            
            var elem = this;

            elem.addEventListener('overflow',
                function()
                {
                    var exp = /<&#8203;\/*[&#8203;_\s="'\w]+>/g;
                    
                    var txt = elem.innerHTML;
                    var chars = txt.split('');
                    var newTxt = chars.join('&#8203;');                    
                    newTxt = newTxt.replace(exp, reconstructTag);                    
                    elem.innerHTML = newTxt;
                },false);
                
                function reconstructTag(_tag)
                {
                    return _tag.replace(/&#8203;/g, '');
                }

            //]]>
      </constructor>
    </implementation>
  </binding>
</bindings>

內容我就不詳述，請自行到 Emulating CSS word-wrap for Mozilla/Firefox 閱讀相關說明。

3. 最後，到你的 HTML 中會破版的那個標籤套上 wordwap 類別即可。

<span class="url wordwrap">一個非常長的網址.....</span>

在我的例子裡，套用之後在 Firefox 中的顯示效果如下：

就這樣三個步驟就可以達成完美、跨瀏覽器的自動斷字功能。這裡有個線上的 DEMO，你們可以用 Firefox 去看看執行的效果如何。

相關連結

• MSDN Library - word-wrap Attribute | wordWrap Property
• Cascading Style Sheets (CSS), Level 3 (CSS3)
• Emulating CSS word-wrap for Mozilla/Firefox

透過 Management Studio 的 GUI 圖形介面操作的背後其實都是一堆 T-SQL 指令，但好像很少人知道如何將他實際執行的 T-SQL 取出來，其實是一個很簡單的技巧，但是卻很重要，例如說你要修改資料庫的表格或欄位名稱時，為了讓開發環境的資料庫結構(Schema)與正式主機環境的資料庫結構一致，你必須將你每次在開發環境變更的動作(T-SQL)儲存成「變更指令碼」(Changed Script)，讓資料庫管理人員(DBA)可以在正式環境直接執行 T-SQL 就可以完成資料庫結構的變更，否則將會很容易造成開發主機與正式主機資料庫不一致的情況，我今天將告訴各位如何將 T-SQL 匯出成檔案或顯示在查詢視窗。

我想直接舉幾個例子並放幾張圖片大家就應該能夠舉一反三了。

新增資料庫

新增資料庫時，當資料庫各項屬性設定完成後，按下「指令碼」就可以將你這次要新增資料庫的動作新增至查詢視窗。

 

修改表格結構

在尚未修改任何欄位之前，這個「產生變更指令碼」的按鈕是 Disable 的。

當修改了欄位或任何表格屬性後，這個「產生變更指令碼」的按鈕就會亮起來，直到按下「儲存」按鈕之前（或按 Ctrl + S）都會是亮的。

注意：千萬不要先儲存本次變更，因為只要儲存了之後，就無法匯出本次變更的「變更指令碼」了。

備份資料庫

備份、還原資料庫，或是卸離資料庫(Detach)、附加資料庫(Attach)都是可以的，且介面也都差不多。

我想三個例子已經夠了吧！以後大家如果想將一些日常的手動修改資料庫的動作寫成批次檔作業的話（例如說備份資料庫），就可以用今天這個技巧將 T-SQL 查出來，並且透過 sqlcmd.exe 工具執行即可。

相關連結

• sqlcmd 公用程式
• 使用 sqlcmd 公用程式

大部分來說 Linux 下的 "目錄捷徑" 通常會用 symbolic links，不過使用 symbolic links 有個小問題，就是使用 FTP 連線進來的使用者通常無法透過 symbolic link 跳到特定目錄（因為 chroot 的關係），而這時又想開放特定目錄給使用者的話，就可以用今天介紹的小技巧。

一般來說使用 symbolic link 的指令是：

# ln -s /var/www/logs /home/myhome/logs

若你想開放系統中某一個特定的目錄給特定使用者讀取資料，可以用掛載(mount)的方式將特定目錄連結至使用者的目錄下，以下是掛載目錄的範例與大致說明：

1. 首先必須先建立好掛載的目錄才能使用 mount 將目錄掛上去

# mkdir /home/myhome/logs

2. 接下來就是將指定的目錄掛上去了

# mount --bind /var/www/logs /home/myhome/logs

這個時候的 /home/myhome/logs 目錄的權限與使用者就會跟 /var/www/logs 一模一樣了，可以保有原本目錄、檔案的安全性，也不會讓使用者在系統目錄間到處亂逛了。

日期格式很常用，但有些特殊的需求要計算出來還蠻麻煩了，底下這些是我之前記錄下來的一些小技巧，真的要寫的時候若一些 SQL 函數不熟還真不容易寫出來呢！

顯示當下日期時間

select getdate() 

顯示本月第一天的語法（不含時間的部分）

select DATEADD(mm, DATEDIFF(mm,0,getdate()), 0)

顯示上個月最後一天（不含時間的部分）

select DATEADD(dd, -1, DATEADD(mm, DATEDIFF(mm, 0, getdate()), 0))

顯示這個月最後一天（不含時間的部分）

select DATEADD(mm,  1, DATEADD(dd, -1, DATEADD(mm, DATEDIFF(mm,0,getdate()), 0)))

將「日期字串」轉成「日期格式 」

SELECT CONVERT(datetime, '20080401 11:35:00.000') 

P.S. 其實不是 100% 會轉成功，不過大部分人看的懂得日期時間格式應該都會自動轉換成功。

將「日期格式」轉成「日期字串」（可自訂輸出格式）

請參考此文章：用 SQL Server 中的 CONVERT 函數處理日期字串

取得目前月份的數值，若小於 10 則補 0 ( 回傳字串格式 ) ( 例如: 2008-04-11 會回傳  04 )

SELECT REPLACE(STR(datepart(mm, getdate()), 2, 0), ' ', '0')

P.S. 若用 datepart(mm, getdate()) 的話只會回傳 4 而已，並不會補零 ( 因為是 int 型別 )

相關連結

• DATEDIFF (Transact-SQL)
  
• DATEPART (Transact-SQL)
  
• CAST 和 CONVERT (Transact-SQL)
  
• STR (Transact-SQL)
  
• REPLACE (Transact-SQL)

微軟在以前 ASP 的時代就有提供一個 Script Encoder 工具，可以將你的 ASP 中的 VBScript 或 JScript 編碼，讓整個 ASP 程式看起來像是亂碼一樣。

例如說以下的範例，其 script  標籤的 language 屬性是設定為 VBScript.Encode 而非原本的 VBScript ：

<script language="VBScript.Encode">
#@~^KQAAAA==@#@&j1D
bwYc214W,J3x1W[roPbdP1WW^ZZJ@#@&PQsAAA==^#~@</script>

事實上，有很多的駭客(cracker)就是透過 Script Encoder 工具將「惡意程式」編碼，以跳過防毒軟體的檢查，所以原本一個用意良好的工具也可以拿來做壞事，這感覺就像是常聽到人家講的一句話：「法律是用來保護懂法律的人，不懂法律的人在法律的保護傘下還是一樣居於劣勢」，有了 Script Encoder 工具本應該保護的是開發者的著作財產，卻變成保護駭客隱匿他們的惡意程式碼！

幸好要解碼也很容易，只要用 JavaScript 就可以解碼了，所以其實也算是沒什麼保護的效果，所以只能防止不知道的人來看你的原始碼而已。

線上 VBScript 解碼器 ( 只能解 Script Encoder 編碼過的程式 )

相關連結

• Script Encoder Overview
  http://msdn2.microsoft.com/en-us/library/d14c8zsc(VS.85).aspx
  
  
• Script Encoder 下載
  http://www.microsoft.com/downloads/details.aspx?displaylang=zh-tw&FamilyID=e7877f67-c447-4873-b1b0-21f0626a6329
  
  
• 加密你的ASP页面—Script Encoder初探
  http://www.itzhe.cn/html/web/ASP/20071222/34900.html
  
  
• MS Script Encoder Decoded
  http://www.aspheute.com/english/20011123.asp

有些網站會放置 Flash 前導頁（ 例如：http://www.liteonaward.com/ ），但我也看過許多網站在設計 Flash 前導頁的時候，整個網頁就只有一個 Flash 而已，所有進站的 Link 全部寫在 Flash 裡面，沒考慮到「萬一」使用者的瀏覽器不支援 Flash player 或 Flash player 所安裝的版本太舊怎麼辦！這時使用者就像是人到了你家，卻找不到門口進入一樣，連按電鈴的地方都沒有。

一般來說，許多人都會用以下方式宣告載入 Flash ：

   <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0"
   width="960" height="600">
     <param name="movie" value="flash.swf" />
     <param name="quality" value="high" />
     <embed src="flash.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="960" height="600"></embed>
   </object>

雖然已經很少人沒裝 Flash 了 ，但總是有人沒裝的人，萬一使用者沒安裝 Flash player 的話，我們可以選擇一張靜態的圖片輸出，讓使用者知道還是有「門」的。

   <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0"
   width="960" height="600">
     <param name="movie" value="flash.swf" />
     <param name="quality" value="high" />
     <embed src="flash.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="960" height="600"></embed>
     <a href="main.htm"><img src="AlternativePic.gif" width="950" height="630" border="0" /></a>
   </object>

微軟在幾年前針對 Internet Explorer 6 與之後的版本進行了一次軟體更新，對 ActiveX 控制項 (就是用 <object> 宣告的語法的物件) 預設都是不啟用的， 請看下圖：

這張圖應該很多人看過吧，如果 Flash 當中有設定超連結，還是必須要先點選一下「啟動此控制項」之後，才能點選，如果頁面上有一堆 Flash 的話，那就麻煩了。詳細資訊可以上微軟技術支援網站查閱。

事實上針對這個問題網路上已經有很多解決方案了，今天我們介紹透過 Adobe 提供的一個 Flash Player Detection Kit 可以協助我們透過 JavaScript 解決這個無法自動啟動的問題。上網下載後可以得到一個 detectionkit.zip 壓縮檔，裡面有個 AC_OETags.js 可解壓縮出來，還有個 ClientSideDetection.html 有使用範例，直接看範例就知道怎麼用的了。

但是他提供的範例我覺得不夠好，萬一使用者電腦 JavaScript 暫時沒啟用的時候怎麼辦？這時候使用者一樣是看不到的！（別懷疑，有時後使用者會外掛一些奇奇怪怪的軟體，有時後會影響 JavaScript 運作），為了這個問題我又多做了一些調整，以下是完整的程式碼：

相關連結

• The Adobe Flash Player Detection Kit
  http://www.adobe.com/software/flashplayer/download/detection_kit/
  
• SWFObject: Javascript Flash Player detection and embed script
  http://blog.deconcept.com/swfobject/
  
• SWFObject: 基于Javascript的Flash媒体版本检测与嵌入模块
  http://www.awflasher.com/flash/articles/swfobj.htm

今天分享一個小技巧，是我很久之前無意間研究出來的一個小東西，就是在 IE 上面安裝一個小按鈕，按下去就可以將在 MSDN 上面英文的文件立即變成「中文版」的功能。

請依照我以下的步驟就可以達成了：

1. 先開啟 IE 的「連結」工具列
   
   
   
   
   
   
   
2. 將以下連結「拖曳」到連結工具列上面
   
   切換MSDN中文版
   
   如果無法拖曳的話，可以手動修改「自訂連結」的網址:
   
   
   1. 在「自訂連結」上面按下滑鼠右鍵，選內容
      
      
      
      
   2. 在「網頁文件」頁籤的 "URL" 欄位輸入以下網址（程式）：
      
      javascript:void(location.href=location.href.replace(/\.microsoft\.com\/en-us/, '.microsoft.com/zh-tw'));
      
      
      
      
   3. 切換到「一般」頁籤，並輸入「切換MSDN中文版」
      
      
      
      
   4. 按下確定即可!

設定好了之後，就馬上來測試一下吧！^_^

1. 先連到 GridView 的英文頁面
   
   http://msdn2.microsoft.com/en-us/library/system.web.ui.webcontrols.gridview.aspx
   
   
2. 然後按下 「連結」工具列中的「切換MSDN中文版」按鈕！
   
   p.s. 如果點選有出現錯誤的話，請按住 Ctrl 鍵不放，再用滑鼠按下「切換MSDN中文版」按鈕
   
   
   
   
3. 按下去之後文件就會自動轉換到「繁體中文」版了！
   
   

是不是一個簡單又方便的技巧呢！^_^

前天替一個網友解決了一個 Encoding 混亂的問題：ASP.net 傳遞中文至Web Service 亂碼問題，像這種這個問題最常出現在「非 Unicode 的系統」裡，像這個案例就是他們的 Web Service 是用 PHP + NuSOAP 開發的，因為預設就是用 ISO-8859-1 的字集做資料的編碼與傳輸，所以資料在同樣的字集傳輸下，在非原生(Non-Native)支援 Unicode 的程式語言下很自然的不會發現問題，但是一到了 .NET 就不一樣了，.NET 是一個打從骨子裡支援 Unicode 的架構，所以對 Encoding 是很敏感的。

所以問題要解決就要有一些技巧了，我先解釋一下問題好了，如下：

目前的運作環境：

• 目前我要用 .NET 呼叫一個 Web Service
• 這個 Web Service 呼叫的編碼字集(Request Encoding)與回傳的編碼字集(Response Encoding)都是 ISO-8859-1

要讓 .NET 的正確的處理中文字串的話，使用 ISO-8859-1 是不行的，一定要轉換成 Big5 或 Unicode 才行，否則所有得到的字串都會是問號 ( ? )或亂碼。

這個 Web Service 是有問題的，因為他 Encoding 宣告的是 ISO-8859-1 但是其內容卻是用 Big5 編碼（其實 ISO-8859-1 與 Big5 的編碼是重疊的），所以我們必須要將傳出去的字串先變成用 ISO-8859-1 編碼的字串，再傳送給這個 Web Service，等得到資料後再將取得的 ISO-8859-1 轉成 Big5 編碼，這時 .NET 才看的懂「中文」，也才不會出現亂碼。

以下是原始碼（含註解）說明：

這一篇文章對初學者來說有點太深了，建議多查詢一些跟 Encoding 相關的資料來看看，多看一些原始碼培養一些感覺。

相關連結

• 瞭解編碼
• 使用 Unicode 編碼方式
• 將基底型別編
• 編碼和當地語系化
• System.Text 命名空間
• Encoding 類別