Search code examples
c#phpmysqlimagewin-universal-app

how to use httpClient.postAsync to upload an image or bytes[] in UWP


so i need to upload an image into my Mysql databse along with some other strings like name for an example ... i was able to add the name into Mysql DB but i can not do it for the image . I converted the image inti an byte [] and i'm stuck now .. here is the code i used

private Stream stream = new MemoryStream();
    private CancellationTokenSource cts;

    public MainPage()
    {
        this.InitializeComponent();
    }

    private async void buttonUpload_Click(object sender, RoutedEventArgs e)
    {
        FileOpenPicker open = new FileOpenPicker();
        open.SuggestedStartLocation = PickerLocationId.PicturesLibrary;
        open.ViewMode = PickerViewMode.Thumbnail;

        // Filter to include a sample subset of file types
        open.FileTypeFilter.Clear();
        open.FileTypeFilter.Add(".bmp");
        open.FileTypeFilter.Add(".png");
        open.FileTypeFilter.Add(".jpeg");
        open.FileTypeFilter.Add(".jpg");

        // Open a stream for the selected file
        StorageFile file = await open.PickSingleFileAsync();

        // Ensure a file was selected
        if (file != null)
        {
            // Ensure the stream is disposed once the image is loaded
            using (IRandomAccessStream fileStream = await file.OpenAsync(FileAccessMode.Read))
            {
                BitmapImage bitmapImage = new BitmapImage();
                await bitmapImage.SetSourceAsync(fileStream);
                fileStream.AsStream().CopyTo(stream);
                img.Source = bitmapImage;
            }
        }
    }

    private async void submit_Click(object sender, RoutedEventArgs e)
    {


        Uri uri = new Uri("http://localhost/mydatabase/add.php");
        HttpClient client = new HttpClient();
        HttpStreamContent streamContent = new HttpStreamContent(stream.AsInputStream());
        HttpRequestMessage request = new HttpRequestMessage(HttpMethod.Post, uri);
        request.Content = streamContent;
        HttpResponseMessage response = await client.PostAsync(uri, streamContent).AsTask(cts.Token);



    }

Solution

  • You can use HttpStreamContent class to upload stream directly to your web server. For example:

    private Stream stream = new MemoryStream();
    private CancellationTokenSource cts;
    
    private async void SelectImage(object sender, RoutedEventArgs e)
    {
        FileOpenPicker open = new FileOpenPicker();
        open.SuggestedStartLocation = PickerLocationId.PicturesLibrary;
        open.ViewMode = PickerViewMode.Thumbnail;
    
        // Filter to include a sample subset of file types
        open.FileTypeFilter.Clear();
        open.FileTypeFilter.Add(".bmp");
        open.FileTypeFilter.Add(".png");
        open.FileTypeFilter.Add(".jpeg");
        open.FileTypeFilter.Add(".jpg");
    
        // Open a stream for the selected file
        StorageFile file = await open.PickSingleFileAsync();
    
        // Ensure a file was selected
        if (file != null)
        {
            // Ensure the stream is disposed once the image is loaded
            using (IRandomAccessStream fileStream = await file.OpenAsync(FileAccessMode.Read))
            {
                BitmapImage bitmapImage = new BitmapImage();
                await bitmapImage.SetSourceAsync(fileStream);
                fileStream.AsStream().CopyTo(stream);
                img.Source = bitmapImage;
            }
        }
    }
    
    private async void UploadImage(object sender, RoutedEventArgs e)
    {
        Uri uri = new Uri("you web uri");
        HttpClient client = new HttpClient();
        HttpStreamContent streamContent = new HttpStreamContent(stream.AsInputStream());
        HttpRequestMessage request = new HttpRequestMessage(HttpMethod.Post, uri);
        request.Content = streamContent;
        HttpResponseMessage response = await client.PostAsync(uri, streamContent).AsTask(cts.Token);
    }
    

    As we've discussed in your another question, you may refer to the official HttpClient sample, scenario 5 is about posting stream.

    For a client app, what we can do is just uploading the file stream correctly, and the important thing is, you will need to implement the image decoding function and save to mysql in your server.

    By the way, you've asked the same question upload an image into mysql database using windows universal app once and I've seen your newest comment to my answer, I won't update my answer in that case, hope this is the right you asked for.