asp.net - 上传 - MVC3 : HTTP 302 Redirect Error (due to asp. 网络身份验证)

Question

我使用 uploadify 批量上传文件，但收到 302 重定向错误。我假设这是因为某些 asp.net 身份验证 cookie token 未在脚本调用中传回。

我有 uploadify 在常规的 mvc3 应用程序中工作，但是当我尝试将其集成到安全的 asp.net mvc3 应用程序中时，它会尝试重定向到帐户/登录。

我有一个身份验证 token (@auth)，它在 View 中以长字符串形式返回，但我仍然收到 302 重定向错误。

有什么想法如何发送 cookie 身份验证数据吗？

查看:

 @{
     string auth = @Request.Cookies[FormsAuthentication.FormsCookieName] == null ? string.Empty : Request.Cookies[FormsAuthentication.FormsCookieName].Value;
     }


<script type="text/javascript">
    jQuery.noConflict();
    jQuery(document).ready(function () {
        jQuery("#bulkupload").uploadify({
            'uploader': '@Url.Content("~/Scripts/uploadify.swf")',
            'cancelImg': '/Content/themes/base/images/cancel.png',
            'buttonText': 'Browse Files',
            'script': '/Creative/Upload/',
            scriptData: { token: "@auth" }, 
            'folder': '/uploads',
            'fileDesc': 'Image Files',
            'fileExt': '*.jpg;*.jpeg;*.gif;*.png',
            'sizeLimit': '38000',
            'multi': true,
            'auto': true,
              'onError'     : function (event,ID,fileObj,errorObj) {
      alert(errorObj.type + ' Error: ' + errorObj.info);
    }
        });
    }); 
    </script> 

Controller :

public class CreativeController : Controller
{
    public string Upload(HttpPostedFileBase fileData, string token)
    {
      ...
    }
}

UPDATE: Ok, this works fine with IE9 but not in Chrome (Chrome throws the 302). FF doesn't even render the control.

Does anybody know how to get this working in the latest revs for Chrome and FF?

Answer 1

当我尝试将 uploadify 与 asp.net mvc3 一起使用时，我遇到了类似的问题。经过多次谷歌搜索后，我发现这似乎有效。它基本上涉及声明一个自定义属性，然后显式地将身份验证 cookie 传递到 Uploadify 的 HTTP Post 中，并通过自定义属性手动处理 cookie。

首先声明这个自定义属性:

/// <summary>
/// A custom version of the <see cref="AuthorizeAttribute"/> that supports working
/// around a cookie/session bug in Flash.  
/// </summary>
/// <remarks>
/// Details of the bug and workaround can be found on this blog:
/// http://geekswithblogs.net/apopovsky/archive/2009/05/06/working-around-flash-cookie-bug-in-asp.net-mvc.aspx
/// </remarks>
[AttributeUsage(AttributeTargets.Class | AttributeTargets.Method, Inherited = true, AllowMultiple = true)]
public class TokenizedAuthorizeAttribute : AuthorizeAttribute
{
    /// <summary>
    /// The key to the authentication token that should be submitted somewhere in the request.
    /// </summary>
    private const string TOKEN_KEY = "authCookie";

    /// <summary>
    /// This changes the behavior of AuthorizeCore so that it will only authorize
    /// users if a valid token is submitted with the request.
    /// </summary>
    /// <param name="httpContext"></param>
    /// <returns></returns>
    protected override bool AuthorizeCore(HttpContextBase httpContext)
    {
        string token = httpContext.Request.Params[TOKEN_KEY];

        if (token != null)
        {
            FormsAuthenticationTicket ticket = FormsAuthentication.Decrypt(token);

            if (ticket != null)
            {
                var identity = new FormsIdentity(ticket);
                string[] roles = System.Web.Security.Roles.GetRolesForUser(identity.Name);
                var principal = new GenericPrincipal(identity, roles);
                httpContext.User = principal;
            }
        }

        return base.AuthorizeCore(httpContext);
    }
}

