代码不在服务器上工作但在localhost上工作

Question

在这里，我使用代码通过应用程序从Facebook获取用户和他的朋友的照片代码在localhost中正常工作，但不在服务器中。这是我想要的整个功能：

点击按钮
1. 从facebook数据中获取用户信息
2. 显示带下拉菜单的弹出窗口
3. 显示用户第一张专辑的图片
4. 显示选择中的frnds图片
5. 点击任何图像，所选图像应显示在下一个div
中

所有上述功能都在localhost和server上实现，但第一张专辑图片显示不正确，点击任何图片也无法正常工作

// chk for login of user
function Login(y) {
                picidgen = y;
                FB.login(function (response) {
                    if (response.authResponse) {
                        getUserInfo();//get user info
            sbsfbdemo();// open popup
                    } else {
                        console.log('User cancelled login or did not fully authorize.');
                    }
                }, {
                        scope: 'email,user_photos,user_videos,read_friendlists,friends_photos',
                });
        }

        function getUserInfo() {
                FB.api('/me?fields=name,albums,photos,friends', function (response) {
                    var str = "  Select  Friends  " + "<select name='frndlst2' onchange='frndsalbum()' id='frndlst2'>"
                    str += "<option value='" + response.id + "'selected ='selected'>" + "me" + "</option>";
                    for (i = 0; i < response.friends.data.length; i++)
                        str += "<option value='" + response.friends.data[i].id + "'>" + response.friends.data[i].name + "</option>"
                        str += "</select>"
                        str += "   Select  Album  " + "<select name='frndlst1' onchange='getfrndsphotos()' id='frndlst1'>"
                    for (x = 0; x < response.albums.data.length; x++)
                        str += "<option value='" + response.albums.data[x].id + "'>" + response.albums.data[x].name + "</option>"
                        str += "</select>";
                        document.getElementById("status").innerHTML = str;
                        picid = response.albums.data[0].id;
                        var c = response.albums.data[0].count;
                FB.api('/' + picid + '/photos?limit=400&offset=0', function (photos) {
                    if (photos && photos.data && photos.data.length) {
                        for (var j = 0; j < c; j++) {
                            var photo = photos.data[j];
                    // photo.picture contain the link to picture
                            var image = document.createElement('img');
                            image.style.border = "1px solid black";
                            image.style.margin = "10px";
                            image.style.cursor = "pointer";
                            image.src = photo.picture; //user photo is displayed in  div(named picture)
                            picsrc["a" + j] = photo.source;
                            image.className = "a";
                            image.id = "a" + j;
                            document.getElementById("picture").appendChild(image);
                        }
                    }
                $(".a").bind("click", function () {
                        var photo = $(this).attr("id");
                        imagecrop = picsrc[photo];
                        $("#big-pic").find("img").attr("src", picsrc[photo]);// onclick of image it should be displayed in 2nd div(named big-pic)
                });
                });
                });
        }
        function frndsalbum() {
                document.getElementById("frndlst1").options.length = 0;
                var f2 = document.getElementById("frndlst2");
                ffrr = f2.options[f2.selectedIndex].value;
                    FB.api('/' + ffrr + '?fields=albums', function (response) {
                            var f1 = document.getElementById("frndlst1");
                            for (var i = 0; i < response.albums.data.length; i++) {
                                var album = response.albums.data[i];
                                var option = document.createElement('option');
                                option.text = album.name;
                                option.value = album.id;
                                f1.appendChild(option);
                            }
                document.getElementById("picture").innerHTML = "";
                var picid = response.albums.data[0].id;
                var c = response.albums.data[0].count; //1st album lenth
                    FB.api('/' + picid + '/photos?limit=400&offset=0', function (photos) {
                        if (photos && photos.data && photos.data.length) {
                            for (var j = 0; j < c; j++) {
                                var photo = photos.data[j];
// photo.picture contain the link to picture
                                var image = document.createElement('img');
                                image.style.border = "1px solid black";
                                image.style.margin = "10px";
                                image.style.cursor = "pointer";
                                image.src = photo.picture;
                                picsrc["a" + j] = photo.source;
                                image.className = "a";
                                image.id = "a" + j;
                                document.getElementById("picture").appendChild(image);
                            }
                        }
                    $(".a").bind("click", function () {
                        var photo = $(this).attr("id");
                        imagecrop = picsrc[photo];
                        $("#big-pic").find("img").attr("src", picsrc[photo]);
                    });
                    });
                    });
        }
        function getfrndsphotos() {
                document.getElementById("picture").innerHTML = "";
                var f1 = document.getElementById("frndlst1");
                ffr = f1.options[f1.selectedIndex].value;
                    FB.api('/' + ffr + '/photos?limit=400&offset=0', function (photos) {
                        if (photos && photos.data && photos.data.length) {
                            for (var j = 0; j < photos.data.length; j++) {
                                var photo = photos.data[j];
// photo.picture contain the link to picture
                                var image = document.createElement('img');
                                image.style.border = "1px solid black";
                                image.style.margin = "10px";
                                image.style.cursor = "pointer";
                                image.src = photo.picture;
                                picsrc["a" + j] = photo.source;
                                image.className = "a";
                                image.id = "a" + j;
                document.getElementById("picture").appendChild(image);
                        }
                        }
                $(".a").bind("click", function () {
                    var photo = $(this).attr("id");
                    imagecrop = picsrc[photo];
                    $("#big-pic").find("img").attr("src", picsrc[photo]);
        });
    });

}