ajax异步获取后台数据 ，后台是有数据的 前台可能是格式写法问题 不能显示出来
问题描述：
原本是这样一段代码 不断自动随机循环的回复聊天记录的数据 ，现在想把这个自动回复改成线上后台回复
// 模拟接受信息
function get() {
let text = ['您好。！' ,'您可以描述下你的问题吗？' ,' 如果您不想等待可以留下电话号码，我们尽快给您回拨电话过去' ,' 你可以详细描述你的问题吗?']
let data = {
status: 1,
userId: '1',
img: 'k2.png',
time:getTodayBegin() ,
content: text[Math.floor(Math.random() * 4)]
}
let chat_html = `
<div class="msg-box">
<div class="msg-agent">
<div class="agent-avatar"><img src="../wap/img/` + data.img + `" style="width:36px;"></div>
<div class="arrow_box_left" style="margin-left:10px;">
<div class="text1">[系统提示] ` + data.time +`</div>
<div class="text">
<div> `+ data.content +`</div>
</div>
</div>
</div></div>
`
$('.top-box').append(chat_html)
$('.top-box').scrollTop($('.top-box')[0].scrollHeight + $('.top-box')[0].scrollTop)
}
init(data)
上面是原来正确的代码 下面修改后回复内容 方法一 前台显示没有获取到 content数据
// 模拟接受信息
function get() {
if (window.XMLHttpRequest)
{// 针对 IE7+, Firefox, Chrome, Opera, Safari 的代码
xmlhttp=new XMLHttpRequest();
}
else
{// 针对 IE6, IE5 的代码
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
let text = [xmlhttp.responseText]
let data = {
status: <%=ukid%>,
userId: '1',
img: 'k1.png',
time:getTodayBegin() ,
content: text[xmlhttp.responseText]
};
}
}
xmlhttp.open("GET","/online_data/index.asp?act==update&ukid=<%=ukid%>",true);
xmlhttp.send();
let chat_html = `
<div class="msg-box">
<div class="msg-agent">
<div class="agent-avatar"><img src="../wap/img/` + data.img + `" style="width:36px;"></div>
<div class="arrow_box_left" style="margin-left:10px;">
<div class="text1">[系统提示] ` + data.time +`</div>
<div class="text">
<div> `+ data.content +`</div>
</div>
</div>
</div></div>
`
$('.top-box').append(chat_html)
$('.top-box').scrollTop($('.top-box')[0].scrollHeight + $('.top-box')[0].scrollTop)
}
init(data)
方法二 也是一样没有获取到 前台显示没有获取到 content数据
$(document).ready(function(){
$.ajax({url:"/online_data/index.asp?act==update&ukid=<%=ukid%>",success:function(result){
let text = [result]
let data = {
status: <%=ukid%>,
userId: '1',
img: 'k1.png',
time:getTodayBegin() ,
content: text[result];
}});
});
后台数据代码 不管怎么样都会又数据传递出来 但是前台 没有获取到任何数据
<%
response.expires=-1
act=ucase(request.querystring("act"))
ukid=ucase(request.querystring("ukid"))
contents=ucase(request.querystring("contents"))
if act="update" then
set rs=server.CreateObject("adodb.recordset")
sql="select * from tian where status='"&ukid&"' and biaoji=0 "
rs.open sql,conn,1,3
if not rs.eof then
biaoji=rs("biaoji")
contents=rs("contents")
rs.Close
Set rs = Nothing
end if
end if
if contents="" then
response.write("no suggestion")
else
response.write(contents)
end if
%>
答
前台的ukid 和传递到后台的ID不一样 把值赋予 status 值就变成另外一个ID啦
下面随机生成的ID
<%
ukid=request.cookies("ukid")
if ukid="" then
ukid=getRnd()
response.cookies("ukid")=ukid
end if
%>
下面是发送信息出现的问题
// 发送信息
function send() {
// console.log()
data.push({
status: <%=ukid%>,
userId: '2',
img: 'k1.png',
time:getTodayBegin() ,
content: $('#send_content').val()
})
render_page({
status: <%=ukid%>,
userId: '2',
img: 'k1.png',
time:getTodayBegin(),
content: $('#send_content').val()
})
$('#send_content').val('')
}
// 发送后再次渲染页面
function render_page(data) {
$.ajax({ url: '/yydata/', type: 'get', data: data } );
let chat_html = `
<div class="msg-box">
<div class="msg-client">
<div class="client-avatar"><img src="../wap/img/` + data.img + `" style="width:36px;"></div>
<div class="arrow_box" style="margin-right:45px;">
<div class="text1">[系统提示] ` + data.status +`</div>
<div class="text">
<div style="font-family: 微软雅黑; font-weight: normal; font-style: normal; font-size: 12pt; text-decoration: none; ">` + data.content +`</div>
</div>
</div>
</div>
</div>
`
$('.top-box').append(chat_html)
$('.top-box').scrollTop($('.top-box')[0].scrollHeight + $('.top-box')[0].scrollTop)
}
答
就发的代码有4个问题，有帮助麻烦点个采纳，谢谢，有其他问题可以继续问
1）
xmlhttp.open("GET","/online_data/index.asp?act==update&ukid=<%=ukid%>",true);
这里多了个=
2）
let data = {
status: <%=ukid%>,
userId: '1',
img: 'k1.png',
time:getTodayBegin() ,
content: xmlhttp.responseText///这里直接设置返回值就行了，不能按照原来的代码，你原来的是数组
};
3）status: <%=ukid%>,这里使用了动态代码，你的页面需要为asp后缀的，并且ukid要设置有值，要不会导致js语法错误报错。
4）由于ajax异步返回，初始化代码要放到ajax回调成功里面才行，外部无法获取到ajax请求成功后的数据。
// 模拟接受信息
function get() {
if (window.XMLHttpRequest)
{// 针对 IE7+, Firefox, Chrome, Opera, Safari 的代码
xmlhttp=new XMLHttpRequest();
}
else
{// 针对 IE6, IE5 的代码
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
let data = {
status: <%=ukid%>,
userId: '1',
img: 'k1.png',
time:getTodayBegin() ,
content: xmlhttp.responseText
};
//////////////////////////////////
let chat_html = `
<div class="msg-box">
<div class="msg-agent">
<div class="agent-avatar"><img src="../wap/img/` + data.img + `" style="width:36px;"></div>
<div class="arrow_box_left" style="margin-left:10px;">
<div class="text1">[系统提示] ` + data.time +`</div>
<div class="text">
<div> `+ data.content +`</div>
</div>
</div>
</div></div>
`
$('.top-box').append(chat_html)
$('.top-box').scrollTop($('.top-box')[0].scrollHeight + $('.top-box')[0].scrollTop)
init(data)
/////////////////////////////////////
}
}
xmlhttp.open("GET","/online_data/index.asp?act==update&ukid=<%=ukid%>",true);
xmlhttp.send();
}
最后就是自己f12打开浏览器开发工具看下控制台具体的报错。
答
聊天那会正常了 就是后台数据为空的话，还会不断的循环播放
//刷新时间设置
setInterval("GetUserList()", 5 * 1000);
function GetUserList()
{
$.ajax({
url: '/online_data/index.asp?act=CHA&ukid=<%=ukid%>',
type: 'get',
data: data,
error:function(){
alert('请求失败');
},
success:function(){
if (data.contents=="")
{
}else
{
setTimeout(() => {
get()
}, 1000);
}
}
} );
}
答
下面是前台F12 看下的结果
// 发送信息
function send() {
// console.log()
data.push({
status: 202107131100108287,
userId: '2',
img: 'k1.png',
time:getTodayBegin() ,
content: $('#send_content').val()
})
render_page({
status: 202107131100108287,
userId: '2',
img: 'k1.png',
time:getTodayBegin(),
content: $('#send_content').val()
})
$('#send_content').val('')
}
// 发送后再次渲染页面
function render_page(data) {
$.ajax({ url: '/yydata/', type: 'get', data: data } );
在页面上输出 status的参数 就变成 202107131100108300 很奇怪找不到头绪
答
yydata 的代码 两个判断分别是获取前台 和后台聊天发送内容的存储用的
response.expires=-1
status=ucase(request.querystring("status"))
userId=ucase(request.querystring("userId"))
content=ucase(request.querystring("content"))
If userId ="2" Then
set rs=server.CreateObject("adodb.recordset")
sql="select * from tian"
rs.open sql,conn,1,3
rs.addnew
rs("content")=content
rs("status")=status
rs("userId")=userId
rs.update
rs.Close
Set rs = Nothing
end if
If userId ="3080666" Then
set rs=server.CreateObject("adodb.recordset")
sql="select * from tian"
rs.open sql,conn,1,3
rs.addnew
rs("content")=content
rs("status")=status
rs("userId")=userId
rs.update
rs.Close
Set rs = Nothing
end if