MySQL在JS函数中选择结果

Question

我找到了一个简单的 JS 脚本，可以作为聊天机器人使用。 在脚本本身中，lastUserMessage的结果是内联预定义的，如

if (lastUserMessage === 'name') {
   botMessage = 'My name is ' + botName;
}

我想要实现的是 JS 在数据库中搜索 lastUserMessage 并从那里提供 botMessage 。

我确信它应该那么难，但我无法弄清楚该怎么做。

以下是 JS 代码：

nlp = window.nlp_compromise;
var messages = [], //array that hold the record of each string in chat
  lastUserMessage = "", //keeps track of the most recent input string from the user
  botMessage = "", //var keeps track of what the chatbot is going to say
  botName = 'Bot Name', //name of the chatbot
  talking = true; //when false the speach function doesn't work

//edit this function to change what the chatbot says
function chatbotResponse() {
  talking = true;
  botMessage = "Ops... didn't get this"; //the default message

  if (lastUserMessage === 'name') {
    botMessage = 'My name is ' + botName;
  }

}

//this runs each time enter is pressed.
//It controls the overall input and output
function newEntry() {
  //if the message from the user isn't empty then run 
  if (document.getElementById("chatbox").value != "") {
    //pulls the value from the chatbox ands sets it to lastUserMessage
    lastUserMessage = document.getElementById("chatbox").value;
    //sets the chat box to be clear
    document.getElementById("chatbox").value = "";
    //adds the value of the chatbox to the array messages
    messages.push(lastUserMessage);
    //Speech(lastUserMessage);  //says what the user typed outloud
    //sets the variable botMessage in response to lastUserMessage
    chatbotResponse();
    //add the chatbot's name and message to the array messages
    messages.push("<b>" + botName + ":</b> " + botMessage);
    // says the message using the text to speech function written below
    Speech(botMessage);
    //outputs the last few array elements of messages to html
    for (var i = 1; i < 8; i++) {
      if (messages[messages.length - i])
        document.getElementById("chatlog" + i).innerHTML = messages[messages.length - i];
    }
  }
}

//runs the keypress() function when a key is pressed
document.onkeypress = keyPress;
//if the key pressed is 'enter' runs the function newEntry()
function keyPress(e) {
  var x = e || window.event;
  var key = (x.keyCode || x.which);
  if (key == 13 || key == 3) {
    //runs this function when enter is pressed
    newEntry();
  }
  if (key == 38) {
    console.log('hi')
      //document.getElementById("chatbox").value = lastUserMessage;
  }
}

//clears the placeholder text ion the chatbox
//this function is set to run when the users brings focus to the chatbox, by clicking on it
function placeHolder() {
  document.getElementById("chatbox").placeholder = "";
}

以下是HTML代码

<div id='bodybox'>
  <div id='chatborder'>
    <p id="chatlog2" class="chatlog">&nbsp;</p>
    <p id="chatlog1" class="chatlog">&nbsp;</p>
    <input type="text" name="chat" id="chatbox" placeholder="Hi there! Type here to talk to me." onfocus="placeHolder()">
  </div>

需要做什么？

  

理想情况下，脚本应采用值＆＃34; lastUserMessage ＆＃34;和   ＆＃34;的 botMessage ＆＃34;来自具有2列＆＃34; lastUserMessage ＆＃34;的数据库和   ＆＃34;的 botMessage ＆＃34;

我试图做的是遵循以下Ghost的评论......但是没有用。

    nlp = window.nlp_compromise;
var messages = [], //array that hold the record of each string in chat
  lastUserMessage = "", //keeps track of the most recent input string from the user
  botMessage = "", //var keeps track of what the chatbot is going to say
  botName = 'Bot Name', //name of the chatbot
  talking = true; //when false the speach function doesn't work