然后声明此操作以将身份验证 cookie 传递到您的 ViewData 中，以便您可以将其传递到 Uploadify 小部件。这也将是您稍后调用以实例化 Uploadify 小部件的操作。

    [Authorize]
    public ActionResult UploadifyUploadPartial()
    {
        ViewBag.AuthCookie = Request.Cookies[FormsAuthentication.FormsCookieName] == null
                                 ? string.Empty
                                 : Request.Cookies[FormsAuthentication.FormsCookieName].Value;
        return PartialView("UploadifyUpload");
    }

这是 UploadifyUpload View 的代码。它基本上是设置 Uploadify 的 JavaScript 的包装器。我复制了我的内容，没有进行任何更改，因此您必须根据您的应用程序对其进行调整。需要注意的重要一点是，您将通过 UploadifyUploadPartial 操作中的 ViewData 将 authCookie 传递到 scriptData 属性中。

@if (false)
{
    <script src="../../Scripts/jquery-1.5.1-vsdoc.js" type="text/javascript"></script>
}
@{
    ViewBag.Title = "Uploadify";
}
<script src="@Url.Content("~/Scripts/plugins/uploadify/swfobject.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/plugins/uploadify/jquery.uploadify.v2.1.4.min.js")" type="text/javascript"></script>
<link href="@Url.Content("~/Scripts/plugins/uploadify/uploadify.css")" rel="stylesheet" type="text/css" />
<script>
    $(document).ready(function () {
        CreateUploadifyInstance("dir-0");
    });
    function CreateUploadifyInstance(destDirId) {
        var uploader = "@Url.Content("~/Scripts/plugins/uploadify/uploadify.swf")";
        var cancelImg = "@Url.Content("~/Scripts/plugins/uploadify/cancel.png")";
        var uploadScript = "@Url.Content("~/Upload/UploadifyUpload")";
        var authCookie = "@ViewBag.AuthCookie";
        $('#uploadifyHiddenDummy').after('<div id="uploadifyFileUpload"></div>');
        $("#uploadifyFileUpload").uploadify({
            'uploader': uploader,
            'cancelImg': cancelImg,
            'displayData': 'percentage',
            'buttonText': 'Select Session...',
            'script': uploadScript,
            'folder': '/uploads',
            'fileDesc': 'SunEye Session Files',
            'fileExt': '*.son2',
            'scriptData'  : {'destDirId':destDirId, 'authCookie': authCookie},
            'multi': false,
            'auto': true,
            'onCancel': function(event, ID, fileObj, data) {
                //alert('The upload of ' + ID + ' has been canceled!');
            },
            'onError': function(event, ID, fileObj, errorObj) {
                alert(errorObj.type + ' Error: ' + errorObj.info);
            },
            'onAllComplete': function(event, data) {
                $("#treeHost").jstree("refresh");
                //alert(data.filesUploaded + ' ' + data.errors);
            },
            'onComplete': function(event, ID, fileObj, response, data) {
                alert(ID + " " + response);
            }
        });
    }
    function DestroyUploadifyInstance() {
        $("#uploadifyFileUpload").unbind("uploadifySelect");
        swfobject.removeSWF('uploadifyFileUploadUploader');
        $('#uploadifyFileUploadQueue').remove();
        $('#uploadifyFileUploadUploader').remove();
        $('#uploadifyFileUpload').remove();
    }
</script>
<div id="uploadifyHiddenDummy" style="visibility:hidden"></div>
<div id="uploadifyFileUpload">
</div>

对于上传帖子的操作，请使用新的 TokenizedAuthorize 属性而不是 Authorize 属性:

    [HttpPost]
    [TokenizedAuthorize]
    public string UploadifyUpload(HttpPostedFileBase fileData)
    {
        FormsAuthenticationTicket ticket = FormsAuthentication.Decrypt(Request.Form["authCookie"]);
        if (ticket != null)
        {
            var identity = new FormsIdentity(ticket);
            if (!identity.IsAuthenticated)
            {
                return "Not Authenticated";
            }
        }
        // Now parse fileData...
    }

最后，要使用我们编写的代码，请在您希望托管 Uploadify Widget 的任何 View 上通过 Html.Action Helper 调用 UploadifyUploadPartial Action:

@Html.Action("UploadifyUploadPartial", "YourUploadControllerName")

此时您应该可以开始了。该代码应该在 FF、Chrome 和 IE 9 中运行。如果您有问题，请告诉我。