Uso de Visual C# para cargar un archivo en un sitio web

En este artículo se describe cómo cargar un archivo mediante Microsoft Visual C#.

Versión original del producto: Visual C#, ASP.NET, Internet Information Services
Número de KB original: 816150

Introducción

En este artículo paso a paso se describe cómo cargar un archivo de imagen existente desde la unidad de disco duro local a un sitio web. Se usa un control De entrada para cargar una imagen desde el equipo local. Este archivo que se carga se valida en el servidor para asegurarse de que no sobrescribe un archivo existente que ya se ha cargado. El archivo cargado se valida si existe en el servidor. En este artículo se usa el EncType atributo del formulario para lograr la funcionalidad.

Requisitos

En este artículo se supone que está familiarizado con los temas siguientes:

  • Aplicaciones web
  • ASP.NET

En la lista siguiente se describe el software recomendado y la infraestructura de red que necesita:

  • Visual C# .NET o Visual C#
  • Internet Information Services (IIS)

Creación de un formulario web de ASP.NET

  1. Inicie Visual Studio .NET o Visual Studio.

  2. En el menú Archivo, elija Nuevo y, a continuación, haga clic en Proyecto.

    Nota:

    En Visual Studio, seleccione Nuevo en el menú Archivo y, a continuación, haga clic en Sitio web.

  3. En Tipos de proyecto, haga clic en Proyectos de Visual C#. En Plantillas, haga clic en ASP.NET aplicación web.

    Nota:

    En Visual Studio, seleccione Visual C# a la derecha de Lenguaje. En Plantillas, haga clic en ASP.NET sitio web.

  4. En el cuadro Ubicación , escriba la siguiente ubicación y, a continuación, haga clic en Aceptar:
    http://WebServerName/ApplicationName

    Nota:

    WebServerName es un marcador de posición para el nombre del servidor web. ApplicationName es un marcador de posición para el nombre de la aplicación.

    Por defecto, se crea WebForm1.aspx.

    Nota:

    En Visual Studio, seleccione HTTP a la derecha de Ubicación y <http://WebServerName>escriba .

  5. En el menú Ver , haga clic en Origen HTML.

    Nota:

    En Visual Studio, haga clic en Código en el menú Ver .

Modificación de los atributos de formulario

En la ventana HTML de WebForm1, reemplace la etiqueta de formulario por lo siguiente:

<form id="Form1" method="post" runat="server" EncType="multipart/form-data" action="WebForm1.aspx">

El EncType atributo especifica el formato de los datos que se publican. El explorador usa este atributo para codificar la información que se publica en el servidor. El atributo action de este código especifica que la página procesará la solicitud. De forma predeterminada, el atributo de método del formulario se establece en publicar para que pueda enviar grandes cantidades de datos en la transacción.

Agregue el control Input para especificar el archivo que desea cargar en el servidor.

  1. En la ventana HTML de WebForm1, agregue el código siguiente entre las etiquetas de apertura y cierre <form> :

    <INPUT id="oFile" type="file" runat="server" NAME="oFile">
    

    Este control Input especifica el archivo que desea cargar en el servidor.

  2. Puede agregar una cadena de texto delante del control para preguntar al usuario. Escriba el texto siguiente delante del control Input en la ventana HTML de WebForm1:

    Seleccione el archivo de imagen que se va a cargar en el servidor:

Agregar un control Button

  1. En la ventana HTML de WebForm1, agregue el código siguiente entre las etiquetas de apertura y cierre <form> , después del código de control Input:

    <asp:button id="btnUpload" type="submit" text="Upload" runat="server"></asp:button>
    
  2. Este control Button se usa para cargar el archivo que especificó en el control Entrada.

Crear un control Panel que contenga una sola etiqueta para mostrar la salida

En la ventana HTML de WebForm1, agregue el código siguiente entre las etiquetas de apertura y cierre <form> , después del código de control Botón:

<asp:Panel ID="frmConfirmation" Visible="False" Runat="server">
    <asp:Label id="lblUploadResult" Runat="server"></asp:Label>
</asp:Panel>

Este código se usa para mostrar el mensaje para indicar si la carga de archivos se realiza correctamente. Para mostrar esta salida, se crea un control Panel que contiene una sola etiqueta.

Carga del archivo en el evento Button Click