//edit this function to change what the chatbot says
function chatbotResponse() {
  talking = true;
  botMessage = "Ops... didn't get this"; //the default message

      $.ajax({                                      
  url: 'db_query.php',         
  data: "lastUserMessag=lastUserMessag", 
  dataType: 'json',                 
  success: function(data)          
  {
    var lastUserMessage_db = data[0]; 
    var botMessage_db= data[1];

if (lastUserMessage === lastUserMessage_db) {
    botMessage = botMessage_db;
  }
  } 
});

}

//this runs each time enter is pressed.
//It controls the overall input and output
function newEntry() {
  //if the message from the user isn't empty then run 
  if (document.getElementById("chatbox").value != "") {
    //pulls the value from the chatbox ands sets it to lastUserMessage
    lastUserMessage = document.getElementById("chatbox").value;
    //sets the chat box to be clear
    document.getElementById("chatbox").value = "";
    //adds the value of the chatbox to the array messages
    messages.push(lastUserMessage);
    //Speech(lastUserMessage);  //says what the user typed outloud
    //sets the variable botMessage in response to lastUserMessage
    chatbotResponse();
    //add the chatbot's name and message to the array messages
    messages.push("<b>" + botName + ":</b> " + botMessage);
    // says the message using the text to speech function written below
    Speech(botMessage);
    //outputs the last few array elements of messages to html
    for (var i = 1; i < 8; i++) {
      if (messages[messages.length - i])
        document.getElementById("chatlog" + i).innerHTML = messages[messages.length - i];
    }
  }
}

//runs the keypress() function when a key is pressed
document.onkeypress = keyPress;
//if the key pressed is 'enter' runs the function newEntry()
function keyPress(e) {
  var x = e || window.event;
  var key = (x.keyCode || x.which);
  if (key == 13 || key == 3) {
    //runs this function when enter is pressed
    newEntry();
  }
  if (key == 38) {
    console.log('hi')
      //document.getElementById("chatbox").value = lastUserMessage;
  }
}

//clears the placeholder text ion the chatbox
//this function is set to run when the users brings focus to the chatbox, by clicking on it
function placeHolder() {
  document.getElementById("chatbox").placeholder = "";
}

在DB_query.php中我有

$p = $_GET['lastUserMessag']; 
      $query=mysql_query("SELECT lastUserMessag, botMessage FROM `aiml` WHERE lastUserMessag='$p'");
      $array = mysql_fetch_row($query);  
    echo json_encode($array);

Answer 1

您正在执行的Javascript当前在浏览器中运行，但未连接到您可以从中获取数据的任何数据库。

为此，您必须向后端服务器发送POST或GET请求（假设您有一个），我认为，这是使用NodeJS用JS编写的。

请注意，您应 从不 授予用户访问权限（例如，将数据库连接到您正在使用的代码，该代码在浏览器中执行）到所述数据库然后他们就可以用它做任何他们想做的事。

如果您想了解NodeJS以及如何处理请求，建议您根据自己的专业水平调查W3Schools上的ExpressJS和this great MySQL + NodeJS tutorial

Answer 2

Javascript在客户端的浏览器中运行。 MySQL在服务器中运行。因此，需要其他东西来连接它们。

我使用PHP和AJAX作为它们之间的管道。 JS发出一个AJAX调用。 （注意：“A”代表“异步”。）然后JS通过“回调”获得结果。同时，AJAX“调用”的目标是一个PHP程序（或Java或VB或......），它连接到数据库（MySQL）并执行SELECT并构建JSON以交付给JS。

Answer 3

您确认db_query.php有效吗？

尝试使用POSTMAN或Broswer之类的Chrome来点击网址。 localhost/db_query.php或正确的，看看你是否得到了你期望的结果。

如果你得到了预期的结果，那么你的JavaScript就出了问题。

$ .ajax是异步的，所以它将被调用，javascript执行将继续。

我试着解释一下。您致电chatbotResponse()，$.ajax拨打success来设置数据

var lastUserMessage_db = data[0]; 
var botMessage_db= data[1];

