剑道 UI 上传器异步跨站点脚本与 ASP.NET 问题

本文关键字：脚本 ASP NET 问题 站点 UI 异步 剑道 | 更新日期: 2023-09-27 18:36:44

>我尝试在 ASP.NET 环境中以异步模式使用Kendo UI上传器，使用与该站点上的演示非常相似的代码，并且在IE8和Chrome 30.0.1599.101 m上都遇到了似乎是JQuery跨站点脚本错误

以下是正在使用的代码：

索引.chtml

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <link href="css/kendostyles/kendo.common.min.css" rel="stylesheet" />
    <link href="css/kendostyles/kendo.default.min.css" rel="stylesheet" />
    <script src="scripts/kendojs/jquery.min.js"></script>
    <script src="scripts/kendojs/kendo.all.min.js"></script>
</head>
<body>

<div style="width:45%">
    <div style="width:45%">
        <div class="demo-section">
            <input name="files" id="files" type="file" />
        </div>
    </div>
    <script>
        $(document).ready(function () {
            $("#files").kendoUpload({
                async: {
                    saveUrl: "save",
                    removeUrl: "remove",
                    autoUpload: true
                }
            });
        });
    </script>
</div>

</body>
</html>

我有非常简单的上传代码，甚至没有被点击，但为了完整性，我会提供它：

public ActionResult Save(IEnumerable<HttpPostedFileBase> files)
{
    // The Name of the Upload component is "files"
    if (files != null)
    {
        foreach (var file in files)
        {
            // Some browsers send file names with full path.
            // We are only interested in the file name.
            var fileName = Path.GetFileName(file.FileName);
            var physicalPath = Path.Combine(Server.MapPath("~/Uploads"), fileName);
            // The files are not actually saved in this demo
            // file.SaveAs(physicalPath);
        }
    }
    // Return an empty string to signify success
    return View();
}

现在，在选择要上传的文件时，我收到以下javascript弹出消息：

Error! Upload failed.Unexpected server response - see console.

查看控制台后，我得到这个：

Server response: Error trying to get server response: SecurityError: Blocked a frame with origin "http://localhost:21739" from accessing a frame with origin "null".  The frame requesting access has a protocol of "http", the frame being accessed has a protocol of "data". Protocols must match.

为了在搜索类似问题后解决问题，我尝试绕过更改 global.asax 文件的问题

protected void Application_BeginRequest(object sender, EventArgs e)
{
    HttpContext.Current.Response.AddHeader("Access-Control-Allow-Origin", "*");
}

但这没有效果。

当

出现此类错误时，有什么方法可以使异步剑道文件上传工作，我一直找不到遇到相同情况的人？

剑道 UI 上传器异步跨站点脚本与 ASP.NET 问题

有几件事：

1）chrome对XSS问题很明确。除非 chrome 控制台显示跨站点脚本错误，否则我认为这不是您的问题。

2）在出错时给自己添加一个回电。

$("#files").kendoUpload({
            async: {
                saveUrl: "save",
                removeUrl: "remove",
                autoUpload: true
            },
            error: onError
        });
function onError(e){
alert("Failed to upload " + e.files.length + " files " + e.XMLHttpRequest.status + " " + e.XMLHttpRequest.responseText);
}

这将为您提供来自服务器的响应。

3）不确定您使用的是 Asp.net MVC还是Web Api控制器（看起来像 ASP.Net MVC），但是（也许我错了）您的保存属性似乎需要控制器或路由详细信息。

          $("#files").kendoUpload({
            async: {
                saveUrl: "MyControllerName/save", (or api/controller) ( or @Url.Action("Save", "ControllerName")
                removeUrl: "remove",
                autoUpload: true
            }
        });

4）返回KendoUI上传不会喜欢返回类型ActionResult它需要一个JsonResult返回类型。更正：不是100%确定这一点。请注意返回数据的结构。如果它是具有格式正确的 HTML 的字符串，则控件将吠叫

相关文章：