当前位置： 首页 > news >正文

利用sessionStorage收集用户访问信息，然后传递给后端

news 2026/5/16 22:21:54

这里只是简单的收集用户的停留时间、页面加载时间、当前页面URL及来源页面，以做示例

<html><head><meta http-equiv="content-type" content="text/html; charset=UTF-8"/><title>测试sessionStorage存储用户访问信息</title></head><body><button id="timer">停止</button><script type="text/javascript">//日期+时间函数function formatDate(){let date=new Date();let Y=date.getFullYear()+'-';let M=date.getMonth()+1 < 10 ? '0'+date.getMonth()+1 : date.getMonth()+1+'-';let D=date.getDate() < 10 ? '0'+date.getDate()+' ' : date.getDate()+' ';let h=date.getHours() <10 ? '0'+date.getHours()+':':date.getHours()+':';let m=date.getMinutes()<10 ? '0'+date.getMinutes()+":":date.getMinutes()+":";let s=date.getSeconds()<10 ? '0'+date.getSeconds() : date.getSeconds();return Y+M+D+h+m+s;}//停留时间变量let timer=null,startTime=new Date().valueOf();//开始时间//页面加载完成后，收集用户信息document.addEventListener('DOMContentLoaded',function(){sessionStorage.setItem('visitedPage',window.location.href);//当前页面sessionStorage.setItem('referrer',document.referrer);//访问来源sessionStorage.setItem('visitTime',formatDate());//访问的日期和时间//计时变量let seconds=0;timer=setInterval(function(){seconds++;sessionStorage.setItem('timerDisplay',seconds);//停留时间，每秒种seconds增加1},1000);});//这里是以点击按钮，然后把数据传递给后端；//现实生成过程过应该是以用户关闭页面；然后把收集数据传递给后端，用unload事件完成const btn=document.getElementById('timer');btn.addEventListener('click',function(){console.log(sessionStorage.getItem('timerDisplay'));console.log(sessionStorage.getItem('visitTime'));//取消停留时间变量clearInterval(timer);//将收集所有数据，存储进frondEndData对象中let v=sessionStorage.getItem('visitTime');let r=sessionStorage.getItem('referrer');let l=sessionStorage.getItem('loadTime');let d=sessionStorage.getItem('timerDisplay');const frontEndData={visitTime:v,referrer:r,loadTime:l,timerDisplay:d};//转换为json格式const frontData=JSON.stringify(frontEndData);const jsonHeaders=new Headers({'Content-Type':'application/json'});//利用fetch传递给后端fetch('sessionStorage.php',{method:'post',body:frontData,headers:jsonHeaders}).then((response)=>{if(response.ok && response.status===200){return response.text();}throw new Error('返回数据有误');})//后端返回的信息.then((data)=>{/*let result=JSON.stringify(data);let res=JSON.parse(result);console.log(res.msg);*/console.log(data);}).catch(e=>{console.log('连接服务器发生错误',e);})//将停留计时器删除sessionStorage.removeItem('timerDisplay');});//这里是加载完成各类要素如：CSS、图片、javascript等//计算加载页面共用时间；也可以用performance API里面的navigation来计算页面加载时间更精确，可以达到毫秒级window.addEventListener('load',function(){let endTime=new Date().valueOf();let loadTime=endTime-startTime;sessionStorage.setItem('loadTime',loadTime);});</script></body>
</html>

后端接收文件

if($_SERVER['REQUEST_METHOD']==='POST')
{$data=file_get_contents('php://input');$result=json_decode($data);echo $result->timerDisplay;
}

相关文章：

利用sessionStorage收集用户访问信息，然后传递给后端

这里只是简单的收集用户的停留时间、页面加载时间、当前页面URL及来源页面&#xff0c;以做示例 <html><head><meta http-equiv"content-type" content"text/html; charsetUTF-8"/><title>测试sessionStorage存储用户访问信息<…...

编程日记 2024/10/14 0:24:27

什么是Qseven？模块电脑（核心板）规范标准简介二

1.概念 Qseven是一种通用的、小尺寸计算机模块标准&#xff0c;适用于需要低功耗、低成本和高性能的应用。 Qseven模块电脑&#xff08;核心板&#xff09;采用230Pin金手指连接器 2.Qseven的起源 Qseven最初是由Congatec、SECO、MSC三家欧洲公司于2008年发起&#xff0c;旨在…...

编程日记 2024/10/14 0:23:26

