Face API无效图片网址

时间:2018-04-03 10:00:05

标签: javascript html image api face

我正在尝试将Microsoft的Face API集成到我的.NET C#Webforms应用程序中。我希望实现它的方式来自JavaScript,就像他们网站上的快速入门指南所示。

他们的例子在这里: https://docs.microsoft.com/en-us/azure/cognitive-services/face/quickstarts/javascript

我尝试了同样的事情,但仅限于从用户侧上传的图片。这是我的代码:

    <script type="text/javascript">
    $().ready(function () {
        $("#a").change(function (evt) {
            var tgt = evt.target || window.event.srcElement,
            files = tgt.files;

            // FileReader support
            if (FileReader && files && files.length) {
                var fr = new FileReader();
                fr.onload = function () {
                    document.getElementById('b').src = fr.result;
                }
                fr.readAsDataURL(files[0]);
            }

                // Not supported
            else {
                // fallback -- perhaps submit the input to an iframe and temporarily store
                // them on the server until the user's session ends.
            }
        })
    });

    function processImage() {
        // **********************************************
        // *** Update or verify the following values. ***
        // **********************************************
        var x = document.getElementById("a")
        // Replace the subscriptionKey string value with your valid subscription key.
        var subscriptionKey = "*********************";

        // Replace or verify the region.
        //
        // You must use the same region in your REST API call as you used to obtain your subscription keys.
        // For example, if you obtained your subscription keys from the westus region, replace
        // "westcentralus" in the URI below with "westus".
        //
        // NOTE: Free trial subscription keys are generated in the westcentralus region, so if you are using
        // a free trial subscription key, you should not need to change this region.
        var uriBase = "https://westcentralus.api.cognitive.microsoft.com/face/v1.0/detect";

        // Request parameters.
        var params = {
            "returnFaceId": "true",
            "returnFaceLandmarks": "false",
            "returnFaceAttributes": "emotion",
        };

        // Display the image.

        var sourceImageUrl = document.querySelector("#b").src;
        //var sourceImageUrl = "";

        // Perform the REST API call.
        console.log(sourceImageUrl);
        $.ajax({
            url: uriBase + "?" + $.param(params),

            // Request headers.
            beforeSend: function (xhrObj) {
                xhrObj.setRequestHeader("Content-Type", "application/json");
                xhrObj.setRequestHeader("Ocp-Apim-Subscription-Key", subscriptionKey);
            },

            type: "POST",
            // Request body.
            data: '{"url": ' + '"' + sourceImageUrl + '"}',
        })

        .done(function (data) {
            // Show formatted JSON on webpage.
            $("#responseTextArea").val(JSON.stringify(data, null, 2));
        })

        .fail(function (jqXHR, textStatus, errorThrown) {
            // Display error message.
            var errorString = (errorThrown === "") ? "Error. " : errorThrown + " (" + jqXHR.status + "): ";
            errorString += (jqXHR.responseText === "") ? "" : (jQuery.parseJSON(jqXHR.responseText).message) ?
                jQuery.parseJSON(jqXHR.responseText).message : jQuery.parseJSON(jqXHR.responseText).error.message;
            alert(errorString);
        });
    };
</script>
<input id="a" type="file" />
<img id="b" />
<button onclick="processImage()">Analyze face</button>
<textarea id="responseTextArea" class="UIInput" style="width:580px; height:400px;"></textarea>

我收到的错误是“图片无效的网址”。 我加载的图像转换为“data:image / jpeg; base64,/ 9j / 4gIcSUNDX1BST0ZJTEU [...]”

我也在他们的网站上提到,在演示中,他们的图像格式与我的相同。

任何帮助都会有用!

1 个答案:

答案 0 :(得分:0)

您只需要发送"/9j/4gIcSUNDX1BST0ZJTEU[...]"