how to display 'clicked' image in popup in new window

[FranklinAlexander]

Ok, this should be very easy, but I cannot figure this out. I just want to display a full size image in a new browser window by clicking a smaller version in a popup window. I don't know why I can't get this to work, but I am getting the images from and ajax call to a web service. The smaller image displays in the popup, but when clicked a new browser opens and nothing is there. See the Temp1 var in line 19. 

function getBearImage(imageFile, count) {
                console.log("getting bear image");
                var obj = {
                    type: "POST",
                    url: '/BlackBearImages/BBIWebService.asmx/GetImageFile',
                    data: {
                        "filename": imageFile
                    },
                    contentType: "application/x-www-form-urlencoded", //use for POST type
                    //contentType: "application/json; charset=utf-8",
                    error: function (x, y, z, data) {
                        alert(x.responseText + "  " + x.status);
                    }
                };
                $.ajax(obj).done(function(data) {
                    console.log("ajax result ", data);
                    var cp1, cp2;
                    var image = data.getElementsByTagName("base64Binary")[0].innerHTML;                                        
                    let temp1 = "<a href='data:image/jpeg;charset=utf-8;base64," + image + "' target='_blank'><img src='data:image/jpeg;charset=utf-8;base64," + image + "'alt='no image'></img></a>";  //I cannot seem to get the href right. 
                    //let temp1 = "<img src='data:image/jpeg;charset=utf-8;base64," + image + "'alt='no image' onClick='displayInNewTab()'>"
                    //console.log("bear image ", image);

                    if(count == 0) {
                        cp1= new ContentPane({
                             title: "Image",
                             content: temp1
                        });
                        tc.addChild(cp1);
                        console.log("image pane ", cp1);
                    }

                    if(count == 1) {
                        cp2= new ContentPane({
                             title: "Image",
                             content: temp1
                        });
                        tc.addChild(cp2);
                    }
                    console.log("text pane ", cpText)
                });
            }‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

The new browser window opens, but there is no image.

As always, thanks for all of your suggestions. 

Ok, I am answering my own question. Evidently it isn't possible to open base64 URIs in a new Chrome window any more for security reasons. I did find a workaround for anyone who is having the same issue by embedding the image in an iFrame:

$.ajax(obj).done(function(data) {
                    var cp1, cp2;
                    var image = data.getElementsByTagName("base64Binary")[0].innerHTML;
                    var base64URL = "data:image/jpeg;charset=utf-8;base64," + image;
                    function newWindow(base64URL) {
                        var win = window.open;
                        win.document.write('<iframe src="' + base64URL + '"style="width:100%; height:100%;" allowfullscreen></iframe>');
                    }
                    let temp1 = "<img id='bearImg' src='data:image/jpeg;charset=utf-8;base64," + image + "'alt='no image' style='width:230px; height:215px;'>"
                    $("img").on("click", function() {
                        var win = window.open("", "_blank");
                        win.document.write('<iframe src="' + base64URL + '"style="width:100%; height:100%;" allowfullscreen></iframe>');
                    });

                    if(count == 0) {
                        cp1= new ContentPane({
                             title: "Image",
                             content: temp1
                        });
                        tc.addChild(cp1);
                        console.log("image pane ", cp1);
                    }

                    if(count == 1) {
                        cp2= new ContentPane({
                             title: "Image",
                             content: temp1
                        });
                        tc.addChild(cp2);
                    }
                    console.log("text pane ", cpText)
                });‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