前端该怎么获取数据?_问答_ThinkSAAS
前端该怎么获取数据?
前端该怎么获取数据?
是这样的,我需要在我的页面上增加一个战队系统,大概涉及的内容有加入战队,查询战队,用户查询等等.
关于加入战队功能的实现思路:
当加入战队时,给服务器发送一个加入战队的请求,然后
服务器能及时的返回相应,告诉我请求已经成功(这种功能是不是用到websocket)
服务器会等到我再次刷新页面的时候,才在页面上显示是否加入战队成功
我觉得第一种方法更适合web应用,但是我想写的网页并不算是web应用,因为我觉得用户发送加入战队的请求后,可能就关闭我的网页去做别的事了,所以这种及时返回消息的功能可能不适合我的页面
所以我选择第二种思路来写网页
现在的问题是,当用户加载网页的时候,我的战队系统该怎么获取相关信息呢(比如,战队系统得知道我是否加入了战队,我的用户id)?
目前想到的思路有两个:
1 当页面加载后,用js去解析html页面的结构,从中分析出需要用到的数据,例如
&span data-user_id="001"&测试用户&/span&
已经加入的战队&span data-my_team_id="998"&测试战队&/span&
这样通过js一解析,我就知道当前用户的状态
2 当页面加载完成后,用ajax发起请求,获取用户的相关数据
我总觉得第二种方法不是很好,但是也觉得第一种方法怪怪的,所以想知道合适的做法是什么.
这个是战队系统的截图
1）通过Ajax请求发送加入请求，在当前页面提示用户加入请求正在处理，等Ajax请求完成后告知用户结果
2）如果发送请求后用户关闭的页面，那么等第2次用户打开页面时，发送查询是否已经加入战队，如果已经加入（通过1发送的），那么提示用户已经加入，页面跳转到相应地页面，如果没有加入（可能压根就没有发送过加入请求，如同1之前的状态），那么页面显示提示用户加入的页面
①：如果是随机用户（游客）也可以加入的话，加入战队的时候 可以通过发送ip 到后端 后端对你这个ip做标记 说你加入了战队，在短时间内 你刷新页面都是通过发送ip去获取你的相关信息，但是ip 也是会变的，不会永久性能在一个地方登陆曾经注册的，
②：如果你是要固定的用户ID 给下次可以用的话 就需要先注册 然后再加入战队 这样主要你 触发加入战队，就算是关闭了电脑 下次登陆后 就能获取到你在哪个战队的信息，你需要给后端发送你的用户id
2.如果只是单纯加入战队并且显示加入成功与否的话 这种功能不需要用到websocket，这里ajax 就能实现，而且一般都是聊天系统才用得到websoket(web端和服务器端需要实时交互信息) ,
建议你先读读HTTP权威指南
你需要补充很多知识
这个问题在你给服务器发送加入战队请求的时候post用户id给服务器！然后服务器处理这个id和加入战队请求后给数据库写入战队数据！你下次打开的时候再获取战队数据就可以了！
黯葉篂讖（这名字是念暗夜星谶吗www）说的对。
你的需求接近“私信系统”：不要求即时性，刷新页面就能获得“消息”（就是加入战队的情况“）。
我的解决思路是这样的：每次加载页面，向服务器ajax“加入战队”的处理结果。
如果有，输出。然后用户确认之后，告诉服务器“已阅”，服务器就把这个处理结果从数据库中删掉。
没有处理结果？那就没啥事了…
ps.利用javascript里的setInterval函数，可以自定义向服务器ajax的间隔…比如说每秒钟都看看有没有新的处理结果。其实第二种方法并没有那么“不好”…
读了你的思路，我发现了一个问题：用户信息和战队信息居然不是一起拿到的…这对我来说稍微有点不可思议…如果我写后端代码的话一定会把这两个东西绑一起，一次性用sql查出来，发送给客户端…
不就是个增删改查吗？别自己把自己搞复杂了。还websocket，我囧。。先把http搞懂了。。
添加你想要问的问题
PHP开发框架
开发工具/编程工具
服务器环境js 如何实现对数据库的增删改查
字体：[ ] 类型：转载 时间：
JavaScript操作数据库JS操作Access数据库，跟其他语言操作差不多，总结了一下习惯代码，需要的朋友可以参考下
JavaScript操作数据库JS操作Access数据库，跟其他语言操作差不多，总结了一下习惯代码，仅供参考学习。 现在在F盘有文件abc.mdf，表名为Student，一共2个字段，Id数字类型主键，stuName文本类型，现对该表进行增删改查的操作： 1.查询
代码如下: &HTML& &HEAD& &TITLE&数据查询&/TITLE& &Script & var conn = new ActiveXObject("ADODB.Connection"); conn.Open("DBQ=f://abc.DRIVER={Microsoft Access Driver (*.mdb)};"); var rs = new ActiveXObject("ADODB.Recordset"); var sql="select * from Student"; rs.open(sql, conn); var html=""; while(!rs.EOF) {& html=html+rs.Fields("Id")+" "+rs.Fields("stuName"); rs.moveNext(); } document.write(html); rs.close(); rs = conn.close(); conn = &/script& &/HEAD& &BODY& &/BODY& &/HTML&
2.增加操作
代码如下: &HTML& &HEAD& &TITLE&增加操作&/TITLE& &script language="javascript"& function addUser(id,stuName) { //用 JavaScript 写服务器端连接数据库的代码示例 var conn = new ActiveXObject("ADODB.Connection"); conn.Open("DBQ=F://abc.DRIVER={Microsoft Access Driver (*.mdb)};"); var sql="insert into Student(ID,stuName) values("+id+",'"+stuName+"')"; try{ conn.execute(sql); alert("添加成功"); } catch(e){ document.write(e.description); alert("添加失败~~~"); } conn.close(); } &/script& &/HEAD& &BODY& &table width=100 border=1& &tr bgcolor='#f4f4f4'& &td&编号&/td& &td&姓名&/td& &/tr& &tr& &td&&input id="stuId" /&&/td& &td&&input id="stuName"/&&/td& &/tr& &/table& &input name="1" type="button" value="添加" onclick="addUser(stuId.value,stuName.value)"/& &/BODY& &/HTML&
3.删除操作
代码如下: &HTML& &HEAD& &TITLE&删除操作&/TITLE& &script language="javascript"& function delStu(id) { var conn = new ActiveXObject("ADODB.Connection"); conn.Open("DBQ=F://abc.DRIVER={Microsoft Access Driver (*.mdb)};"); var sql="delete from Student where Id=2"; conn.execute(sql); conn.close(); conn = alert("修改成功"); } &/script& &/HEAD& &BODY& &input name="1" type="button" value="删除" onclick="delStu(1)"/& &/BODY& &/HTML&
4.修改操作
代码如下: &HTML& &HEAD& &TITLE&修改操作 &/TITLE& &/HEAD& &script& function updateUser(userId,userName) { var conn = new ActiveXObject("ADODB.Connection"); conn.Open("DBQ=F://abc.DRIVER={Microsoft Access Driver (*.mdb)};"); var rs = new ActiveXObject("ADODB.Recordset"); var sql="update Student set stuName='" + userName + "' where Id=" + userId + ""; conn.execute(sql); conn.close(); conn = alert("修改成功"); } &/script& &BODY& &table width=100 border=1& &tr bgcolor='#f4f4f4'& &td&编号&/td& &td&姓名&/td& &/tr& &tr& &td&&input id="stuId" /&&/td& &td&&input id="stuName"/&&/td& &/tr& &/table& &input name="1" type="button" value="修改" onclick="updateUser(stuId.value,stuName.value)"/& &/BODY& &/HTML&
另外，JS也可以操作SQL Server数据库 数据库名为：MySchool，表名为Student，StudentId为int类型，自增列，studentName为学生姓名，为varchar类型。数据库用户名为sa，密码是ok，
代码如下: &HTML& &HEAD& &TITLE&SQL数据查询&/TITLE& &Script & var conn = new ActiveXObject("ADODB.Connection"); conn.Open("Driver={SQL server};Server=.;DataBase=MySUID=Password=");//打开数据库 var rs = new ActiveXObject("ADODB.Recordset"); var sql="select * from Student"; rs.open(sql, conn); var html=""; while(!rs.EOF) { html=html+rs.Fields("StudentId")+" "+rs.Fields("studentName")+"&br/&"; rs.moveNext(); } document.write(html); rs.close(); rs = conn.close(); conn = &/script& &/HEAD& &BODY& &/BODY& &/HTML&
您可能感兴趣的文章:
大家感兴趣的内容
12345678910
最近更新的内容
常用在线小工具js向专用页面传值并执行数据库操作【可得到返回值】
我的图书馆
js向专用页面传值并执行数据库操作【可得到返回值】
var&ss = "Railway.aspx?D2="+escape(flname)+"&&D3="+jibie+"&&D4="+shangji+"&&D1="+//flname为字符串其余参数为数字&&&window.open(ss);
返回值代码：
var obj = new AJAXRequest();&&&obj.method="get";&&&obj.url = 'Railway.aspx?D1='+escape(value);&&//&window.open(obj.url);&&&obj.callback = function (xmlhttp) &&&{&&&&&& var type= xmlhttp.responseText;&&&//&&& alert(type);&&&&&& var c=11;&&&&&& if(type!='')&&&&{&&&&&&& var obja = type.split("|#|");&&&&&&& var objl=obja[1].split("&*&*");&&&&&&& var objr=objl[0].split(",");&&&&&& &&&&&&& for(var i=0;i&objr.i++)&&&&&&& {&&&&&&&&&&& opt=new Option(objr[i],objr[i]);&&&&&&&& rb.options.add(opt);&&&&&}&&&&}&&&}&&&obj.send();
专用页面：Railway.aspx前台代码
&%@ Page Language="C#" AutoEventWireup="true" CodeFile="Railway.aspx.cs" Inherits="web_vipuser_Railway" %&
后台代码：
using Susing System.Cusing System.Cusing System.Dusing System.Lusing System.Wusing System.Web.Susing System.Web.UI;using System.Web.UI.HtmlCusing System.Web.UI.WebCusing System.Web.UI.WebControls.WebPusing System.Xml.Lusing System.Collections.Gusing DAL;public partial class web_vipuser_Railway : System.Web.UI.Page{&&& protected void Page_Load(object sender, EventArgs e)&&& {&&&&&&& if (!IsPostBack)&&&&&&& {&&&&&&&&&&& string name = Request.QueryString["D1"];&&&&&&&&&&& if (name != null)&&&&&&&&&&& {&&&&&&&&&&&&&&& Getnames(name, 1);&&&&&&&&&&& }&&&&&&&&&&& string name1 = Request.QueryString["E1"];&&&&&&&&&&& if (name1 != null)&&&&&&&&&&& {&&&&&&&&&&&&&&& Getnames(name1, 2);//执行查询&&&&&&&&&&& }&&&&&&&&&&& //Response.Write(Request.QueryString["D1"] + Request.QueryString["D2"]);&&&&&&&&&&& //int flid = 0;&&&&&&&&&&& //if (Request.QueryString["D1"] == "" || Request.QueryString["D1"] == null)&&&&&&&&&&& //{&&&&&&&&&&& //&&& flid = 1;&&&&&&&&&&& //}&&&&&&&&&&& //else&&&&&&&&&&& //{&&&&&&&&&&& //&&& flid = Convert.ToInt32(Request.QueryString["D1"]);&&&&&&&&&&& //}&&&&&&&&&&& //int flid = Convert.ToInt32(Request.QueryString["D1"]);&&&&&&&&&&& //string flname = Request.QueryString["D2"];&&&&&&&&&&& //int shangji = Convert.ToInt32(Request.QueryString["D4"]);&&&&&&&&&&& //int jibie = Convert.ToInt32(Request.QueryString["D3"]);&&&&&&&&&&& //Add_fl(flid, flname,jibie,shangji);//执行插入&&&&&&& }&&& }
&&& public void Getnames(string name, int sid)//查询数据&&& {&&&&&&& string num = "";&&&&&&& string sql = "select CONTENTS from MIS.tielu_drop_table where NAMES='" + name + "' and sid=" +&&&&&&& DataTable dt = DBHelper.GetDataSet(sql);&&&&&&& num = dt.Rows[0][0].ToString();&&&&&&& Response.Write(num);&&& }
&&& //public static int Add_fl(int flid, string flname, int jibie,int shangji)//插入数据&&& //{&&& //&&& int ds = 0;&&& //&&& string sql = string.Format("insert into MIS.JZG_INDUSTRY_CLASSIFICATION(HYFL_ID,HYFL_NAME,PARENT_NO,LEVEL_NO) values({0},'{1}',{2},{3})", flid, flname, shangji, jibie);&&& //&&& ds = DBHelper.getNonQuery(sql);&&& //&&&&&& //}}
TA的推荐TA的最新馆藏[转]&[转]&[转]&[转]&[转]&[转]&