前端页面js获取nginx服务器时间
在实际开发中,我们通常要使用的是服务器端的时间,而不是本机电脑的时间,在js文件中直接通过new Date()获取的时间是本机电脑的系统时间,获取服务器时间的方法如下:
1.修改nginx的配置文件nginx.conf,在对应服务器端口的server路径下直接添加如下代码:

 location = /time.txt {
return 200 $time_local;
}

注意:

具体效果可参考最下方运行结果:

nginx配置$time_local 生成格式为:25/Oct/2022:10:56:15 +0800
不可用new Date("25/Oct/2022:10:56:15 +0800")
nginx配置$time_iso8601 生成格式为:2022-10-25T15:42:45+08:00
可用new Date("2022-10-25T15:42:45+08:00")转化为国际标准时间,然后才能格式化

添加后如下:(下图中我是在本地测试,server_name为127.0.0.1,本地测试可到nginx官网下载nginx,这里我下载的版本是nginx-1.23.2,完成后双击运行,修改配置文件后重启)
重启nginx命令(要到安装nginx的目录下,地址栏输入cmd回车):
nginx -s reload(cmd命令)
./nginx -s reload(linux命令)
停止命令: nginx -s stop(cmd命令)
端口号listen应该和本地运行文件的端口号保持一致,在服务器端不用管。

2.在网页中直接访问http://127.0.0.1:8818/time.txt,访问成功后出现如下返回:

3.在前端js页面中访问time.txt文件,代码如下:(可直接在服务器测试,本地配置错误可能会报错,而且时间是跟随本机系统时间,测试不出变化)

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="../jQuery.js"></script>
<title>JS获取Nginx服务器时间</title>
</head>
<div>
<div class="servertime"></div>
<div class="time"></div>
<!-- <button onclick="printTime()">JS获取Nginx服务器时间</button> -->
<button onclick="getFwqDate()">JS获取Nginx服务器时间</button>
</div>
<body>
<script type="text/javascript">
function getFwqDate() {
let xhr = new XMLHttpRequest();
if (!xhr) {
xhr = new ActiveXObject("Microsoft.XMLHTTP");
}
// xhr.open("HEAD", location.href, false);
xhr.open("POST", '/time.txt', false);
xhr.overrideMimeType("text/html;charset=utf-8")
xhr.send();
console.log("xhr.responseText=", xhr.responseText);
/**
* 20221014lmy添加
* nginx配置$time_iso8601 生成格式为:2022-10-25T15:42:45+08:00
* nginx配置$time_local 生成格式为:25/Oct/2022:10:56:15 +0800
*/
//getTime(),将标准时间转化为毫秒数时间
millionstime = (new Date(xhr.responseText)).getTime();
// millionstime = new Date(xhr.responseText);
console.log("millionstime=", millionstime);
//将获取到的时间转化成自己想要的格式,此处是20221014155450
var servertime = new Date(millionstime);
var year = servertime.getFullYear();
var month = servertime.getMonth() + 1;
var day = servertime.getDate();
var hours = servertime.getHours();
var minutes = servertime.getMinutes();
var seconds = servertime.getSeconds();
if (month < 10) {
month = '0' + month;
}
if (day < 10) {
day = '0' + day;
}
if (hours < 10) {
hours = '0' + hours;
}
if (minutes < 10) {
minutes = '0' + minutes;
}
if (seconds < 10) {
seconds = '0' + seconds;
}
servicedate = year.toString() + month.toString() + day.toString() + hours.toString() + minutes.toString() + seconds.toString();
console.log("servicedate=",servicedate)
return servicedate;
}
</script>
</body>
</html>

报错:运行可能会遇到如下错误:

打开控制台,找不到相应页面:

解决办法:可在文件运行时先nginx -s stop停止nginx服务,待需要访问time.txt文件时,再双击启动(这种情况只会在本地运行时发生,在部署的服务器端不会报错)

运行结果:

1.$time_local

nginx配置$time_local 生成格式为:25/Oct/2022:10:56:15 +0800
不可用new Date("25/Oct/2022:10:56:15 +0800")

2.$time_iso8601

nginx配置$time_iso8601 生成格式为:2022-10-25T15:42:45+08:00
可用new Date("2022-10-25T15:42:45+08:00")转化为国际标准时间

