PowerApps - 显示由自定义连接器通过ASP.NET API接收的图像

时间:2018-06-01 06:59:31

标签: asp.net azure-web-sites azure-active-directory powerapps

我正在使用Azure托管的ASP.NET API将项目从我的后端传递到PowerApps画布应用程序。某些项目已分配图像。在这些情况下,我提供图像ID,以使用GetImage(id)方法按需下载图像。在这个方法中,我返回HTTPResponse中的内容。这项工作到目前为止。我可以从浏览器调用该方法,并显示图像。在移动设备上,我无法直接使用该URL,因为该连接由Azure AD保护。我需要使用自定义连接器的方法结果接收图像。不幸的是,我找不到用包含原始图像数据的字符串填充图像控件的方法。怎么办呢? 我可以在API中返回任何其他类型,如果这样可以解决问题。

此致

斯文

1 个答案:

答案 0 :(得分:0)

您可以将图像直接从自定义连接器返回到应用程序。在自定义API的响应中,您需要将格式定义为二进制,将媒体类型定义为image。

        "responses": {
          "default": {
            "description": "default",
            "schema": {
              "type": "string",
              "format": "binary",
              "x-ms-media-kind": "image"
            }
          }
        },

例如,这是一个Azure函数,具有给定的代码(未投入生产,更多的是概念验证),返回条形码:

#r "System.Drawing"

using System.Drawing;
using System.Drawing.Imaging;
using System.IO;
using System.Net;
using System.Net.Http;
using System.Net.Http.Headers;
using ZXing;
using ZXing.Common;

public static async Task<HttpResponseMessage> Run(HttpRequestMessage req, TraceWriter log)
{

    // parse query parameter
    string code = GetQueryStringValue(req, "code");
    string widthStr = GetQueryStringValue(req, "width") ?? "100";
    string heightStr = GetQueryStringValue(req, "height") ?? "50";

    var width = int.Parse(widthStr);
    var height = int.Parse(heightStr);

    if (code == null)
    {
        // Get request body
        dynamic body = await req.Content.ReadAsAsync<object>();
        code = body?.code;
    } 

    if (code == null)
    {
        return req.CreateResponse(
            HttpStatusCode.BadRequest,
            "Please pass a code on the query string or in the request body");
    }

    var writer = new BarcodeWriterPixelData
    {
        Format = BarcodeFormat.UPC_A,
        Options = new EncodingOptions { Height = height, Width = width }
    };

    if (string.IsNullOrEmpty(code))
    {
        code = "123456789012";
    }

    var pixelData = writer.Write(code);
    var ms = new MemoryStream();
    var bitmap = pixelData.ToBitmap();
    bitmap.Save(ms, ImageFormat.Png);
    ms.Position = 0;

    var content = new StreamContent(ms);
    content.Headers.ContentType = new MediaTypeHeaderValue("image/png");
    return new HttpResponseMessage(HttpStatusCode.OK) { Content = content };
}

private static string GetQueryStringValue(HttpRequestMessage req, string name)
{
    return req.GetQueryNameValuePairs()
        .FirstOrDefault(q => string.Compare(q.Key, name, true) == 0)
        .Value;
}

它使用需要在Project.json中声明的ZXing NuGet软件包:

{
  "frameworks": {
    "net46":{
      "dependencies": {
        "ZXing.Net": "0.16.4"
      }
    }
   }
}

然后定义

的类型
{
  "swagger": "2.0",
  "info": {
    "title": "BarcodeGenerator",
    "description": "Barcode generator",
    "version": "1.0"
  },
  "host": "YOUR_FUNCTION_APP_NAME_HERE.azurewebsites.net",
  "basePath": "/api/",
  "schemes": [
    "https"
  ],
  "consumes": [],
  "produces": [],
  "paths": {
    "/BarcodeGenerator": {
      "get": {
        "responses": {
          "default": {
            "description": "default",
            "schema": {
              "type": "string",
              "format": "binary",
              "x-ms-media-kind": "image"
            }
          }
        },
        "summary": "Generate barcode",
        "description": "Generate a barcode.",
        "operationId": "GenerateBarcode",
        "parameters": [
          {
            "name": "code",
            "in": "query",
            "required": true,
            "type": "integer"
          },
          {
            "name": "width",
            "in": "query",
            "required": false,
            "type": "integer"
          },
          {
            "name": "height",
            "in": "query",
            "required": false,
            "type": "integer"
          }
        ]
      }
    }
  },
  "definitions": {},
  "parameters": {},
  "responses": {},
  "securityDefinitions": {},
  "security": [],
  "tags": []
}

希望这会有所帮助!