Как использовать Fine Uploader на стороне сервера в приложении ASP.NET, отличном от MVC

У меня есть следующий код Fine Uploader в разметке на странице aspx в проекте ASP.NET (не MVC):

<link href="../js/fineuploader/fineuploader-3.5.0.css" rel="stylesheet">
<script type="text/javascript" src="../js/fineuploader/fineuploader-3.5.0.js"></script>
<script type="text/javascript">
   $(document).ready(function () {
      var uploader = new qq.FineUploader({
         element: $('#fine-uploader')[0],
         request: {  /* <-- THIS IS WHAT I NEED TO FIGURE OUT */
            endpoint: 'server/handleUploads'
         },
         autoUpload: true,
         multiple: false,
         text: {
            uploadButton: '<asp:Button ID="fineUploadButton" runat="server" CssClass="button" style="width:6;5" Text="Browse" />'
         },
         validation: {
            allowedExtensions: ['mp3', 'wav']
         }
      });
   });
</script>

Для клиентской стороны это работает нормально. Я изменил Fineuploader.css, чтобы получить именно тот вид, который мне нужен (в основном). Когда часть клиентской стороны завершена, мне просто нужно обработать это в моем коде программной части, обработав часть request endpoint.

Я просмотрел несколько примеров на странице github, но для ASP нет примеров, отличных от MVC. Даже самые простые из этих примеров включают создание нового класса и наследование от класса Controller. Поскольку я не делаю этот сайт с MVC, как я могу справиться с аспектом на стороне сервера?

Моя клиентская часть почти завершена, и я могу предоставить больше информации о моем коде на стороне сервера и организации, если это необходимо.


person kmarks2    schedule 23.05.2013    source источник


Ответы (3)


Обработка запросов, отправленных Fine Uploader, довольно тривиальна. Все запросы на загрузку по умолчанию являются POST-запросами, состоящими из нескольких частей. По умолчанию все параметры также присутствуют в полезной нагрузке запроса в виде полей формы.

Я не разработчик ASP.NET, но обрабатывать запросы MPE в ASP.NET не должно быть слишком сложно. На самом деле, это довольно тривиально для большинства серверных языков. Вот пример кода, который должен обрабатывать такой запрос:

using System.Diagnostics;
using System.Net;
using System.Net.Http;
using System.Threading.Tasks;
using System.Web;
using System.Web.Http;

public class UploadController : ApiController
{
    public async Task<HttpResponseMessage> PostFormData()
    {
        // Check if the request contains multipart/form-data.
        if (!Request.Content.IsMimeMultipartContent())
        {
            throw new HttpResponseException(HttpStatusCode.UnsupportedMediaType);
        }

        string root = HttpContext.Current.Server.MapPath("~/App_Data");
        var provider = new MultipartFormDataStreamProvider(root);

        try
        {
            // Read the form data.
            await Request.Content.ReadAsMultipartAsync(provider);

            // This illustrates how to get the file names.
            foreach (MultipartFileData file in provider.FileData)
            {
                Trace.WriteLine(file.Headers.ContentDisposition.FileName);
                Trace.WriteLine("Server file path: " + file.LocalFileName);
            }
            return Request.CreateResponse(HttpStatusCode.OK);
        }
        catch (System.Exception e)
        {
            return Request.CreateErrorResponse(HttpStatusCode.InternalServerError, e);
        }
    }

}

Обратите внимание, что код на стороне сервера также должен возвращать действительный ответ JSON. Подробнее это описано в файле сведений о Fine Uploader на стороне сервера. . В MSDN есть статья, в которой описывается работа с JSON в . NET-приложений. Возможно, здесь требуется класс JsonConvert.

Вы можете узнать больше об обработке этих запросов по адресу http://www.asp.net/web-api/overview/working-with-http/sending-html-form-data,-part-2.

person Ray Nicholus    schedule 23.05.2013
comment
Спасибо миллион, это имеет большое значение. Последнее, что меня интересует. Представляет ли аргумент endpoint request что-то вроде пути к исходному файлу/члену класса? Или мне создать экземпляр объекта UploadController, а затем поместить его по пути, указанному endpoint? - person kmarks2; 23.05.2013
comment
Fine Uploader не знает, какой серверный язык вы используете, и ему это не нужно знать. Значение вашего свойства endpoint представляет собой путь, по которому Fine Uploader отправит запрос POST. Ваш код на стороне сервера должен быть настроен для разбора запросов по этому конкретному пути. Есть несколько способов справиться с этим, которые различаются в зависимости от вашей настройки. - person Ray Nicholus; 23.05.2013
comment
Я думаю, это то, о чем спрашивал ОП... примеры того, как обрабатывать настройку в ASP.NET. - person webworm; 22.08.2014
comment
не совсем @webworm, он специально спрашивал, как это сделать без технологий ASP .Net MVC. В ответе используется базовый класс ApiController, который является частью платформы .Net MVC, поэтому ответ не точен. - person RokumDev; 15.02.2017

Kmarks2, возможно, для вас уже слишком поздно, но это может помочь другим.

Чтобы справиться с этим на стороне сервера в ASP.NET (не MVC), можно создать WebHandler. Это общий элемент обработчика с расширением .ashx (например, FileUpload.ashx ).

Обработчик выглядит так:

<%@ WebHandler Language="C#" Class="FileUpload" %>

using System;
using System.Web;
using System.IO;

