这个巨大的javascript数组从数据库加载崩溃我的网站
Will this huge javascript array loaded from a database crash my website?
所以在这个网站上我做(谁知道如果我真的完成它lol),当有人打开新的用户页面,php返回到一个javascript脚本所有的用户名从数据库创建一个数组。
<script type="text/javascript">
var allUsers = ['!' <?php
$result = mysql_query("SELECT username FROM users ") or die("error " .mysql_error());
$usersArray = array();
while($row = mysql_fetch_array($result, MYSQL_ASSOC)) {
$usersArray[] = $row['username'] or die("error ". mysql_error());
}
foreach ($usersArray as $name) {
echo ',' . json_encode($name );
}
?> , ];
这样做的目的是要有一个实时检查器,所以如果您输入一个已经存在的用户名,则在用户名输入旁边显示红色文本。但假设我有100万用户(完全是理论上的)。幸运的是,数组只在网页加载开始时创建。但是,检查用户名是否已经存在于大数组中并每次有人更改用户名输入文本时调用的函数是否会给脚本带来太大的压力,从而导致网站崩溃?如果是这样,有没有更好的方法来做我所描述的?
下面是剩下的代码
function contains(a, obj) {
var i = a.length;
while (i--) {
if (a[i] === obj) {
return true;
}
}
return false;
}
function onUserChange() { //gets called onkeypress, onpaste, and oninput
if(contains(allUsers, str)) {
div.innerHTML = "Username already exists";
div.style.color = "red";
userValid = false;
}
}
</script>
大致是这样的。(使用jQuery和PDO) -注意-代码不测试。
var keyTimer, request;
$('namefield').blur(function(){
onUserChange();
});
$('namefield').keyup(function(){
onUserChange();
});
function onUserChange() { //gets called onkeypress, onblur
keyTimer = setTimeout(function(){
if(request && request.readystate != 4){
//cancel a previous request if a new request is made.
request.abort();
}
request = $.post(
'http://yoursite.com/location/of/username/script.php', //post data to server
{username : $('namefield').val()},
function(data){
if(data == 0 ) { //might be a string here
alert( 'the name is ok to use.' );
}else{
alert( 'someone has this name already.' );
}
}
);
}, 500); //overwrite previous timeout if user hits key within 500 milliseconds
}
然后在后端
$sql = 'SELECT id FROM users WHERE username = :username';
//insert from post username but we are good programers and are using PDO to prevent sql injection.
//search for the username in the db, count the number of users or rows should be 1 someone has it 0 no one has it assuming its unique.
$stmt = $Pdo->prepare($sql);
$stmt->execute(array(':username', $_POST['username']));
echo $stmt->rowCount();
exit();
等等…
不要这样做。我的建议是使用ajax来加载php文件,该文件将只查询在输入中键入的用户并只返回一个布尔值(exists=true/notexists=false)
代码示例:HTML (yourFile.html):
<script>
jQuery(document).ready(function(){
//When the value inside the input changes fire this ajax querying the php file:
jQuery("#inputUser").change(function(){
var input = jQuery(this);
jQuery.ajax({
type:"post",
url:"path/to/file.php",
data:input.val(),
success: function(data){
//if php returns true, adds a red error message
if(data == "1"){
input.after('<small style="color:#ff0000;">This username already exists</small>');
//if php returns false, adds a green success message
} else if(data == "0"){
input.after('<small style="color:#00ff00;">You can use this username</small>');
}
}
});
});
});
</script>
<input id="inputUser" type="text" name="username" value="">
PHP(路径//file.php):
<?php
$username = $_REQUEST['username']; // The value from the input
$res = mysqli_query("SELECT id FROM users WHERE username='".$username."'"); // asking only for the username inserted
$resArr = mysqli_fetch_array($res);
//verify if the result array from mysql query is empty.(if yes, returns false, else, returns true)
if(empty($resArr)){
echo false;
} else{
echo true;
}
?>
我可以看到你需要加载PHP代码时,您的网站正在加载。首先,我建议您将代码分开。你可以把Javascript和PHP混在一起,但这并不意味着它就是最佳实践。
第二,是的,它不是有效的代码,因为你让Javascript加载结果,所以你可以搜索到它下一步。我建议你在服务器端进行搜索,而不是在客户端,因为正如你所说,如果你有100个元素,也许最好是加载所有内容并执行函数,但如果你有1,000,000个元素,也许最好是让服务器计算,这样它就可以用SQL进行查询。
第三,您可以使用Ajax、Javascript或jQuery这样的框架来完成所有这些,这样您就不必担心Ajax的实现,而只需担心您的主要任务。
- Jquery(多读/少读)在从数据库加载整个数据后不起作用
- 当select标记触发onChange事件时,从mysql数据库加载html表
- 为什么 Javascript 和 AJAX 调用(在页面加载时)会导致数据库行为空?(脸书画布)
- SuiteScript:如何有一个自定义的数据字段来从数据库加载信息
- 在Moqui中,如何在html.ftl中加载数据库表数据作为下拉列表
- Selectize.js:如何将数据库中已经选择的标签预加载到输入字段(Meteor&MongoDB/JSON)
- Angular js,在选择元素上,我想 POST 数据以将其保存在数据库中,然后我想使用 PUT 更新它而无需重新加载
- 从数据库加载记录,不带提交按钮的下拉选择
- 无限滚动:从数据库加载所有数据并滚动以显示更多
- 使用 SQL .js在 JavaScript 中加载 SQLite 数据库
- 有没有办法重新加载主GEPlugin数据库
- 如何高亮显示选定的文本并存储在数据库中,以及当页面重新加载时,如何高亮显示回选定的文本
- 单击图像时从数据库加载选项id
- 如何使用YDN-db在另一个Html页面中加载数据库上下文
- 在css背景上动态加载数据库中的图像
- 我如何通过ajax加载数据库内容之前,一个过滤器键被按下
- 点击加载数据库项
- JQuery没有'ajax加载数据库后无法工作
- 基于用户文本输入动态加载数据库
- 可以't在dhtmlxgantt.php中加载数据库