El código de esta sección recupera el archivo del sistema de archivos local, comprueba si el archivo ya existe en el servidor y, a continuación, carga el archivo en el sitio web. Para agregar este código, siga estos pasos:

  1. Haga doble clic en el botón Cargar que se creó en la sección Agregar un control Botón de este artículo para crear un controlador de eventos para el Click evento del control de botón.

  2. Agregue el código siguiente en la parte superior de la ventana Código :

    using System.IO;
    
  3. Agregue el código siguiente al controlador de Click eventos para el botón Cargar :

    string strFileName;
    string strFilePath;
    string strFolder;
    strFolder = Server.MapPath("./");
    // Retrieve the name of the file that is posted.
    strFileName = oFile.PostedFile.FileName;
    strFileName = Path.GetFileName(strFileName);
    if(oFile.Value != "")
    {
        // Create the folder if it does not exist.
        if(!Directory.Exists(strFolder))
        {
            Directory.CreateDirectory(strFolder);
        }
        // Save the uploaded file to the server.
        strFilePath = strFolder + strFileName;
        if(File.Exists(strFilePath))
        {
            lblUploadResult.Text = strFileName + " already exists on the server!";
        }
        else
        {
            oFile.PostedFile.SaveAs(strFilePath);
            lblUploadResult.Text = strFileName + " has been successfully uploaded.";
        }
    }
    else
    {
        lblUploadResult.Text = "Click 'Browse' to select the file to upload.";
    }
    // Display the result of the upload.
    frmConfirmation.Visible = true;
    
  4. En el menú Archivo, haga clic en Guardar todo.

Comprobación de que la acción de carga funciona

  1. En el menú Depurar , haga clic en Iniciar para compilar y ejecutar la aplicación. Aparece un cuadro de texto y un botón de comando.

  2. Escriba la ruta de acceso del archivo de imagen en el cuadro de texto o haga clic en Examinar para buscar el archivo de imagen en el equipo local.

  3. Haga clic en Cargar para enviar el archivo al servidor. Si el archivo es único, recibirá un mensaje que indica que la carga se realizó correctamente. Si el archivo ya existe en el servidor, recibirá un mensaje adecuado. Los archivos que se cargan desde esta aplicación se guardan en la ubicación: C:\inetpub\wwwroot\ApplicationName en el disco duro local.

  4. Para que esta aplicación funcione en .NET Framework, permita el acceso de control total al usuario de ASPNET . Para ello, siga estos pasos:

    1. Busque la carpeta de la aplicación en el Explorador de Windows. La ruta de acceso es C:\inetpub\wwwroot\ApplicationName.

    2. Haga clic con el botón derecho en la carpeta ApplicationName y, a continuación, haga clic en Propiedades. Aparece el cuadro de diálogo Propiedades de ApplicationName .

    3. Haga clic en la pestaña Seguridad.

    4. Haga clic en Agregar. Aparece el cuadro de diálogo Seleccionar usuarios o grupos.

      Nota:

      En Visual Studio, aparece el cuadro de diálogo Seleccionar usuarios, equipos o grupos .

    5. Escriba ASPNET en el cuadro Escribir los nombres de objeto que desea seleccionar y, a continuación, haga clic en Aceptar.

    6. En el cuadro de diálogo Propiedades de ApplicationName , haga clic en el usuario aspnet de la lista Nombres de grupo o de usuario .

    7. En Permitir, haga clic para activar la casilla Control total y, a continuación, haga clic en Aceptar.