leetcode数组（三）-有序数组的平方

题目 . - 力扣&#xff08;LeetCode&#xff09; 给你一个按 非递减顺序 排序的整数数组 nums&#xff0c;返回 每个数字的平方 组成的新数组&#xff0c;要求也按 非递减顺序 排序。 例1 输入&#xff1a;nums [-4,-1,0,3,10] 输出&#xff1a;[0,1,9,16,100] 解释&#…...

编程日记 2024/10/14 0:21:24

HCIP-HarmonyOS Application Developer 习题（五）

1、以下哪种原子化布局能力属于自适应变化能力? A. 拉伸 B.占比 C. 隐藏 D.拆行 答案&#xff1a;A 分析&#xff1a;划分为“自适应变化能力”和“自适应布局能力”两类。 其中&#xff0c;自适应变化能力包含了缩放能力和拉伸能力&#xff0c;自适应布局能力包含了隐藏、折…...

编程日记 2024/10/14 0:20:23

【详细教程】如何使用YOLOv11进行图像与视频的目标检测

《博主简介》 小伙伴们好&#xff0c;我是阿旭。专注于人工智能、AIGC、python、计算机视觉相关分享研究。 ✌更多学习资源&#xff0c;可关注公-仲-hao:【阿旭算法与机器学习】&#xff0c;共同学习交流~ &#x1f44d;感谢小伙伴们点赞、关注&#xff01; 《------往期经典推…...

编程日记 2024/10/14 0:16:19

H7-TOOL的LUA小程序教程第14期：任意波形信号发生器，0-20mA输出和微型数控电源(2024-10-11，已更新)

LUA脚本的好处是用户可以根据自己注册的一批API&#xff08;当前TOOL已经提供了几百个函数供大家使用&#xff09;&#xff0c;实现各种小程序&#xff0c;不再限制Flash里面已经下载的程序&#xff0c;就跟手机安装APP差不多&#xff0c;所以在H7-TOOL里面被广泛使用&#xff…...

编程日记 2024/10/14 0:13:17

Redis面试篇3

1、Redis的数据类型&#xff0c;以及每种数据类型的使用场景&#xff1f; 常见的几种数据类型和使用场景如下&#xff1a; 字符串(String)&#xff1a;字符串类型是Redis最基本的数据结构&#xff0c;一个键最大能存储512MB。 使用场景&#xff1a;适用于计数器、分布式锁、缓…...

编程日记 2024/10/14 0:11:15

集成方案 | 借助 Microsoft Copilot for Sales 与 Docusign，加速销售流程！

加速协议信息提取&#xff0c;随时优化邮件内容~ 在当今信息爆炸的时代&#xff0c;销售人员掌握着丰富的数据资源。他们能够通过 CRM 平台、电子邮件、合同库以及其他多种记录系统&#xff0c;随时检索特定个人或组织的关键信息。这些数据对于销售沟通至关重要。然而&#x…...

编程日记 2024/10/14 0:10:14

k8s 1.28.2 集群部署 MinIO 分布式集群

文章目录 [toc]MinIO 介绍MinIO 生产硬件要求MinIO 存储要求MinIO 内存要求MinIO 网络要求MinIO 部署架构分布式 MinIO复制的 MinIO 部署 MinIO创建目录节点打标签创建 namespace创建 pv创建 MinIO配置 ingress问题记录通过代理服务器访问 MinIO 的 Object Browser 界面一直显示…...

编程日记 2024/10/14 0:06:09

HAL库常用的函数：

目录 HAL库&#xff1a; 1.GPIO常用函数&#xff1a; 1.HAL_GPIO_ReadPin( ) 2.HAL_GPIO_WritePin( ) 3.HAL_GPIO_TogglePin( ) 4.HAL_GPIO_EXTI_IRQHandler( ) 5.HAL_GPIO_EXTI_Callback( ) 2.UART常用函数&#xff1a; 1.HAL_U…...

编程日记 2024/10/14 0:05:08

如何捕捉行情爆发的前兆

在金融市场的激烈角逐中&#xff0c;每一次行情的爆发都是投资者获取丰厚回报的关键时刻。然而&#xff0c;如何识别并把握这些时刻&#xff0c;却是一门需要深厚金融专业知识和敏锐洞察力的艺术。今天&#xff0c;我们就来深入探讨行情爆发的初期信号&#xff0c;揭示那些能够…...

编程日记 2024/10/14 0:03:06