js获取nginx服务器时间的更多相关文章

  1. js 获取当前的时间

    第一个小程序,用js获取当前的时间,,比较特殊的是 月是从0开始算的,显示的时候要加1,获取日用getDate(),获取周 getDay(), 直接上代码 <!DOCTYPE html> ...

  2. moment.js 默认使用服务器时间

    在前端使用Date对象获取当前时间的时候,该时间是客户端的时间.但是该时间可以被用户修改,所以我们一般情况下并不想要这个时间.如果每一次获取时间的时候都请求一下服务器,那么将会对服务器造成不必要的压力 ...

  3. js获取当前系统时间

    Js获取当前日期时间及其它操作var myDate = new Date();myDate.getYear(); //获取当前年份(2位)myDate.getFullYear(); //获取完整的年份 ...

  4. js 获取当前系统时间

    Js获取当前日期时间及其它操作 var myDate = new Date();myDate.getYear(); //获取当前年份(2位)myDate.getFullYear(); //获取完整的年 ...

  5. js 获取系统当前时间

    JS获取当前的日期和时间的方法:var myDate = new Date();myDate.getYear(); //获取当前年份(2位)myDate.getFullYear(); //获取完整的年 ...

  6. 浏览器获取WEB服务器时间

    /* * 获取XMLHttpRequest对象 */ function CreateXMLHttpRequest() { var xmlreq = false; if (window.ActiveXO ...

  7. JS获取当前日期和时间的方法,并按照YYYY-MM-DD格式化

    Js获取当前日期时间及其它操作 var myDate = new Date(); myDate.getYear();        //获取当前年份(2位) myDate.getFullYear(); ...

  8. JS获取日期和时间

    //获取日期和时间 function showDate(){ var myDate = new Date(); myDate.getYear(); //获取当前年份(2位) myDate.getFul ...

  9. Cocos Creator JS 获取当前日期与时间

    var testDate = new Date(); testDate.getYear();//获取当前年份(2位) testDate.getFullYear(); //获取完整的年份(4位,1970 ...

  10. js获取当前日期和时间的代码

    最佳答案 var myDate = new Date(); myDate.toLocaleDateString(): //获取当前日期myDate.toLocaleTimeString(); //获取 ...

随机推荐

  1. zabbix基本概念

    Zabbix是一个企业级的.开源的.分布式监控解决方案. Zabbix可以监控网络和服务的监控状况. Zabbix利用灵活的告警机制,允许用户对事件发送基于Email的告警. 这样可以保证快速的对问题 ...

  2. C++11新特性(一):语言特性

    C++11新特性 总结C++11特性时发现整个内容角度,建议查看前先查看目录. 语言特性 右值引用 右值的分类为将亡值和字面量.将亡值就是将要销毁的对象以及临时的变量,字面量就是常量.左值就是变量. ...

  3. 修改 Ubuntu 文件夹为英文

    如果你在安装 Ubuntu 时,语言选了中文,那么系统自动创建的文件夹也会是中文(下载.图片 等).有时这会造成不便.可以通过以下命令将文件夹改为英文: LANG=C LC_ALL=C xdg-use ...

  4. 1p-frac:已开源,仅用单张分形图片即可媲美ImageNet的预训练效果 | ECCV 2024

    分形几何是一个数学分支,主要应用于作图方面.一般来说,分形经过无数次递归迭代后的结果.比如取一条线段,抹去中间的三分之一,会得到长度是原三分之一长的两条线段,中间隔着相同长度的间隙.然后重复这个动作, ...

  5. if else 代码优化实战

    前言 介绍几种方法,不使用if else语句也能做条件判断. 一:使用枚举 首先定义一个公用接口 RoleOperation,表示不同角色所能做的操作 package com.gavin.enums; ...

  6. error: rpmdb: BDB0113... rpm安装或尝查询时报错

    等保要求安装杀毒软件,我跑脚本的时候发现异常退出了,一查芜湖,rpm管理包出问题了 root@VM_0_12_centos equal-protection]# rpm -g clamav error ...

  7. C# – delegate, event, EventHandler

    前言 写这么多年 C#, 我从来没有写过 EventHandler. 我想应该是因为我没有用 C# 开发过前端的关系, 绝对不是我技术不行哦. 这篇就补上一个学习笔记呗. 参考 C#知识点讲解之C#d ...

  8. 面试官的几句话,差点让我挂在HTTPS上

    作为软件测试,大家都知道一些常用的网络协议是我们必须要了解和掌握的,比如 HTTP 协议,HTTPS 协议就是两个使用非常广泛的协议,所以也是面试官问的面试的时候问的比较多的两个协议:而且因为这两个协 ...

  9. .NET 跨平台工业物联网网关解决方案

    前言 随着工业4.0时代的到来,物联网技术正在以前所未有的速度改变着我们的生产和生活方式.本文给大家介绍一个基于 .NET 6 开发的跨平台工业物联网网关解决方案. 工业物联网(IIoT)成为了连接物 ...

  10. LeetCode 564. Find the Closest Palindrome (构造)

    题意: 给一个数字n 求离n最近(且不等)的回文串 存在多个答案返回最小的 首先很容易想到 将数字分为两段,如 12345 -> 123/45,然后将后半段根据前面的进行镜像重置 123/45 ...