Question

我正在制作一个ASP.net MVC应用程序我希望如此，当用户点击链接时，它会执行ajax调用，将数据发送到控制器，然后将其他数据返回给视图。

这是我想在我的控制器中调用的方法：

public JsonResult GetImage(string url)
        {
            Image image = Image.FromFile(url, true);

            byte[] byteImage = converter.ImageToBytes(image);

            return Json(new { byteImage }, JsonRequestBehavior.AllowGet);
        }

这是控制器位置：

08983ClassLibrary\EpostASP\Controllers\CustomerController.cs

这是我的Ajax电话：

$.ajax({
            url: "~/Controllers/CustomerController/GetImage/",
            type: 'POST',
            contentType: 'application/json',
            data: "url="+url,
            success: function (image) {
                document.getElementById("image").src = "data:image/png;base64," + image;
                showImage();
            }
        });

当我在代码中放置断点时，我可以看到它击中了ajax调用，然后单步执行它从未到达控制器并且不会给出任何错误。有什么想法吗？

Answer 1

主要问题在这里 -

url: "~/Controllers/CustomerController/GetImage/",

您看，~是服务器端文字，换句话说，当您在ASP.net服务器端路径中使用它时，它将被当前服务器应用程序文件夹位置替换。这是传统的ASP.Net方式。这一行有2个错误 -

此网址永远不会有效。因为它在JS中的字符串内部，因此ASP.net不知道它必须用服务器路径替换它。现在出现第二个错误，即使ASP.net可以检测并转换它，它仍然无法正常工作。因为我在2 -
由于您使用的是ASP.net MVC，因此这不是一个好习惯。更传统的MVC方式是创建路由并使用这些路由。因为在ASP.net中，您可以选择直接链接到页面（.aspx，.ascx）。但是MVC控制器动作不能像那样链接。因此，您必须在路由配置中创建路由（选中Global.asax），然后将该路由用作此处的URL。默认情况下，MVC应用程序将支持以下格式 -

<host>/{controller}/action

示例 -
```
'localhost/Home/Index`
```

请注意，我没有写HomeController，因为默认情况下控制器应该忽略尾随字符串Controller。

我希望这有所帮助，只是因为你正在为你现在的情况寻找一个解决方案试试这个（我还没有经过测试，但它应该是这样的） -

 $.ajax({
        url: "Customer/GetImage",
        type: 'POST',
        contentType: 'application/json',
        data: "url="+url,
        success: function (image) {
            document.getElementById("image").src = "data:image/png;base64," + image;
            showImage();
        }
    });

但为了安全起见，请确保使用 -

[HttpPost]
public JsonResult GetImage(string url)
{
}

更新： maproute（在评论中要求）将适用于任何这些路线。但也可以使用不同的路由配置。 Route配置非常灵活，只需按照它的工作方式设置路由即可。 -

    public static void RegisterRoutes(RouteCollection routes)
    {
        routes.MapRoute(
            "...",                                              // Route name
            "{controller}/{action}/{id}",                           // URL with parameters
            new { controller = "Home", action = "Index", id = "" }  // Parameter defaults
        );

        routes.MapRoute(
            "...",                                              // Route name
            "{controller}/{action}",                           // URL with parameters
            new { controller = "Home", action = "Index", id = "" }  // Parameter defaults
        );

        routes.MapRoute(
            "...",                                              // Route name
            "{controller}/{action}/{id}",                           // URL with parameters
            new { controller = "Customer", action = "GetImage", id = "" }  // Parameter defaults
        );
        routes.MapRoute(
            "...",                                              // Route name
            "Customer/GetImage/{id}",                           // URL with parameters
            new { controller = "Customer", action = "GetImage", id = "" }  // Parameter defaults
        );
        ..... //all of these mentioned route will land on the same url 
    }

    protected void Application_Start()
    {
        RegisterRoutes(RouteTable.Routes);
    }

Answer 2

你的ajax脚本说它正在寻找一个POST动作方法。

$.ajax({type: 'POST',

您是否使用POST修改了操作方法？

[HttpPost]
public JsonResult GetImage(string url)
{
}

另外，调整ajax数据参数

$.ajax({
    data: {
        "url": url 
        },

Answer 3

如果您使用的是chrome，可以使用开发者工具 - ＆gt;网络选项卡，查看正在进行的所有服务器请求。点击你的按钮，你会看到它弹出并显示响应代码，标题等。在你的情况下它会是红色的，会告诉你出了什么问题

Answer 4

如果您使用的是网络API ...您的方法是以＆＃34; Get＆＃34; GetImages，因此您需要使用[HttpPost]

修饰方法

Answer 5

我发现使用fiddler是了解MVC中发生的事情的最佳方式。

启动fiddler，再次运行代码并查看实际返回的内容。最有可能（正如Yorro所提到的）你得到了404错误，而且你的json调用中没有错误处理，你就不会看到错误。

Answer 6

$.ajax({
     url: '@Url.Action("GetImage", "Customer")',
    type: 'POST',
   contentType: "application/json; charset=utf-8",
    data: "url="+url,
    success: function (image) {
        document.getElementById("image").src = "data:image/png;base64," + image;
        showImage();
    }
});

Answer 7

如果使用IE，并且您的控制器第一次点击只添加...

$。AJAX（{ 缓存：假的， ...

Answer 8

有时候会起作用，或者有时会不起作用，所以不要提及诸如静态“〜/ Controllers / CustomerController / GetImage /”之类的URL ，

因此，您将更改以下代码段

$.ajax({
        url: "@Url.Action("GetImage", "CustomerController")",
        type: 'POST',
        contentType: 'application/json',
        data: "url="+url,
        success: function (image) {
            document.getElementById("image").src = "data:image/png;base64," + image;
            showImage();
        }
    });

希望这段代码可以解决您的问题！

Asp.net MVC Ajax调用没有调用控制器方法

8 个答案: