从 html 页面调用 c# 类方法答案

【问题标题】：calling a c# class method from html page从 html 页面调用 c# 类方法
【发布时间】：2017-09-06 05:46:21
【问题描述】：

我们可以从 html 页面调用类中的 C# 方法吗？我有一个类名 Crud.cs

public class Crud
{
    public String generateFiles(String name)
    {

        return(generateHtml(name));
    }
     private String generateHtml(String name)
    {

       var filename = "C:\temp\"" + name + ".html";

        try
        {
            FileStream fs = new FileStream(filename, FileMode.Create);
            return "True";
        }
        catch(Exception e)
        {
            return e.ToString();
        }

    }
}

我想从 html 页面调用此方法。我使用的是 html 页面而不是 asp 页面。是否有可能在不使用 ajax 的情况下调用，或者如果 ajax 也可以调用。

    <!DOCTYPE html>
<html>
<head>
    <title></title>
    <meta charset="utf-8" />
    <script src="http://ajax.microsoft.com/ajax/jQuery/jquery-3.2.1.js" type="text/javascript"></script>     

</head>
<body>
    <div style="align-content:center;">
        <input type="text" id="HtmlName" />
        <button id="btn_gen_html" onclick="createHtml()">Generate</button>
    </div>
    <div id="Msg"></div> 
    <div id="feedbackMsg"></div> 
    <script>
        function createHtml() {
            var name = document.getElementById("HtmlName").value;

            $.ajax({
                type: "POST",
                url: "Crud.cs/generateFiles",
                data: { name } ,
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: function (val) {
                    alert(val);

                    if (val == 0) {
                        $("#feedbackMsg").html("Success");
                    }
                    else(val==1)
                    {
                        $("#feedbackMsg").html("Sorry cannot perform such operation");
                    }
                },
                error: function (e) {
                    $("#feedbackMsg").html("Something Wrong.");
                }
            });
        }
    </script>
</body>
</html>

这是我的代码。在这里，我无法在 crud 类中调用 generateFiles() 方法。我可以这样打电话吗？如果可以的话怎么办？

【问题讨论】：

简短回答：你不能。 Crud.cs/generateFiles 是 AJAX 调用中的无效 URL（因为 .cs 文件已编译并且您需要返回 HTML/JSON），甚至没有到达 C# 代码。如果您使用的是 ASP.NET MVC，则分配有控制器和操作方法名称的 URL（设置操作方法以返回 JSON 结果）。
嗨@TetsuyaYamamoto 感谢您的快速回复.. 但我没有得到你所说的。你能简单解释一下吗
试试这个 ProjectName.namespace.c#function。你不能这样调用 .cs 文件
@MeghaM 使用将方法更改为静态并放入 [WebMethod]。
AJAX 调用 URL 需要有效路由才能与 C# 代码交互，因此不能直接使用 .cs 文件。在 ASP.NET MVC 中启用了 URL 路由，因此您可以使用控制器类名称和操作方法名称来引用 URL。但是，通过上面的设置，没有任何 URL 路由，AJAX 不知道应该采用哪个路由来调用后端 C# 代码。

标签： javascript c# html

【解决方案1】：

你不能调用普通方法。方法必须是静态和web方法。

试试这个：

public class Crud
{
    [WebMethod]
    public static String generateFiles(String name)
    {

        return(generateHtml(name));
    }
     private String generateHtml(String name)
    {

       var filename = "C:\temp\"" + name + ".html";

        try
        {
            FileStream fs = new FileStream(filename, FileMode.Create);
            return "True";
        }
        catch(Exception e)
        {
            return e.ToString();
        }

    }
}

【讨论】：

【解决方案2】：

您的项目中缺少一个控制器。

您尝试在没有控制器（或 [WebMethod]）的情况下从 cs 文件中检索数据？这是不可能的。

尝试寻找一些 MVC 指南，这里有一个 from microsoft web site

您不必使用那里显示的所有 ASP 组件，但您可以在那里看到如何从服务器检索数据到客户端。

【讨论】：

【解决方案3】：

基本语法

<script type="text/javascript">             //Default.aspx
   function myfunction() {     
             $.ajax({
             type: "POST",
             url: 'Default.aspx/myfunction',
             data: "mystring",
             contentType: "application/json; charset=utf-8",
             dataType: "json",
             success: function (msg) {
                 alert("success");
             },
             error: function (e) {
                 $("#divResult").html("Something Wrong.");
             }
         });
     }

默认.aspx.cs

[WebMethod]
public static String myfunction(string name)
{
    return "Your String"
}

如果你想使用不带 ajax 的页面调用：Ref

