Javascript 通过ajax调用将Html字符串从视图传递到控制器

我需要将div标记的所有HTML传递给控制器。 我能够获得HTML，但当我通过ajax传递HTML时，代码失败

这是我的密码

查看：

function abc() {

  var html = $("#div").html();

  data = {
    Html: html
  };

  $.ajax({
        url: '@Url.Action("DisplayResult", "Default")', //
        data: data,
        type: "POST",
        contentType: "application/json; charset=utf-8",
        success: function(result) {
          //do something
        });
    },
    error: function(xhr) {
      alert("error");
    }
});
}

[HttpPost]
public FileResult DisplayResult(string Html)
{
    return null;
}

我的控制器操作方法：

function abc() {

  var html = $("#div").html();

  data = {
    Html: html
  };

  $.ajax({
        url: '@Url.Action("DisplayResult", "Default")', //
        data: data,
        type: "POST",
        contentType: "application/json; charset=utf-8",
        success: function(result) {
          //do something
        });
    },
    error: function(xhr) {
      alert("error");
    }
});
}

[HttpPost]
public FileResult DisplayResult(string Html)
{
    return null;
}

---

我在网上搜索了几篇相关的帖子，但是这些帖子讨论了不同的解决方案，比如使用

Html.Beginform（）

和提交按钮，但是这些解决方案都不适合我的需要。

发送Html内容是不安全的，所以你会得到一个错误。虽然可以绕过此错误，但不建议禁用输入验证：

You have javascript errors and your call is wrong you will need to stringify the data.    

function abc() {
        var html = $("#div").html();
        var dataToSend = JSON.stringify({ 'Html': html });

        $.ajax({
            url: '/Home/DisplayResult', //
            data: dataToSend,
            type: "POST",
            contentType: "application/json; charset=utf-8",
            success: function (result) {
                //do something
    },
    error: function(xhr) {
        alert("error");
    }
    });
    }


    And I have this in HomeController:

        [HttpPost]
        public FileResult DisplayResult(string Html)
        {
            return null;
        }

[ValidateInput(false)]
public class YouController: Controller{

}

---

发送Html内容不安全，因此您将收到错误。虽然可以绕过此错误，但不建议禁用输入验证：

[ValidateInput(false)]
public class YouController: Controller{

}

---

可能内容类型错误，但您可以从浏览器内部检查错误（使用网络选项卡并单击您的请求，甚至使用fiddler）

如果不测试代码，我不能说太多，但另一个选项是检查

error

函数的responseText，如：

error: function(xhr, status, error) {
  alert(err.responseText);
}

---

可能内容类型错误，但您可以从浏览器内部检查错误（使用网络选项卡并单击您的请求，甚至使用fiddler）

如果不测试代码，我不能说太多，但另一个选项是检查

error

函数的responseText，如：

error: function(xhr, status, error) {
  alert(err.responseText);
}

如果您在contentType中定义了“application/json”，则必须在stringify操作之后发送它

$.ajax({
    url: '@Url.Action("DisplayResult", "Default")', //
    data: JSON.stringify(data),
    type: "POST",
    contentType: "application/json; charset=utf-8",
    success: function(result) {
      //do something
    });
},
error: function(xhr) {
  alert("error");
}

如果您没有定义“application/json”，默认的contentType是“application/x-www-form-urlencoded”，您可以在不使用json.stringify的情况下将对象传递给数据参数。

如果您在contentType中定义了“application/json”，则必须在stringify操作后发送它

$.ajax({
    url: '@Url.Action("DisplayResult", "Default")', //
    data: JSON.stringify(data),
    type: "POST",
    contentType: "application/json; charset=utf-8",
    success: function(result) {
      //do something
    });
},
error: function(xhr) {
  alert("error");
}

---

如果您没有定义“application/json”，默认的contentType是“application/x-www-form-urlencoded”，您可以在不使用json.stringify的情况下将对象传递给数据参数。

谢谢您的回复

我可以通过添加一个带有[AllowHtml]属性的字符串属性并通过模型传递我的html来解决这个问题

---

然而，由于一些用户回应说传递html是不安全的，所以我在控制器中编写了一个方法来生成相同的html。再次感谢您的回答

感谢您的回复

我可以通过添加一个带有[AllowHtml]属性的字符串属性并通过模型传递我的html来解决这个问题

---

然而，由于一些用户回应说传递html是不安全的，所以我在控制器中编写了一个方法来生成相同的html。再次感谢您的回答

当您尝试运行代码时，是否从MVC收到错误？我的代码没有命中控制器，javascript失败！您从javascript中得到了什么错误？（您可以打开控制台查看错误消息）我的控制台中有500个内部服务器错误。我的控制器中的断点从未命中。但是，如果我不在ajax中传递任何数据（只传递null）并使控制器中的参数成为可选的，那么就没有问题了。所以，我假设在传递html时出现了问题？您需要检查返回的文本以及500。它可能说你发送了一个潜在危险的请求。有关更多信息，请参阅。当您尝试运行代码时，是否从MVC收到错误？我的代码没有命中控制器，javascript失败！您从javascript中得到了什么错误？（您可以打开控制台查看错误消息）我的控制台中有500个内部服务器错误。我的控制器中的断点从未命中。但是，如果我不在ajax中传递任何数据（只传递null）并使控制器中的参数成为可选的，那么就没有问题了。所以，我假设在传递html时出现了问题？您需要检查返回的文本以及500。它可能说你发送了一个潜在危险的请求。有关更多信息，请参阅。您需要将html字符串化。您需要将html字符串化