但$ .ajax是异步的，因此javascript执行将继续，因此这个javascript代码将在调用成功之前运行

    //add the chatbot's name and message to the array messages
    messages.push("<b>" + botName + ":</b> " + botMessage);
    // says the message using the text to speech function written below
    Speech(botMessage);
    //outputs the last few array elements of messages to html
    for (var i = 1; i < 8; i++) {
      if (messages[messages.length - i])
        document.getElementById("chatlog" + i).innerHTML = messages[messages.length - i];
    }

所以问题是上述代码会在您从lastUserMessage

获取db_query.php之前运行

<强>解决方案

简单的解决方案是将ajax更改为同步调用async:false，这不是最佳做法。

$.ajax({                                      
  url: 'db_query.php?lastUserMessage='+lastUserMessage,         
  type: "GET",
  async: false,               
  success: function(data)          
  {
    var lastUserMessage_db = data[0]; 
    var botMessage_db= data[1];

if (lastUserMessage === lastUserMessage_db) {
    botMessage = botMessage_db;
  }
  } 
});

更好的方法是利用成功回调

示例：

$.ajax({
      url: 'db_query.php?lastUserMessage='+lastUserMessage,         
      type: "GET",
      success: function(data) {
        var lastUserMessage_db = data[0];
        var botMessage_db = data[1];

        if (lastUserMessage === lastUserMessage_db) {
          botMessage = botMessage_db;
        }

        //add the chatbot's name and message to the array messages
        messages.push("<b>" + botName + ":</b> " + botMessage);
        // says the message using the text to speech function written below
        Speech(botMessage);
        //outputs the last few array elements of messages to html
        for (var i = 1; i < 8; i++) {
          if (messages[messages.length - i])
            document.getElementById("chatlog" + i).innerHTML = messages[messages.length - i];
        }

      }
    });

Answer 4

这就是我使用Stamos＆＃39;帮助

＆＃13;

＆＃13;

nlp = window.nlp_compromise;

var messages = [], //array that hold the record of each string in chat
  lastUserMessage = "", //keeps track of the most recent input string from the user
  botMessage = "", //var keeps track of what the chatbot is going to say
  botName = 'Bot Name', //name of the chatbot
  talking = true; //when false the speach function doesn't work
//

//****************************************************************
//edit this function to change what the chatbot says
function chatbotResponse() {
  talking = true;
  botMessage = "Sorry, Didnt get that"; //the default message

  $.ajax({
    url: "appi.php?lastUserMessage=" + lastUserMessage,
    type: "GET",
    async: false,
    success: function(data) {

      var obj = JSON.parse(data);

      if (lastUserMessage === obj.lastUserMessage) {
        botMessage = obj.botMessage;
      }
    }
  });

}

//****************************************************************

//this runs each time enter is pressed.
//It controls the overall input and output
function newEntry() {
  //if the message from the user isn't empty then run 
  if (document.getElementById("chatbox").value != "") {
    //pulls the value from the chatbox ands sets it to lastUserMessage
    lastUserMessage = document.getElementById("chatbox").value;
    //sets the chat box to be clear
    document.getElementById("chatbox").value = "";
    //adds the value of the chatbox to the array messages
    messages.push(lastUserMessage);
    //Speech(lastUserMessage);  //says what the user typed outloud
    //sets the variable botMessage in response to lastUserMessage
    chatbotResponse();
    //add the chatbot's name and message to the array messages
    messages.push("<b>" + botName + ":</b> " + botMessage);
    // says the message using the text to speech function written below
    Speech(botMessage);
    //outputs the last few array elements of messages to html
    for (var i = 1; i < 8; i++) {
      if (messages[messages.length - i])
        document.getElementById("chatlog" + i).innerHTML = messages[messages.length - i];
    }
  }
}

