如何使用HTML5，CSS3和JAVASCRIPT从SQL Server数据库插入和访问数据？ [英] How to insert and access data from SQL server database by using HTML5, CSS3 and JAVASCRIPT?
问题描述
我正在尝试使用HTML5，CSS3和JAVASCRIPT将数据插入SQL Server。按下按钮后，所有值都应存储在数据库中，并再次从SQL Server访问数据并显示在HTML5表中。但我无法理解如何做到这一点。我正在使用Visual Studio 2010来创建HTML页面和SQL Server数据库。
能帮我找到正确的解决方案吗？
我无法在Google搜索中找到有效的解决方案。实际上我找到了一个从SQL服务器插入和访问数据的解决方案。但它不起作用。
我尝试过：
我尝试了以下代码：
来源链接：
使用JavaScript中的文本框在数据库中插入记录 [ ^ ]
代码：我按照上述链接中的所有步骤进行了操作。
Hi,
I am trying to insert data into SQL Server by using HTML5, CSS3 and JAVASCRIPT. After press a button all the values should store in the database and again access data from SQL Server and display in HTML5 table. But I can't understand how to do it. I am using Visual Studio 2010 for creating HTML pages and SQL Server Database.
Can any help me for finding correct solution for this?
I am unable to find working solution for this in Google search. Actually I found one solution for inserting and accessing data from SQL server. But it is not working.
What I have tried:
I tried bellowing code:
Source Link:
Insert Record in Database Using Textboxes in JavaScript[^]
Code: I followed all the steps as same in above link.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script type="text/javascript" >
function InsertRecord()
{
var txtid = document.getElementById('txtid').value;
var txtname = document.getElementById('txtname').value;
var txtsalary = document.getElementById('txtsalary').value;
var txtcity = document.getElementById('txtcity').value;
if (txtid.length != 0 || txtname.length !=0 || txtsalary.length !=0|| txtcity.length !=0)
{
var connection = new ActiveXObject("ADODB.Connection");
var connectionstring = "Data Source=.;Initial Catalog=EmpDetail;Persist Security Info=True;User ID=sa;Password=****;Provider=SQLOLEDB";
connection.Open(connectionstring);
var rs = new ActiveXObject("ADODB.Recordset");
rs.Open("insert into Emp_Info values('" + txtid + "','" + txtname + "','" + txtsalary + "','" + txtcity + "')", connection);
alert("Insert Record Successfuly");
txtid.value = " ";
connection.close();
}
else
{
alert("Please Enter Employee \n Id \n Name \n Salary \n City ");
}
}
function ShowAll()
{
var connection = new ActiveXObject("ADODB.Connection");
var connectionstring = "Data Source=.;Initial Catalog=EmpDetail;Persist Security Info=True;User ID=sa;Password=****;Provider=SQLOLEDB";
connection.Open(connectionstring);
var rs = new ActiveXObject("ADODB.Recordset");
rs.Open("select * from Emp_Info ", connection);
rs.MoveFirst();
var span = document.createElement("span");
span.style.color = "Blue";
span.innerText = " ID " + " Name " + " Salary" + " City ";
document.body.appendChild(span);
while (!rs.eof)
{
var span = document.createElement("span");
span.style.color = "green";
span.innerText = "\n " + rs.fields(0) + " | " + rs.fields(1) + " | " + rs.fields(2) + " | " + rs.fields(3);
document.body.appendChild(span);
rs.MoveNext();
}
rs.close();
connection.close();
}
</script>
<style type="text/css">
#main
{
height: 264px;
}
#ShowRecord
{
width: 67px;
z-index: 1;
left: 20px;
top: 257px;
position: absolute;
}
#showall
{
z-index: 1;
left: 114px;
top: 257px;
position: absolute;
}
</style>
</head>
<body style="height: 431px">
<div id="show">
style="font-size: x-large; font-weight: bold; height: 298px; color: #009999;">
Insert Employee Record<p style="font-size: medium; color: #000000;">
Employee Id
<input id="txtid" type="text" /></p>
<p style="font-size: medium; color: #000000;">
Name
<input id="txtname" type="text" /></p>
<p style="font-size: medium; color: #000000;">
Salary
<input id="txtsalary" type="text" /></p>
<p style="font-size: medium; color: #000000;">
City
<input id="txtcity" type="text" /></p>
<input id="ShowRecord" type="button" value="Insert" />
<input id="showall" type="button" value="Show All Record" /></div>
</body>
</html>
当我尝试使用上面的代码插入或访问数据时，它会显示以下错误。
错误说明：
JavaScript运行时错误：多步OLE DB操作产生的错误。检查每个OLE DB状态值（如果可用）。没有做任何工作。
我试图找到上述错误的解决方案，在此过程中，我得到了有关activeXobject方法的信息。
错误参考链接：
https://support.microsoft.com/en-in/kb/269495 [ ^ ]
推荐答案
不是解决方案，而是建议：
- 使用ActiveX是一个坏主意，因为只有IE支持它们，并且由于安全风险，它们在大多数情况下被停用。
- 使用JS只访问SQL是一个坏主意，因为它是所有客户端的，你必须向客户端提供SQL凭据（也就是用户ID和密码）。
- 永远不要建立一个SQL查询这种方式
Not a solution, but advice:
- It is a bad idea to use ActiveX because only IE support them and they are desactivated in most of them because security risks.
- It is a bad idea to use JS only to access SQL because it is all client side and the, you have to provide SQL credentials (aka User Id and password) to the client.
- Never build a SQL query this way
rs.Open("insert into Emp_Info values('" + txtid + "','" + txtname + "','" + txtsalary + "','" + txtcity + "')", connection);
它打开了SQL注入的大门，这是另一件坏事，因为来自用户的简单恶意输入足以接管你的数据库。
出于明显的安全原因，所有SQL访问必须在服务器端。
SQL注入 [ ^ ]
作为 MSDN文档 [ ^ ]状态：
As MSDN documentation[^] states:
- 不要在ADO连接字符串中使用Persist Security Info关键字!!!
- Do not use the "Persist Security Info" keyword in your ADO connection string!!!
var connectionstring = "Data Source=.;Initial Catalog=EmpDetail;Persist Security Info=True;User ID=sa;Password=****;Provider=SQLOLEDB";
有关详细信息，请参阅：故障排除80040e21错误 - adOpenStatic.com [ ^ ]
这篇关于如何使用HTML5，CSS3和JAVASCRIPT从SQL Server数据库插入和访问数据？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
