How to modify <object> data attribute for Google Chrome?-CodePudding

I am trying to change the data attribute of an element with id 'previewImage'. I modify the attribute by doing an Ajax call to another file, and get back the data. All browsers shows the data received from the AJAX-call (image or PDF) (encoded base64), except Google Chrome. Is there an solution for this?

I saw this answer earlier, but I think it is deprecated (it did not work for me): <object> works in every browser except Google Chrome

Ajax Call:

function getFile(id, r = false)
{
    timer = setTimeout(function(){
        $.ajax({
            url: "/project/getFile",
            method: "POST",
            data: {id: id}
        })
            .done(function(data)
            {
                $('#previewImage').prop('data', data);
            })
    }, 100)
}

object:

<object id="previewImage"  style="min-height: 500px">

CodePudding user response：

Thanks for the help everyone! I changed the object tag to an Iframe, witch made the following:

<iframe id="previewImage"  height="500px"></iframe>

The AJAX-call stayed almost the same:

function getFile(id, r = false)
    {
        timer = setTimeout(function(){
            $.ajax({
                url: "/project/getFile",
                method: "POST",
                data: {id: id}
            })
                .done(function(data)
                {
                    $('#previewImage').prop('src', data);
                    $('#previewImage image').css("width: 100%")
                })
        }, 100)
    }

This worked for me!