//cs file (code behind)
[ScriptMethod, WebMethod]
public static string GetLabelText(string param1)
{
   return "Hello";
}
//aspx page
 <script type="text/javascript">
  function InsertLabelData() {
      PageMethods.GetLabelText(param1,onSuccess, onFailure);
  }

  function onSuccess(result) {
      var lbl = document.getElementById(‘lbl’);
      lbl.innerHTML = result;
  }

  function onFailure(error) {
      alert(error);
  }
  InsertLabelData();
</script>

【讨论】：

第二种方法PageMethods.GetLabelText(onSuccess, onFailure)如何发送参数；
@MeghaM 你测试了吗？

【解决方案4】：

如果您使用的是 ASP.NET Web 窗体，则可以使用 WebMethodAttribute 而不是直接调用 .cs 文件，由于没有为普通类启用 URL 路由，因此 AJAX 不支持该文件。网络方法must be declared as static：

// if you're using ASMX web service, change to this class declaration:
// public class Crud : System.Web.Services.WebService
public class Crud : System.Web.UI.Page
{

    [System.Web.Services.WebMethod]
    public static String generateFiles(String name)
    {
        return generateHtml(name);
    }

    private String generateHtml(String name)
    {
        var filename = "C:\temp\"" + name + ".html";

        try
        {
            FileStream fs = new FileStream(filename, FileMode.Create);
            return "True";
        }
        catch(Exception e)
        {
            return e.ToString();
        }
    }
}

那么你的 AJAX 调用 URL 应该改为这个（注意 web 方法应该存在于代码隐藏文件中，例如 Crud.aspx.cs 或 Crud.asmx.cs）：

$.ajax({
          type: "POST",
          url: "Crud.aspx/generateFiles", // web service uses .asmx instead of .aspx
          data: { name: name }, // use JSON.stringify if you're not sure
          contentType: "application/json; charset=utf-8",
          dataType: "json",
          success: function (val) {
             alert(val);
             if (val == 0) {
                $("#feedbackMsg").html("Success");
             }
             else
             {
                 $("#feedbackMsg").html("Sorry cannot perform such operation");
             }
          },
          error: function (e) {
             $("#feedbackMsg").html("Something Wrong.");
          }
});

如果使用 ASP.NET MVC，则使用 JsonResult 返回 JSON 字符串为 success 结果：

public class CrudController : Controller
{
    [HttpPost]
    public JsonResult generateFiles(String name)
    {
        return Json(generateHtml(name));
    }
}

action 方法的 AJAX 调用看起来很相似，但 URL 部分略有不同：

$.ajax({
          type: "POST",
          url: "Crud/generateFiles",
          data: { name: name }, // use JSON.stringify if you're not sure
          contentType: "application/json; charset=utf-8",
          dataType: "json",
          success: function (val) {
             alert(val);
             if (val == 0) {
                $("#feedbackMsg").html("Success");
             }
             else
             {
                 $("#feedbackMsg").html("Sorry cannot perform such operation");
             }
          },
          error: function (e) {
             $("#feedbackMsg").html("Something Wrong.");
          }
});

【讨论】：

但我只使用一个类而不是 .aspx.cs 文件..那么我怎样才能在 url 中给出它..我的文件名是 Crud.cs..我怎样才能在 url 中使用它
要使用WebMethod，该方法应该放在派生System.Web.UI的类中。这样你就可以在后面创建Crud.aspx页面和Crud.aspx.cs代码，然后你可以在public class Crud : System.Web.UI.Page里面使用web方法。如果您采用 MVC 路线，只需添加 Controller 使其成为控制器类并使用 HttpPost 装饰操作方法。
但是我没有使用 .aspx 页面..我只是使用 .html 页面我没有使用 MVC，我使用的是 webforms
您可以仅使用 HTML 和 JS 从 Web 方法 URL 调用 C# 代码，但 C# 代码发生在代码隐藏文件中，在 ASPX 或 ASMX Web 服务 (.asmx.cs) 代码中其中有WebMethod (public class Crud : WebService)。

【解决方案5】：

    //Perfect solution
  var params = { param1: value, param2: value2}
    $.ajax({
        type: 'POST',
        contentType: 'application/json; charset=utf-8',
        url: '../aspxPage.aspx/methodName',
        data: JSON.stringify(params),
        datatype: 'json',
        success: function (data) {
       var  MethodReturnValue = data.d

        },
        error: function (xmlhttprequest, textstatus, errorthrown) {
            alert(" conection to the server failed ");
        }
    });

//请在您的方法中提及 [WebMethod] 属性。

【讨论】：