Button.Click 處理完成後,再 POST 到指定 URL

17:38 0 Comments A+ a-

昨天,剛好有小蝦在問這樣的問題。Button.Click 在 Server Side 做完相關的邏輯運算之後,一般都是利用 Response.Redirect 或 Server.Transfer 到某一指定 URL,並把相關的資料以 QueryString 來傳遞,此法相當於 GET Submit,資料串容易被目視發現。如果,我們希望改用以 POST Submit 來傳遞資料,避免資料直接透露在網頁上,這時該怎麼做呢?小蝦用了個很天真的方法,他直接 在 Page Load 把 Button.PostBackUrl 改為指定的 URL。
Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
   Button1.PostBackUrl = "http://test.url/abc,php?itemA=A&itemB=B"
End Sub

好啦,問題來了,當 Button.Click 事件被觸發時,網頁馬上就跑到指定的 URL 了,原本希望要執行的運算都沒有做到。其實這很簡單的,我們只要搞清楚 runat server 與 PostBackUrl 之間的關連,就已經決定一半的問題了。
而剩下的另一半呢,也不難懂,有點類似以 server side 的程式來呼叫 Client 端的 Javascript function。但是別忘記,要 POST 資料就得需要 form 來支援。

ClickAndPost.aspx,布置網頁
<body>
<form id="form1" runat="server">
   <asp:Button ID="Button1" runat="server" Text="Button" />
</form>
<asp:Literal ID="ltrJS" runat="server"></asp:Literal>
</body>

ClickAndPost.aspx.vb,程式邏輯
Protected Sub Button1_Click(ByVal sender As Object, ByVal e As System.EventArgs) Handles Button1.Click
    ' 這裡是希望要處理的邏輯,請把它獨立成一個 Sub 或 Function 來呼叫,不要學範例偷懶
    If (Now.Second Mod 2 = 0) Then
        With js
            .Append("<form id=""form"" method=""post"" action=""http://test.url/abc.php"">")
            .Append("<input name=""TRADE_NO"" type=""hidden"" value=""" & "DEMO".ToLower & Now.ToString("yyyyMMddfff") & """></input>")
            .Append("</form>")
            .Append("<script type=""text/javascript"">document.getElementById('form').submit();</script>")
            ' 請留意 getElementById 裡的的 form id 要與 form tag 的一致
            ltrJS.Text = .ToString
        End With
    End If
End Sub

稍微解說一下,當按下 Button 時,在條件成立時,會在 Literal 裡產生一個 form,並且利用 javascript 把它 submit。
當然我們也可以把上述的 form 改以 javascript 來 layout,並用 ScriptManager.RegisterClientScriptBlock 註冊以執行。只是我個人覺得以 javascript 寫會比較麻煩一些。

很簡單的應用技巧,這樣有了解了沒?