//text to Speech
//https://developers.google.com/web/updates/2014/01/Web-apps-that-talk-Introduction-to-the-Speech-Synthesis-API
function Speech(say) {
  //if ('speechSynthesis' in window && talking) {
  //  var utterance = new SpeechSynthesisUtterance(say);
  //msg.voice = voices[10]; // Note: some voices don't support altering params
  //msg.voiceURI = 'native';
  //utterance.volume = 1; // 0 to 1
  //utterance.rate = 0.1; // 0.1 to 10
  //utterance.pitch = 1; //0 to 2
  //utterance.text = 'Hello World';
  //utterance.lang = 'en-US';
  // speechSynthesis.speak(utterance);
  // }
}

//runs the keypress() function when a key is pressed
document.onkeypress = keyPress;
//if the key pressed is 'enter' runs the function newEntry()
function keyPress(e) {
  var x = e || window.event;
  var key = (x.keyCode || x.which);
  if (key == 13 || key == 3) {
    //runs this function when enter is pressed
    newEntry();
  }
  if (key == 38) {
    console.log('hi')
    //document.getElementById("chatbox").value = lastUserMessage;
  }
}

//clears the placeholder text ion the chatbox
//this function is set to run when the users brings focus to the chatbox, by clicking on it
function placeHolder() {
  document.getElementById("chatbox").placeholder = "";
}

＆＃13;

body {
  font: 15px arial, sans-serif;
  background-color: #fff;
  padding-top: 15px;
  padding-bottom: 15px;
}

#bodybox {
  margin: auto;
  max-width: 550px;
  font: 15px arial, sans-serif;
  background-color: lightgrey;
  border-style: solid;
  border-width: 1px;
  padding-top: 20px;
  padding-bottom: 25px;
  padding-right: 25px;
  padding-left: 25px;
  box-shadow: 5px 5px 5px grey;
  border-radius: 15px;
}

#chatborder {
  border-style: solid;
  background-color: #f6f9f6;
  border-width: 3px;
  margin-top: 20px;
  margin-bottom: 20px;
  margin-left: 20px;
  margin-right: 20px;
  padding-top: 10px;
  padding-bottom: 15px;
  padding-right: 20px;
  padding-left: 15px;
  border-radius: 15px;
}

.chatlog {
  font: 15px arial, sans-serif;
}

#chatbox {
  font: 17px arial, sans-serif;
  //height: 22px;
  width: 100%;
}

h1 {
  margin: auto;
}

pre {
  background-color: #f0f0f0;
  margin-left: 20px;
}

＆＃13;

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap-theme.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
</script>
<div id='bodybox'>
  <h1>Virtual Assistant</h1>
  <div id='chatborder' class="form-group">
    <p id="chatlog7" class="chatlog">&nbsp;</p>
    <p id="chatlog6" class="chatlog">&nbsp;</p>
    <p id="chatlog5" class="chatlog">&nbsp;</p>
    <p id="chatlog4" class="chatlog">&nbsp;</p>
    <p id="chatlog3" class="chatlog">&nbsp;</p>
    <p id="chatlog2" class="chatlog">&nbsp;</p>
    <p id="chatlog1" class="chatlog">&nbsp;</p>
    <input type="text" name="chat" id="chatbox" placeholder="Hi there! Type here to talk to me." onfocus="placeHolder()" class="form-control">
  </div>

＆＃13;

＆＃13;

＆＃13;

在appi.php中我有这段代码

$p = $_GET['lastUserMessage'];
//open connection to mysql db
$connection = mysqli_connect("localhost","username","password","dbname");

//fetch table rows from mysql db
$sql = "select lastUserMessage, botMessage FROM `table_name` WHERE lastUserMessage='$p'";
$result = mysqli_query($connection, $sql) or die("Error in Selecting " . mysqli_error($connection));

//create an array

$emparray = $array;
while($row =mysqli_fetch_assoc($result))
{
    $emparray = $row;
}
echo json_encode($emparray);

//close the db connection
mysqli_close($connection);