MySQLデータベーステーブルからJavaScript変数を取得する方法は？

Question

データベースからJavaScriptコードにJavaScriptのvarを使用したいと考えています。

私は、ユーザーやメンバーが自分のツイッチ名をリストに追加して、他のメンバーがオンラインのときにそれらを見ることができるようにする方法でストリーミングを助けるコミュニティを持っています。

私のコードは次のとおりです。データベースから JAVASCRIPT

var hello = "hello"; 
/* This is an alternate method to creating javascript methods 
function streamer(name, status, url) { 
    this.name = name; 
    this.status = status; 
    this.url = url; 
} */ 

// The streamer object 
// here we will store the necessary information from 
// the twitch api json file 
var Streamer = { 
    id: 0, 
    status: "title", 
    name: "strimmah", 
    display_name: "Strimmah", 
    url: "https://secure.twitch.tv/freecodecamp", // test url 
    previewImgs: ["large", "medium", "small", "template"], 
    game: "GaM3", 
    viewers: 0, 

    init: function(name, status, game, url) { 
    this.name = name; 
    this.status = status; 
    this.game = game; 
    this.url = url; 
    }, 
    init: function(name, status, game, viewers, url) { 
    this.name = name; 
    this.status = status; 
    this.game = game; 
    this.viewers = viewers; 
    this.url = url; 
    }, 

    initPreviewImgs: function(large, medium, small, template) { 
    this.previewImgs[0] = large; 
    this.previewImgs[1] = medium; 
    this.previewImgs[2] = small; 
    this.previewImgs[3] = template; 

    } 
}; 
// delete test variables 
var test = Object.create(Streamer); 
var backUpImage = "https://static-cdn.jtvnw.net/ttv-static/404_preview-640x360.jpg"; 
var tempStreamers = [ 
"nokss68", 
"snake606", 
"team_itxx_cod", 
"relapsegtv", 
"sokkaenpyjama", 
"elfepurpl3", 
"lighthund", 
"spacecakezed", 
"nagatsu6", 
"xng360", 
"nazenko", 
"giiskaa", 
"floki_live", 
"kayakox", 
"jejen64", 
"spivix", 
"keryg4n", 
"mehdii95150", 
"mrgeekyfr", 
"zaykerz92", 
"etsalutdit", 
"x_dyn_x", 
"martind32", 
"el_fideo11", 
"xmisticoxx", 
"zookervinc78", 
"MrCraaftt", 
"killerelite84", 
"Aqu0ss", 
"panteleimon42", 
"veynstream", 
"le_salty_gamer" 
]; 
var streamDisplayStatus = 1; // 0-ALL, 1-Online Only, 2-Offline only 
var twitchURL = "https://secure.twitch.tv/"; // to create channel urls 

var streamerArray = []; 
var showOffline = true; 
// ENTRY POINT, 
$(document).ready(function() { 
    /*for (var i = 0; i < tempStreamers.length; i++) { 
     loadStreamJsonInfo(tempStreamers[i], test); 
    }*/ 
    // initial set of streamers, we start with Overview so show all 
    instantiateStreamers(); 
    // navigator button setup 
    navigationButtons(); 
}); 

function instantiateStreamers() { 
    streamerArray.length = 0; 
    for (var i = 0; i < tempStreamers.length; i++) { 
    var streamer = Object.create(Streamer); 
    loadStreamJsonInfo(tempStreamers[i], streamer); 
    } 
} 

function loadStreamJsonInfo(name, data) { 
    /*$.getJSON('https://api.twitch.tv/kraken/streams/freecodecamp?callback=?', function(json) { 
     console.log(json); 
    }); */ 
    $.getJSON('https://api.twitch.tv/kraken/streams/' + name + '?callback=?', 
    function(json) { 
     // console.log(json); 
     var stream = json.stream; 
     if (stream !== null) { 
     var channel = json.stream.channel; 
     data.init(channel.display_name, channel.status, channel.game, stream.viewers, channel.url); 
     data.initPreviewImgs(stream.preview.large, stream.preview.medium, stream.preview.small, stream.preview.template); 
     // console.log(data.name + " " + data.status + " " + data.viewers); 
     } else { 
     data.init(name, "Offline", "", 0, twitchURL + name) 
     data.initPreviewImgs(backUpImage, backUpImage, backUpImage, backUpImage); 
     } 
     streamerArray.push(data); 
     //console.log("TEST: " + streamerArray.length); 

     checkDisplayStatus(data); 
    }); // end of getJson 
} 

function checkDisplayStatus(data) { 
    switch (streamDisplayStatus) { 
    case 0: 
     createStreamerDOMItem(data); 
     break; 
    case 1: 
     if (data.status !== "Offline") { 
     createStreamerDOMItem(data); 
     } 
     break; 
    case 2: 
     if (data.status === "Offline") { 
     createStreamerDOMItem(data); 
     } 
     break; 
    default: 
     createStreamerDOMItem(data); 
     console.log("Default switch"); 
     break; 
    } 
} 

function createStreamerDOMItem(streamData) { 
    var divStart = '<div class="streamer-container">'; 
    var divEnd = '</div></div>'; 
    var divStreamerItem = '<div class="streamer-item" align="center">' + '<a target="_blank" href="' + streamData.url + 
    '"><iframe src="https://player.twitch.tv/?channel='+ streamData.name +'\" frameborder="0" scrolling="no" height="350" width="100%" /></a>' + 
    '<p id="viewer-count"><font color="yellow">' + streamData.viewers + '&nbsp;personne(s) sur ' + 
    '</font><a href=\"' + streamData.url + '\" id="streamer-link">' + streamData.name + '</a></p>' 
    + ''; 

    var final = divStart + divStreamerItem + divEnd; 
    $(final).appendTo(".live-channels-container"); 
} 

function clearStreamerDOMItems() { 

    $("div").remove(".streamer-container"); 
} 

HTML

<div>     
    <div class="navbar-container" > 
    </div> 
    <br> 
    <div class="live-channels-container"> 
    </div> 
    <!-- END OF STREAMER BOXES--> 
</div> 

今、私は（= VARのtempStreamers）を取得したいユーザ名。

Answer 1

JSONPメソッドでtempStreamを取得することができます。このメソッドでは、データを出力するために新しいAPIが必要です。

2秒ごとに機能するようにsetintervalを使用してください。最新のデータが取得されます。