MySQL在JS函数中选择结果

Question

我找到了一个简单的JS脚本作为聊天机器人.在脚本本身,lastUserMessage的结果是内联预定义的

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

我想要实现的是,如果JS在db中搜索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>

需要做什么？

理想情况下,脚本应采取值" lastUserMessage "和" botMessage "从具有2列"分贝lastUserMessage "和" botMessage ".

我试图做的是遵循下面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以及如何处理请求,我建议您根据自己的专业水平调查ExpressJS和W3Schools上的这个伟大的MySQL + NodeJS教程

Answer 2

这就是我在斯塔莫斯的帮助下让它发挥作用的方法

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 = "";
}

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;
}

<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>

在 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);