Saltar al contenido
Menú
El blog de Kañaz
  • Inicio
  • Acerca de
  • Github
  • Youtube
  • LinkedIn
  • Twitter
El blog de Kañaz

Subir una imagen al almacenamiento de Azure usando Windows Phone

Publicada el 24 noviembre, 201324 noviembre, 2013
Twittear

Windows Azure es fenomenal, lo puedes usar desde repositorio de máquinas virtuales hasta proveedor de servicios pasando por motor de bases de datos. En este artículo te voy a explicar como usar el almacenamiento de Azure para poder tomar una imagen desde tu teléfono y subirla a Windows Azure para después poderla ver desde un explorador.

Configurando el repositorio en Windows Azure

Para comenzar, ve al portal de administración de Azure y crea un nuevo espacio de almacenamiento.

image

Al hacerlo solo debes especificar una ruta del repositorio así como su ubicación.

image

Una vez creado, debes acceder al panel del repositorio como se muestra en la imagen.

image

En la opción de CONTENEDORES puedes tener la opción de agregar un nuevo contenedor, solo debes colocar un nombre para el contenedor y los privilegios de acceso, coloca información similar a la de la siguiente imagen.

image

Ahora ya debes poder ver tu contenedor recién creado en tu lista.

image

Regresa al panel y selecciona la opción de Administrar claves de acceso para poder acceder a la llave que te permite colocar archivos aquí.

image

La solución Windows Phone

Vamos al lado del cliente. Crea un nuevo proyecto Windows Phone. Una vez hecho, en su Main Page establece la siguiente interfaz.

image

 

Crea un objeto para poder invocar al lanzador CameraCaptureTask, después en su handler Completed asigna el stream de la imagen tomada por la cámara al control de imagen.

public partial class MainPage : PhoneApplicationPage
{
CameraCaptureTask capturadorImagen = new CameraCaptureTask();
 
public MainPage()
{
InitializeComponent();
capturadorImagen.Completed += capturadorImagen_Completed;
}
 
private void btnTomarFoto_Tap(object sender, System.Windows.Input.GestureEventArgs e)
{
capturadorImagen.Show();
}
 
void capturadorImagen_Completed(object sender, PhotoResult e)
{
BitmapImage imagenRecibida = new BitmapImage();
imagenRecibida.SetSource(e.ChosenPhoto);
imgControl.Source = imagenRecibida;
}
}

public partial class MainPage : PhoneApplicationPage { CameraCaptureTask capturadorImagen = new CameraCaptureTask(); public MainPage() { InitializeComponent(); capturadorImagen.Completed += capturadorImagen_Completed; } private void btnTomarFoto_Tap(object sender, System.Windows.Input.GestureEventArgs e) { capturadorImagen.Show(); } void capturadorImagen_Completed(object sender, PhotoResult e) { BitmapImage imagenRecibida = new BitmapImage(); imagenRecibida.SetSource(e.ChosenPhoto); imgControl.Source = imagenRecibida; } }

El resultado de esto debe lucir de la siguiente manera hasta ahora.

image

Antes de insertar cualquier línea, agrega la referencia al ensamblado que necesitas, puedes descargarlo desde aquí, después de hacerlo crea una nueva carpeta llamada Clases, y adentro de ella una nueva clase llamada StorageHelper. Tu proyecto, ya completo debe lucir de la siguiente manera.

image

 

Convierte la clase en pública y estática, agrega dos métodos, el primero llamado CrearDatosAzure, privado, sin devolver valores y sin parámetros, el segundo es público, estático, no regresa ningún valor y pide dos parámetros, uno de tipo Stream y otro de tipo cadena, nómbralo SubirImagenesAlmacenamiento.

public static class StorageHelper
{
private static void CrearDatosAzure()
{
}
 
public static void SubirImagenAlmacenamiento(Stream fotoElegida, string nombreArchivo)
{
}
}

public static class StorageHelper { private static void CrearDatosAzure() { } public static void SubirImagenAlmacenamiento(Stream fotoElegida, string nombreArchivo) { } }

El método CrearDatosAzure solo debe tener el detalle de la información de tu cuenta así como la dirección del almacenamiento y asignarla a la clase CloudStorageContext

