[ASP.NET] 透過 POST 向遠端 server 取得 File Stream 產生檔案

使用 server side 的方式可以完成：

ASP.NET
利用ASP.NET的WebClient來Download遠端File - F6 Team- 點部落

ASP.NET MVC
[C#][ASP.NET MVC]實做檔案管理 - RiCo技術農場- 點部落


單純在 client 端也可以...使用 jQuery!
jquery.fileDownload  (這可以 cross domain 喔!)
ASP.NET MVC JQuery Non-Ajax Post | Share ChiWai/Share 智慧/智慧分享 – 技術分享/Tech Blog

[ASP.NET] jQuery AJAX 應用相關參考資料

[ASP.NET & jQuery]使用jQuery的Ajax存取資料(ashx,aspx,asmx) - In 91- 點部落

[jQuery] jQuery + AJAX

AJAX

AJAX，這個技術是透過 JavaScript 中的 XMLHttpRequest 物件去呼叫後端 server code 並動態改變前端的網頁，讓網頁不需要 refresh。

AJAX 的技術並不複雜，大概掌握幾個重點即可：

1. XMLHttpRequest 物件將資料傳遞到後端 server 的方式，可分為 POST 與 GET。
   
   
2. 從 server 回傳的資料可以是 plain text 或是 XML。
   
   
3. 前端網頁 DOM 的處理........(這其實跟 AJAX 已經沒有太大關係了)
   

jQuery 與 AJAX 的搭配

直接寫 pure XMLHttpRequest 的程式碼真的太累了，光是 cross browser 的問題就可以搞死人了......不過還好 jQuery 都幫大家處理好啦!

以下用的範例程式來說明：(demo)

ajax01.html

<html>
<head>
<script type="text/javascript" src="js/jquery-1.3.1.js"></script>
<script type="text/javascript">
<!--
$(document).ready(function(){
//取得 button 物件並註冊 click 事件
  $("#btnAJAX").click(function(){
      //取得使用者輸入的值
      var intValue = $("#txtValue").val();
    
      /*  以 POST 的方式送出 request
          傳入參數 : value
          參數值 = intValue
          callback function 為 function(result){...} */
      $.post("server01.php", {value : intValue}, function(result){
          $("#spnMain").html("server 端回傳結果 = " + result);
      });
  });
});
-->
</script>
</head>
<body>
請輸入整數值，server 會計算其平方值並回傳：<p />
<input type="text" id="txtValue" /> <input type="button" id="btnAJAX" value="從 server 端取得結果" /><p />
<span id="spnMain"></span>
</body>
</html>

server01.php

<?php
if(isset($_POST["value"]))
  echo $_POST["value"] * $_POST["value"];
else
  echo "0";
?>

從上面的範例可以看出，透過 jQuery 物件的 post() 方法就可以直接享受到 AJAX 的好處囉! 當然，也可以用 get() 的方式來達到 AJAX 的效果。

此外，callback function 的部份比較需要注意的就是參數的傳遞了，在 jQuery 中可以允許使用一般的方式或是 context 的方式傳入參數，以下用範例說明：(demo)

ajax02.html

<html>
<head>
<script type="text/javascript" src="js/jquery-1.3.1.js"></script>
<script type="text/javascript">
<!--
//測試函式
function testFunc(intVal) {
  alert("final value is " + (intVal * 2 + 10));
}   //end function


$(document).ready(function(){
//取得 button 物件並註冊 click 事件
  $("#btnAJAX").click(function(){
      //取得使用者輸入的值
      var intValue = $("#txtValue").val();
    
      /*  以 POST 的方式送出 request
          傳入參數 : value
          參數值 = intValue
          callback function 為 function(result){...} */
      $.post("server.php", {value : intValue}, function(result){
          //直接呼叫 function
          testFunc(result);
       
          //使用 jQuery context 的方式呼叫 function
          testFunc.apply(this, [result]);
      });
  });
});
-->
</script>
</head>
<body>
請輸入整數值，server 會計算其平方值並回傳：<p />
<input type="text" id="txtValue" /> <input type="button" id="btnAJAX" value="從 server 端取得結果" /><p />
<span id="spnMain"></span>
</body>
</html>

參考資料

• Visual jQuery 1.2.6
  
  
• jQuery: Write less, do more - Opera Developer Community
  
  
• jQuery 學習心得筆記 (4) - Ajax (上) @ 國三還是菜鳥一枚
  
  
• jQuery 學習心得筆記 (5) - Ajax (下) @ 國三還是菜鳥一枚

[Blogger]AJAX Labels

常用 Blogger 的使用者應該都會覺得，為何 google 在 GMail、Docs.....甚至其他服務，都加入了大量的 AJAX，讓整個使用感更好，但唯獨 Blogger 沒有呢?

不過，還好有國外的 Blogger Hacker 解決了這個問題，將 AJAX 的效果加到了 Blogger 中標籤的部分，稱為「AJAX Labels」。

以下有幾個連結介紹安裝方式：

1. AJAX Labels Reloads (原作者)
   
2. blogger 3.0:超酷的ajax標籤再次升級版（完全替代博客原本的標籤功能）
3. Blogger Hacked: AJAX Labels Reloaded