public class FileUpload : IHttpHandler {

public void ProcessRequest (HttpContext context) 
{
  // Handle files sent from client
}

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

Конечная точка должна выглядеть так: «http:// имя вашего сервера/xxx/FileUpload.ashx» (например, «http://localhost:3293/xxx/FileUpload.ashx')

person SanthoshM    schedule 26.05.2017

Работа с ASP.NET, который не является проектом MVC, a WebHandler необходим для беспрепятственной обработки запросов. Примеры и использование WebHandler см. здесь.

Ссылаясь на ответ SanthoshM и встроенный в комбинацию образец Fine Uploader MVC VB.net Server-Side, это что я придумал. Я надеюсь, что это может быть полезно для кого-то.

Клиентская сторона

<script> 
           var existingHandler1 = window.onload;
           window.document.body.onload = function () {
               var galleryUploader = new qq.FineUploader({
                   element: document.getElementById("fine-uploader-gallery"),
                   template: 'qq-template-gallery',
                   request: {
                       endpoint: '../App_Extension/FileUpload.ashx'
                   },
                   debug: true,
                   thumbnails: {
                       placeholders: {
                           waitingPath: '../App_Images/waiting-generic.png',
                           notAvailablePath: '../App_Images/not_available-generic.png'
                       }
                   },
                   validation: {
                       allowedExtensions: ['jpeg', 'jpg', 'gif', 'png'],
                       sizeLimit: 3145728 // 3 MB = 3 * 1024 * 1024 bytes
                   },
                   retry: {
                       enableAuto: true
                   },
               });
               if (existingHandler1) { existingHandler1() }
           }

    </script>

На стороне сервера

<%@ WebHandler Language="VB" Class="FileUpload" %>

Imports System
Imports System.Web
Imports System.IO
Imports System.Linq
Imports System.Drawing


Public Class FileUpload : Implements IHttpHandler

    Public Sub ProcessRequest(ByVal context As HttpContext) Implements IHttpHandler.ProcessRequest
        context.Response.ContentType = "text/plain"
        'context.Response.Write("Hello World")
        Dim reader As StreamReader = New StreamReader(context.Request.InputStream)
        Try
            Dim values As String = DateTime.Now.Millisecond.ToString + Rnd(10000).ToString + ".jpg" 'reader.ReadToEnd()
            ' 'BLL.WriteLog(values)
            'Dim img As System.Drawing.Image = System.Drawing.Image.FromStream(context.Request.InputStream)
            ' img.Save("C:\DownloadedFiles\" + DateAndTime.TimeString + ".Jpeg", System.Drawing.Imaging.ImageFormat.Jpeg)
            ''BLL.WriteLog(values)
            Dim responseText As String = Upload(values, context)
            'BLL.WriteLog(responseText)
            context.Response.Write(responseText)
            'context.Response.Write("{""error"":""An Error Occured""}")
        Catch ex As Exception
            'BLL.WriteLog(ex.Message + ex.StackTrace)
        End Try
    End Sub

    Public ReadOnly Property IsReusable() As Boolean Implements IHttpHandler.IsReusable
        Get
            Return False
        End Get
    End Property



    Function Upload(ByVal uploadFile As String, ByVal context As HttpContext) As String
        'BLL.WriteLog("1")
        On Error GoTo upload_error
        Dim strm As Stream = context.Request.InputStream
        Dim br As BinaryReader = New BinaryReader(strm)
        Dim fileContents() As Byte = {}
        Const ChunkSize As Integer = 1024 * 1024
        'Dim uploadFile As String

        'BLL.WriteLog("2")
        ' We need to hand IE a little bit differently...
        ' If context.Request.Browser.Browser = "IE" Then

        'BLL.WriteLog("3")
        Dim myfiles As System.Web.HttpFileCollection = System.Web.HttpContext.Current.Request.Files
        Dim postedFile As System.Web.HttpPostedFile = myfiles(0)
        If Not postedFile.FileName.Equals("") Then
            Dim fn As String = System.IO.Path.GetFileName(postedFile.FileName)
            br = New BinaryReader(postedFile.InputStream)
            uploadFile = fn
        End If
        'End If

        'BLL.WriteLog("4")
        ' Nor have the binary reader on the IE file input Stream. Back to normal...
        Do While br.BaseStream.Position < br.BaseStream.Length - 1
            'BLL.WriteLog("5")
            Dim b(ChunkSize - 1) As Byte
            Dim ReadLen As Integer = br.Read(b, 0, ChunkSize)
            Dim dummy() As Byte = fileContents.Concat(b).ToArray()
            fileContents = dummy
            dummy = Nothing
        Loop

        'BLL.WriteLog("6")

        ' You now have all the bytes from the uploaded file in 'FileContents'

        ' You could write it to a database:

        'Dim con As SqlConnection
        'Dim connectionString As String = ""
        'Dim cmd As SqlCommand

        'connectionString = "Data Source=DEV\SQLEXPRESS;Initial Catalog=myDatabase;Trusted_Connection=True;"
        'con = New SqlConnection(connectionString)

        'cmd = New SqlCommand("INSERT INTO blobs VALUES(@filename,@filecontents)", con)
        'cmd.Parameters.Add("@filename", SqlDbType.VarChar).Value = uploadFile
        'cmd.Parameters.Add("@filecontents", SqlDbType.VarBinary).Value = fileContents
        'con.Open()
        'cmd.ExecuteNonQuery()
        'con.Close()


        ' Or write it to the filesystem:
        Dim writeStream As FileStream = New FileStream("C:\DownloadedFiles\" & uploadFile, FileMode.Create)

        'BLL.WriteLog("7")
        Dim bw As New BinaryWriter(writeStream)
        bw.Write(fileContents)
        bw.Close()

        'BLL.WriteLog("8")

        ' it all worked ok so send back SUCCESS is true!
        Return "{""success"":true}"
        Exit Function

upload_error:
        Return "{""error"":""An Error Occured""}"
    End Function

End Class
person Braxson Giddy    schedule 26.05.2018
comment
Спасибо за клиентский пример. Однако вы определяете поле validation дважды. - person Extragorey; 12.06.2018