2

jquery uploadfyプラグインを使用してファイルコンテンツを[WebMethod]に渡したいのですが、Uploadメソッドを呼び出すことができません。誰か助けてもらえますか?前もって感謝します!Index.aspx:

<head runat="server">
<title></title>
<link href="uplodify/uploadify.css" rel="stylesheet" type="text/css" />
<script src="Scripts/jquery-1.4.1.min.js" type="text/javascript"></script>
<script src="uplodify/swfobject.js" type="text/javascript"></script>
<script src="uplodify/jquery.uploadify.v2.1.4.min.js" type="text/javascript"></script>
<script type="text/javascript">
    $(document).ready(function () {
        $('#file_upload').uploadify({
            'uploader': '/uplodify/uploadify.swf',
            'script': '/Index.aspx/Upload',
            'cancelImg': '/uplodify/cancel.png',
            'buttonImg': '/uplodify/browse.jpg',
            'sizeLimit': 262144, 
            'fileExt': '*.jpg',
            'fileDesc': '*.jpg',
            'folder': '/pic',
            'onProgress': function (event, ID, fileObj, data) {
                var bytes = Math.round(data.bytesLoaded / 1024);
                $('#' + $(event.target).attr('id') + ID).find('.percentage').text(' - ' + bytes + 'KB ');
                return false;
            },
            'onSelect': function (event, ID, fileObj) {
                if (parseInt(fileObj.size) > 262144) {
                    window.alert fileObj.name");
                    return false;
                }
            },
            'onComplete': fun

        });

    });

    function checkImport() {
        if ($.trim($('#file_uploadQueue').html()) == "") {
            alert('please select pic!');
            return false;
        }
        else {
            jQuery('#file_upload').uploadifyUpload();
            return true;
        }

    }
    function fun(event, queueID, fileObj, response, data) {


    }

</script>
</head>


  <body>
<form id="form1" runat="server">
<div>
    <img height="100" width="100" src="nopic.jpg" id="filesUploaded" runat="server" />
    <input id="file_upload" name="file_upload" type="file" />
    <input id="Button1" type="button" value="uploadfile" onclick="checkImport()" runat="server"
        class="ui-corner-all" /><br />
</div>
</form>
</body>

Index.cs:

  public partial class Index : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {

    }
    [WebMethod]
    public static string Upload(byte[] FileData)
    {

        return "";
    }
}
4

1 に答える 1

4

ASP.NETページでは、メソッドapplication/jsonはコンテンツタイプを使用して呼び出されることを想定しています。したがって、新しいWebFormまたは汎用ハンドラーのいずれかを使用してファイルのアップロードを処理できます。

$(document).ready(function () {
    $('#file_upload').uploadify({
        'swf': '<%= ResolveUrl("~/uploadify/uploadify.swf") %>',
        'uploader': '<%= ResolveUrl("~/upload.ashx") %>'
    });
});

汎用ハンドラーは次のようになります。

public class Upload : IHttpHandler
{
    public void ProcessRequest(HttpContext context)
    {
        HttpPostedFile uploadedFile = context.Request.Files["FileData"];
        // TODO: do something with the uploaded file. For example
        // you could access its contents using uploadedFile.InputStream

        context.Response.ContentType = "text/plain";
        context.Response.Write("Hello World");
    }

    public bool IsReusable
    {
        get { return true; }
    }
}

また、デバッグを容易にするために、クライアントとWebサーバー間のHTTPトラフィックを検査して、発生する可能性のある潜在的なエラーを表示できるFiddlerなどのツールを使用します。また、FireBugやChrome開発者ツールなどのJavaScriptデバッグツールは必須です。

于 2012-11-10T13:53:15.763 に答える