webapi help文档 添加测试功能

在做webapi项目的时候 webapi为我们提供了help文档，开发者可以参考这个文档，但是这个文档缺少测试功能，如果加上一个测试的功能就更加方便了

于是就研究了下写了一段代码，代码比较简单，只要将这段代码贴在areas\helppage\views\help\api.cshtml中就可以了，如果多个api项目都依次加上，因为感觉比较实用就分享出来

如果你的接口不需要验证，请自行修改下代码,测试时可以复制文档中提供的参数格式进行修改

<div id="test">
        <h4 class="sample-header">测试接口</h4>
        <div class="sample-content">
            <span><b>Token:</b></span>
<pre class="wrapped">
            <textarea rows="2" cols="500" style="width:80%!important;max-width:none;" id="token"></textarea>
</pre>
            <span><b>参数:</b></span>
<pre class="wrapped">
            <textarea rows="15" cols="500" style="width:80%!important;max-width:none;" id="data1"></textarea>
</pre>
            <input class="sample-header" type="button" value="测试" onclick="ApiTest()" /><br /><br />
            <span><b>响应:</b></span>
<pre class="wrapped">
            <textarea rows="5" cols="500" style="width:80%!important;max-width:none;" id="data2"></textarea>
</pre>
        </div>
        <script src="~/Scripts/jquery-1.10.2.js"></script>
        <script type="text/javascript">
            $(function () {// dom元素加载完毕
                //$('#data1').val($(".sample-content pre.wrapped").html());
            });

            function ApiTest() {
                $('#data2').val("");
                var json = {};
                if ($("#data1").val() != "") {
                    json = eval("(" + $("#data1").val() + ")");
                }
                $.ajax({
                    type: "@Model.ApiDescription.HttpMethod.Method",
                    dataType: "json",
                    url: "/@Model.ApiDescription.RelativePath.Split('?')[0]",
                    data: json,
                    xhrFields: {
                        withCredentials: true
                    },
                    crossDomain: true,
                    success: function (results) {
                        if (typeof results == "object") {
                            $("#data2").val(JSON.stringify(results,null,2));
                        }
                        else {
                            var resultObj = JSON.parse(results);
                            $("#data2").val(results);
                        }
                        //使用时，需要转换为Json对象

                    },
                    beforeSend: function (request) {
                        request.setRequestHeader("Authorization", "bearer " + $('#token').val());

                    },
                    error: function (XMLHttpRequest, textStatus, errorThrown) {
                        $("#data2").val(XMLHttpRequest.status + " " + XMLHttpRequest.responseText);
                    }
                });
            }

        </script>
    </div>