在openwrt中使用Post方式異步提交數據

在openwrt中，大部分都是使用get方式來進行數據交互，如：XHR.get,XHR.poll。我們可以通過查看xhr.js的源代碼來看他的具體實現邏輯。通過查看源代碼可以知道，get/poll都是XHR的靜態方法，而具體的內部邏輯中，還是通過new XHR().get來進行的數據請求。因此我們也可以使用這種方式來調用他內部提供的post方法。

在使用post方法來交互數據時，對於回調函數中僅有的一個參數是一個xhr對象，因此要獲取返回的數據需要調用responseText屬性。

<%
     local h = require "luci.http"
 
     if h.formvalue('act') == 'query' then
         h.write('data string...')
         return
     end
 %>
 <input type="button" value="query" onclick="queryHandler(this)" />
 <script type="text/javascript" src="<%=resource%>/xhr.js"></script>
 <script type="text/javascript">
 // <![CDATA[
     function queryHandler() {
         new XHR().post('<%=REQUEST_URI%>', {
             act : 'query'
         }, function(xhr) {
             // 獲取到的返回數據，這里與get返回的數據不一樣，這里是字符串，而get方式回來的是json
             console.log(xhr.responseText);
         })
     }
 // ]]>
 </script>

 

正如示例中所描述的，對於post回來的數據，我們通過responseText所得到的是一個字符串，如果我們也想如同get方式回來的是json格式的數據，那么我們可以將xhr.js中get的實現拿過來。

    function queryHandler() {
        new XHR().post('<%=REQUEST_URI%>', {
            act : 'query'
        }, function(xhr) {
            var json = null;
            if (xhr.getResponseHeader("Content-Type") == "application/json") {
                try {
                    json = eval('(' + xhr.responseText + ')');
                }
                catch(e) {
                    json = null;
                }
            }

            // 獲取的數據
            console.log(json);
        })
    }