【万字长文】Word2Vec计算详解（一）CBOW模型

【万字长文】Word2Vec计算详解&#xff08;一&#xff09;CBOW模型 写在前面 本文用于记录本人学习NLP过程中&#xff0c;学习Word2Vec部分时的详细过程&#xff0c;本文与本人写的其他文章一样&#xff0c;旨在给出Word2Vec模型中的详细计算过程&#xff0c;包括每个模块的计…...

编程日记 2024/10/14 0:02:05

React Native源码学习

核心组件 基础组件&#xff1a;View、Text、Image、TextInput、ScrollView&#xff08;性能没有FlatList好&#xff0c;因为它会一次性把子元素渲染出来&#xff09;、StyleSheet交互组件&#xff1a;button列表视图&#xff1a;FlatList&#xff08;优先渲染屏幕上可见的元素&…...

编程日记 2024/10/13 23:55:59

【计网】从零开始认识https协议 --- 保证安全的网络通信

在每个死胡同的尽头&#xff0c; 都有另一个维度的天空&#xff0c; 在无路可走时迫使你腾空而起&#xff0c; 那就是奇迹。 --- 廖一梅 --- 从零开始认识https协议 1 什么是https协议2 https通信方案2.1 只使用对称加密2.2 只使用非对称加密2.3 双方都使用非对称加密2.4 …...

编程日记 2024/10/13 23:51:55

Ubuntu安装 MySQL【亲测有效】

在Ubuntu上安装MySQL数据库的步骤通常包括更新软件包列表、安装MySQL服务器、启动并配置MySQL服务等。以下是一个详细的安装指南&#xff1a; 一、更新软件包列表 首先&#xff0c;打开终端并输入以下命令来更新Ubuntu的软件包列表&#xff1a; sudo apt update二、安装MySQ…...

编程日记 2024/10/13 23:48:53

Unity 从零开始搭建一套简单易用的UGUI小框架 扩展与优化篇（完结）

一个通用的UGUI小框架就算是写完了&#xff0c;下面是一步步的思考与优化过程 Unity 从零开始搭建一套简单易用的UGUI小框架 基础分析篇-CSDN博客 Unity 从零开始搭建一套简单易用的UGUI小框架 功能撰写与优化篇-CSDN博客 从使用者的角度来整理一下可能会发出的疑问 0. Panel…...

编程日记 2024/10/13 23:46:51

MySQL多表操作--外键约束多表关系

外键约束介绍 Mysql外键约束&#xff08;foreign key&#xff09;是表的一个特殊字段&#xff0c;常与主键约束一起使用。外键约束是一种用于维护两个表之间数据一致性的方法。它确保引用表中的每个值都存在于主表中的某个列中。外键约束通常用于实现数据库的参照完整性。对于两…...

编程日记 2024/10/13 23:42:47

【python入门到精通专题】8.装饰器

装饰器是python语言中的语法糖&#xff0c;可以通过装饰器对函数的功能进行拓展。 为什么需要装饰器 我们假设你的程序实现了say_hello()和say_goodbye()两个函数。 def say_hello():print("hello!")def say_goodbye():print("hello!") # 此处应打印go…...

编程日记 2024/10/13 23:41:46

Halcon Blob分析提取小光斑

文章目录 算子complement 返回一个区域的补集select_region_point 选择包含指定像素的所有区域intensity 计算灰度值的均值和偏差 案例 算子 complement 返回一个区域的补集 complement(Region : RegionComplement : : )Region (输入对象)&#xff1a;这指的是输入的一个或多…...

编程日记 2024/10/13 23:40:45

Lua

1.声明一个变量 只要赋值一个变量&#xff0c;就相当于新建了一个变量&#xff0c;默认全局变量&#xff0c;加一个local前缀之后&#xff0c;这个变量就变成了局部变量 a1//全局变量 local b2//局部变量2.nil类型 在Lua里没有被声明过的变量都是nil&#xff0c;nil是一种类…...

编程日记 2024/10/13 23:39:44

从零搭建ROS2与Web实时数据交互系统

1. 为什么需要ROS2与Web实时交互&#xff1f; 在机器人开发或IoT项目中&#xff0c;我们经常需要通过网页远程监控设备状态或发送控制指令。想象一下这样的场景&#xff1a;你正在调试一个自动巡逻的机器人&#xff0c;但总不能一直盯着终端看日志吧&#xff1f;这时候如果有个…...

编程新知 2026/5/16 22:17:53