private static void CrearDatosAzure()
{
var resolver = new CloudStorageClientResolverAccountAndKey(
new StorageCredentialsAccountAndKey("servicioejemplo", "tu llave primaria"),
new Uri("http://servicioejemplo.blob.core.windows.net/"),
new Uri("http://servicioejemplo.table.core.windows.net/"),
new Uri("http://servicioejemplo.queue.core.windows.net/"),
Deployment.Current.Dispatcher);
 
CloudStorageContext.Current.Resolver = resolver;
}

private static void CrearDatosAzure() { var resolver = new CloudStorageClientResolverAccountAndKey( new StorageCredentialsAccountAndKey("servicioejemplo", "tu llave primaria"), new Uri("http://servicioejemplo.blob.core.windows.net/"), new Uri("http://servicioejemplo.table.core.windows.net/"), new Uri("http://servicioejemplo.queue.core.windows.net/"), Deployment.Current.Dispatcher); CloudStorageContext.Current.Resolver = resolver; }

En el segundo método agrega la referencia al anterior y después dos variables, ambas servirán para hacer referencia al repositorio de almacenamiento y su contenedor, si el contenedor no existe lo creará y después por medio de la expresión lambda subirá la información al almacenamiento.

public static void SubirImagenAlmacenamiento(Stream fotoElegida, string nombreArchivo)
{
CrearDatosAzure();
 
var blobClient = CloudStorageContext.Current.Resolver.CreateCloudBlobClient();
var container = blobClient.GetContainerReference("misimagenes");
 
container.CreateIfNotExist(
BlobContainerPublicAccessType.Container,
response =>
{
var blob = container.GetBlobReference(nombreArchivo + ".jpg");
 
blob.UploadFromStream(
fotoElegida,
response2 => { });
});
}

public static void SubirImagenAlmacenamiento(Stream fotoElegida, string nombreArchivo) { CrearDatosAzure(); var blobClient = CloudStorageContext.Current.Resolver.CreateCloudBlobClient(); var container = blobClient.GetContainerReference("misimagenes"); container.CreateIfNotExist( BlobContainerPublicAccessType.Container, response => { var blob = container.GetBlobReference(nombreArchivo + ".jpg"); blob.UploadFromStream( fotoElegida, response2 => { }); }); }

Ya con tu clase lista, regresa a MainPage y crea una variable global de tipo Stream y asigna su valor al de la imagen recibida por medio de la cámara

CameraCaptureTask capturadorImagen = new CameraCaptureTask();
Stream datosImagen;

public MainPage()
{
InitializeComponent();
capturadorImagen.Completed += capturadorImagen_Completed;
}

private void btnTomarFoto_Tap(object sender, System.Windows.Input.GestureEventArgs e)
{
capturadorImagen.Show();
}

void capturadorImagen_Completed(object sender, PhotoResult e)
{
BitmapImage imagenRecibida = new BitmapImage();
  datosImagen = e.ChosenPhoto;
    imagenRecibida.SetSource(e.ChosenPhoto);
imgControl.Source = imagenRecibida;
}

Por último, en el manejador de eventos para el evento Tap del segundo botón debe invocar al método SubirImagenAlmacenamiento de la clase StorageHelper.

private void btnSubirImagen_Tap(object sender, System.Windows.Input.GestureEventArgs e)
{
StorageHelper.SubirImagenAlmacenamiento(datosImagen, "miImagen");
MessageBox.Show("Tu imagen ha sido cargada");
}

private void btnSubirImagen_Tap(object sender, System.Windows.Input.GestureEventArgs e) { StorageHelper.SubirImagenAlmacenamiento(datosImagen, "miImagen"); MessageBox.Show("Tu imagen ha sido cargada"); }

Listo!!! Toma una imagen y súbela, cuando todo esté listo, verás el mensaje de notificación.

image

Ahora ingresa al contenedor de tu sitio de administración en Azure y verifica que el nuevo archivo se encuentre ahí.

image

Copia y pega la dirección y podrás acceder a tu imagen a partir del explorador.

image

Puedes descargar aquí la solución de ejemplo.

1 comentario en «Subir una imagen al almacenamiento de Azure usando Windows Phone»

  1. Pingback: Azure Blob Storage for Apache Cordova App

Deja una respuesta Cancelar la respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Busca en este sitio

MI perfil de Github

Github profile

Sígueme en Twitter

Seguir a @aminespinoza
©2023 El blog de Kañaz | Funciona con SuperbThemes y WordPress