Lista de código completa

  • WebForm1.aspx

    <%@ Page language="c#" Codebehind="WebForm1.aspx.cs" AutoEventWireup="false"
       Inherits="Howto.WebForm1" %>
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
    <HTML>
       <HEAD>
          <title>WebForm1</title>
          <meta name="GENERATOR" Content="Microsoft Visual Studio .NET 7.1">
          <meta name="CODE_LANGUAGE" Content="C#">
          <meta name="vs_defaultClientScript" content="JavaScript">
          <meta name="vs_targetSchema" content="http://schemas.microsoft.com/intellisense/ie5">
       </HEAD>
       <body MS_POSITIONING="GridLayout">
          <form id="Form1" method="post" runat="server" EncType="multipart/form-data" action="WebForm1.aspx">
             Image file to upload to the server: <INPUT id="oFile" type="file" runat="server" NAME="oFile">
             <asp:button id="btnUpload" type="submit" text="Upload" runat="server"></asp:button>
             <asp:Panel ID="frmConfirmation" Visible="False" Runat="server">
                <asp:Label id="lblUploadResult" Runat="server"></asp:Label>
             </asp:Panel>
          </form>
       </body>
    </HTML>
    
  • WebForm1.aspx.cs

    using System;
    using System.Collections;
    using System.ComponentModel;
    using System.Data;
    using System.Drawing;
    using System.Web;
    using System.Web.SessionState;
    using System.Web.UI;
    using System.Web.UI.WebControls;
    using System.Web.UI.HtmlControls;
    using System.IO;
    namespace **ApplicationName** {
    /// <summary>
    /// Summary description for WebForm1.
    /// </summary>
    public class WebForm1 : System.Web.UI.Page
    {
        protected System.Web.UI.WebControls.Button btnUpload;
        protected System.Web.UI.WebControls.Label lblUploadResult;
        protected System.Web.UI.WebControls.Panel frmConfirmation;
        protected System.Web.UI.HtmlControls.HtmlInputFile oFile;
    
        private void Page_Load(object sender, System.EventArgs e)
        {
        // Put user code to initialize the page here
        }
        #region Web Form Designer generated code
        override protected void OnInit(EventArgs e)
        {
        // CODEGEN: This call is required by the ASP.NET Web Form Designer.
            InitializeComponent();
            base.OnInit(e);
        }
        /// <summary>
        /// Required method for Designer support - do not modify
        /// the contents of this method with the code editor.
        /// </summary>
        private void InitializeComponent()
        {
            this.btnUpload.Click += new System.EventHandler(this.btnUpload_Click);
            this.Load += new System.EventHandler(this.Page_Load);
        }
        #endregion
    
        private void btnUpload_Click(object sender, System.EventArgs e)
        {
            string strFileName;
            string strFilePath;
            string strFolder;
            strFolder = Server.MapPath("./");
            // Get the name of the file that is posted.
            strFileName = oFile.PostedFile.FileName;
            strFileName = Path.GetFileName(strFileName);
            if(oFile.Value != "")
            {
                // Create the directory if it does not exist.
                if(!Directory.Exists(strFolder))
                {
                    Directory.CreateDirectory(strFolder);
                }
                // Save the uploaded file to the server.
                strFilePath = strFolder + strFileName;
                if(File.Exists(strFilePath))
                {
                    lblUploadResult.Text = strFileName + " already exists on the server!";
                }
                else
                {
                    oFile.PostedFile.SaveAs(strFilePath);
                    lblUploadResult.Text = strFileName + " has been successfully uploaded.";
                }
            }
            else
            {
                lblUploadResult.Text = "Click 'Browse' to select the file to upload.";
            }
            // Display the result of the upload.
            frmConfirmation.Visible = true;
        }
    }
    

Nota:

El código generado en Visual Studio es diferente del código generado en Visual Studio .NET.

Solución de problemas

  1. Abra el archivo Machine.config que se encuentra en el equipo en la carpeta CONFIG de la ruta de acceso donde instaló el tiempo de ejecución.
  2. Busque la <processModel> sección en el archivo Machine.config , cambie los user atributos y password por el nombre y la contraseña del usuario en el que desea que se ejecute W3wp.exe o Aspnet_wp.exe y, a continuación, guarde el archivo Machine.config .
  3. Busque la carpeta Archivos de ASP.NET temporales que se encuentra en la carpeta CONFIG . Haga clic con el botón derecho en la carpeta Archivos de ASP.NET temporales y, a continuación, haga clic en Propiedades.
  4. En el cuadro de diálogo Propiedades de archivos ASP.NET temporales , haga clic en la pestaña Seguridad .
  5. Haga clic en Avanzadas.
  6. En el cuadro de diálogo Configuración de Access Control para archivos de ASP.NET temporales, haga clic en Agregar.
  7. En el cuadro de diálogo, escriba el nombre de usuario en el cuadro Nombre y, a continuación, haga clic en Aceptar.
  8. En el cuadro de diálogo Entrada de permiso para archivos de ASP.NET temporales , conceda al usuario permisos completos y, a continuación, haga clic en Aceptar para cerrar el cuadro de diálogo Propiedades temporales de archivos ASP.NET .

Referencias