LabVIEW数据记录编程：生产者-消费者模式与TDMS文件实战

1. 项目概述&#xff1a;为什么数据记录是自动化测试的“定海神针”干了这么多年自动化测试和工业测控&#xff0c;我越来越觉得&#xff0c;一个系统稳不稳&#xff0c;关键看它的数据记录环节扎不扎实。你可能花了大把时间把传感器信号调理得漂漂亮亮&#xff0c;把控制算法写…...

编程新知 2026/5/16 22:04:45

ORB-SLAM3地图保存新思路：手把手教你将.osa地图转成PCD点云（附完整代码）

ORB-SLAM3地图数据解放指南&#xff1a;从封闭格式到通用点云的全链路实践 当你在昏暗的实验室调试ORB-SLAM3运行整夜后&#xff0c;终于得到那个珍贵的.osa地图文件时&#xff0c;却发现无法用熟悉的点云工具打开分析——这种挫败感或许正是促使你阅读本文的原因。作为三维视觉…...

编程新知 2026/5/16 21:02:33

基于RAG的代码库智能问答工具：askyourgit部署与实战指南

1. 项目概述&#xff1a;当代码库成为你的对话伙伴在软件开发与团队协作的日常中&#xff0c;我们常常面临一个看似简单却异常耗时的问题&#xff1a;“这段代码是谁写的&#xff1f;当时为什么要这么改&#xff1f;”或者“我们项目里有没有处理过类似‘用户登录超时’的逻辑&…...

编程新知 2026/5/16 20:19:33

独家解密：ElevenLabs匈牙利语模型训练数据源（含布达佩斯大学语料库授权细节与音系学标注规范）

更多请点击&#xff1a; https://intelliparadigm.com 第一章&#xff1a;ElevenLabs匈牙利语语音模型的技术定位与战略意义 ElevenLabs 匈牙利语语音模型并非简单的地方语言适配&#xff0c;而是其多语言零样本语音合成&#xff08;Zero-Shot Voice Cloning&#xff09;架构在…...

编程新知 2026/5/16 19:58:20

SpringBoot项目快速集成Taotoken多模型API的完整教程

&#x1f680; 告别海外账号与网络限制&#xff01;稳定直连全球优质大模型&#xff0c;限时半价接入中。 &#x1f449; 点击领取海量免费额度 SpringBoot项目快速集成Taotoken多模型API的完整教程 对于使用SpringBoot框架的Java开发者而言&#xff0c;接入不同的大模型服务通…...

编程新知 2026/5/16 19:29:32

Live Server 5分钟完全指南：如何在VSCode中实现浏览器实时预览？

Live Server 5分钟完全指南&#xff1a;如何在VSCode中实现浏览器实时预览&#xff1f; 【免费下载链接】vscode-live-server Launch a development local Server with live reload feature for static & dynamic pages. 项目地址: https://gitcode.com/gh_mirrors/vs/vs…...

编程新知 2026/5/16 18:25:43

内容做了一大堆，流量就是起不来？初创公司低成本获流的真实解法

内容做了一大堆&#xff0c;流量就是起不来&#xff1f;初创公司低成本获流的真实解法 我见过太多这样的团队&#xff1a;每周雷打不动三篇公众号&#xff0c;两条短视频&#xff0c;外加若干条推特&#xff0c;数据面板安安静静&#xff0c;后台没有咨询&#xff0c;评论区只…...

编程新知 2026/5/16 17:58:49

Austroads：速度管理证据与指导回顾（英） 2026

这份报告是澳大利亚和新西兰道路运输委员会&#xff08;Austroads&#xff09;2025 年发布的《车速管理证据与指南回顾》&#xff0c;核心是为更新《道路安全指南&#xff1a;安全车速》&#xff08;AGRS Part 3&#xff09;梳理研究证据、 stakeholder 反馈并给出修订建议。下…...

编程新知 2026/5/16 17:09:52

告别混乱的微生物组数据：手把手教你用R包MaAsLin2找出关键关联（附IBD研究实战代码）

微生物组数据关联分析实战&#xff1a;用MaAsLin2解锁IBD研究的关键发现 当面对成百上千个微生物物种丰度与数十项临床指标的复杂关系网时&#xff0c;许多研究者常陷入"数据沼泽"——明明手握高通量测序结果&#xff0c;却难以提炼出具有生物学意义的关联模式。这正…...

编程新知 2026/5/16 17:05:01