Home Web Front-end JS Tutorial Json operation date format

Json operation date format

Apr 25, 2018 pm 05:25 PM
javascript json Format

This time I will bring you the Json operation date format. What are the precautions for Json operation date format? . The following is a practical case, let’s take a look.

During development, sometimes it is necessary to return data in json format from the server. If there is DateTime type data in the background code, it will be serialized using the system's own tool class and a long number will be obtained to represent the date data. , as shown below:

 //设置服务器响应的结果为纯文本格式
 context.Response.ContentType = "text/plain";
 //学生对象集合
 List<Student> students = new List<Student>
 {
 new Student(){Name ="Tom",
 Birthday =Convert.ToDateTime("2014-01-31 12:12:12")},
 new Student(){Name ="Rose",
 Birthday =Convert.ToDateTime("2014-01-10 11:12:12")},
 new Student(){Name ="Mark",
 Birthday =Convert.ToDateTime("2014-01-09 10:12:12")}
 };
 //javascript序列化器
 JavaScriptSerializer jss=new JavaScriptSerializer();
 //序列化学生集合对象得到json字符
 string studentsJson=jss.Serialize(students);
 //将字符串响应到客户端
 context.Response.Write(studentsJson);
 context.Response.End();
Copy after login

The running result is:

The corresponding birthday of Tom "2014-01-31" becomes 1391141532000 , this is actually the number of milliseconds from January 1, 1970 to the present; 1391141532000/1000/60/60/24/365=44.11 years, 44 1970=2014 years. According to this method, the year, month, day, hour, minute, second and millisecond can be obtained . This format is a feasible representation but not a friendly format that ordinary people can understand. How to change this format?

Solution:

Method 1: Use the Select method## for the date format on the server side #Or LINQ expression is converted and sent to the client:

using System;
using System.Collections.Generic;
using System.Web;
using System.Web.Script.Serialization;
namespace JsonDate1
{
 using System.Linq;
 /// <summary>
 /// 学生类,测试用
 /// </summary>
 public class Student
 {
 /// <summary>
 /// 姓名
 /// </summary>
 public String Name { get; set; }
 /// <summary>
 /// 生日
 /// </summary>
 public DateTime Birthday { get; set; }
 }
 /// <summary>
 /// 返回学生集合的json字符
 /// </summary>
 public class GetJson : IHttpHandler
 {
 public void ProcessRequest(HttpContext context)
 {
 //设置服务器响应的结果为纯文本格式
 context.Response.ContentType = "text/plain";
 //学生对象集合
 List<Student> students = new List<Student>
 {
 new Student(){Name ="Tom",Birthday =Convert.ToDateTime("2014-01-31 12:12:12")},
 new Student(){Name ="Rose",Birthday =Convert.ToDateTime("2014-01-10 11:12:12")},
 new Student(){Name ="Mark",Birthday =Convert.ToDateTime("2014-01-09 10:12:12")}
 };
 //使用Select方法重新投影对象集合将Birthday属性转换成一个新的属性
 //注意属性变化后要重新命名,并立即执行
 var studentSet =
 students.Select
 (
 p => new { p.Name, Birthday = p.Birthday.ToString("yyyy-mm-dd") }
 ).ToList();
 //javascript序列化器
 JavaScriptSerializer jss = new JavaScriptSerializer();
 //序列化学生集合对象得到json字符
 string studentsJson = jss.Serialize(studentSet);
 //将字符串响应到客户端
 context.Response.Write(studentsJson);
 context.Response.End();
 }
 public bool IsReusable
 {
 get
 {
 return false;
 }
 }
 }
}
Copy after login
Select method reprojects the object collection and converts the Birthday attribute into a new attribute. Note that the attribute must be renamed after the attribute changes. The attribute name can be the same ; Here you can use the select method or LINQ query expression, or you can choose other methods to achieve the same purpose; this method can remove attributes that are not used by the client in the collection to achieve the purpose of simply optimizing performance.

Run result:

The date format at this time has become a friendly format, but in JavaScript this is just a string.

Method 2:

Convert the string in "Birthday":"\/Date(1391141532000)\/" into a date object in javascript , you can delete the non-numeric characters in the Value corresponding to the Birthday Key by replacing them to a number 1391141532000, and then instantiate a Date object, using 1391141532000 milliseconds as a parameter to get a date object in javascript, the code is as follows :

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
 <title>json日期格式处理</title>
 <script src="Scripts/jquery-1.10.2.min.js" type="text/javascript"></script>
 <script type="text/javascript">
 $(function() {
 $.getJSON("getJson.ashx", function (students) {
 $.each(students, function (index, obj) {
 $("<li/>").html(obj.Name).appendTo("#ulStudents");
 //使用正则表达式将生日属性中的非数字(\D)删除
 //并把得到的毫秒数转换成数字类型
 var birthdayMilliseconds = parseInt(obj.Birthday.replace(/\D/igm, ""));
 //实例化一个新的日期格式,使用1970 年 1 月 1 日至今的毫秒数为参数
 var birthday = new Date(birthdayMilliseconds);
 $("<li/>").html(birthday.toLocaleString()).appendTo("#ulStudents"); ;
 });
 });
 });
 </script>
</head>
<body>
 <h2>json日期格式处理</h2>
 <ul id="ulStudents">
 </ul>
</body>
</html>
Copy after login
Running results:

uses the regular /\D/igm to replace all non-digits, \D represents non-digits, igm are parameters, respectively indicating ignoring case; multiple, global replacement; multi-line replacement; sometimes 86 will occur, and the purpose can be achieved by simply changing the regular expression. In addition, if the problem of needing to deal with date format occurs repeatedly in the project, you can extend a javascript method, the code is as follows:

$(function () {
 $.getJSON("getJson.ashx", function (students) {
 $.each(students, function (index, obj) {
 $("<li/>").html(obj.Name).appendTo("#ulStudents");
 //使用正则表达式将生日属性中的非数字(\D)删除
 //并把得到的毫秒数转换成数字类型
 var birthdayMilliseconds = parseInt(obj.Birthday.replace(/\D/igm, ""));
 //实例化一个新的日期格式,使用1970 年 1 月 1 日至今的毫秒数为参数
 var birthday = new Date(birthdayMilliseconds);
 $("<li/>").html(birthday.toLocaleString()).appendTo("#ulStudents");
 $("<li/>").html(obj.Birthday.toDate()).appendTo("#ulStudents");
 });
 });
 });
 //在String对象中扩展一个toDate方法,可以根据要求完善
 String.prototype.toDate = function () {
 var dateMilliseconds;
 if (isNaN(this)) {
 //使用正则表达式将日期属性中的非数字(\D)删除
 dateMilliseconds =this.replace(/\D/igm, "");
 } else {
 dateMilliseconds=this;
 }
 //实例化一个新的日期格式,使用1970 年 1 月 1 日至今的毫秒数为参数
 return new Date(parseInt(dateMilliseconds));
 };
Copy after login
The above extended method toDate may not be reasonable or powerful enough, and can be modified as needed.

Method 3:

You can choose some third-party json tool classes, many of which have already dealt with date format issues, common

json serialization and deserialization tool libraries are:

1.fastJSON.

2.JSON_checker.
3.Jayrock.
4.Json.NET - LINQ to JSON.
5.LitJSON.
6.JSON for .NET.
7.JsonFx.
8.JSONSharp.
9.JsonExSerializer.
10.fluent-json
11.Manatee Json

Here we use litjson as the tool class for serializing and deserializing json. The code is as follows:

using System;
using System.Collections.Generic;
using System.Web;
using LitJson;
namespace JsonDate2
{
 using System.Linq;
 /// <summary>
 /// 学生类,测试用
 /// </summary>
 public class Student
 {
 /// <summary>
 /// 姓名
 /// </summary>
 public String Name { get; set; }
 /// <summary>
 /// 生日
 /// </summary>
 public DateTime Birthday { get; set; }
 }
 /// <summary>
 /// 返回学生集合的json字符
 /// </summary>
 public class GetJson : IHttpHandler
 {
 public void ProcessRequest(HttpContext context)
 {
 //设置服务器响应的结果为纯文本格式
 context.Response.ContentType = "text/plain";
 //学生对象集合
 List<Student> students = new List<Student>
 {
 new Student(){Name ="Tom",Birthday =Convert.ToDateTime("2014-01-31 12:12:12")},
 new Student(){Name ="Rose",Birthday =Convert.ToDateTime("2014-01-10 11:12:12")},
 new Student(){Name ="Mark",Birthday =Convert.ToDateTime("2014-01-09 10:12:12")}
 };
 //序列化学生集合对象得到json字符
 string studentsJson = JsonMapper.ToJson(students);
 //将字符串响应到客户端
 context.Response.Write(studentsJson);
 context.Response.End();
 }
 public bool IsReusable
 {
 get
 {
 return false;
 }
 }
 }
}
Copy after login
The running results are as follows:

The date format at this time is basically correct. Just instantiate the date directly in javascript.

var date = new Date("01/31/2014 12:12:12");
alert(date.toLocaleString());
Copy after login
The client code is as follows:

$(function () {
 $.getJSON("GetJson2.ashx", function (students) {
 $.each(students, function (index, obj) {
 $("<li/>").html(obj.Name).appendTo("#ulStudents");
 var birthday = new Date(obj.Birthday);
 $("<li/>").html(birthday.toLocaleString()).appendTo("#ulStudents");
 });
 });
 });
 var date = new Date("01/31/2014 12:12:12");
 alert(date.toLocaleString());
Copy after login

Method 4:

This text was posted on the blog and netizens put forward their valuable opinions. I did not consider the situation in MVC. In fact, handlers can also be used in MVC, so the difference is not It’s very big, but there is an Action in MVC specifically for server response to JSON. The code is as follows:

using System;
using System.Web.Mvc;
namespace JSONDateMVC.Controllers
{
 public class HomeController : Controller
 {
 public JsonResult GetJson1()
 {
 //序列化当前日期与时间对象,并允许客户端Get请求
 return Json(DateTime.Now, JsonRequestBehavior.AllowGet);
 }
 }
}
Copy after login
Running results:

下载一个内容为Application/json的文件,文件名为GetJson1,内容是"\/Date(1391418272884)\/"

从上面的情况看来MVC中序列化时并未对日期格式特别处理,我们可以反编译看源码:

Return调用的Json方法:

protected internal JsonResult Json(object data, JsonRequestBehavior behavior)
{
 return this.Json(data, null, null, behavior);
}
this.Json方法
protected internal virtual JsonResult Json(object data, string contentType, Encoding contentEncoding, JsonRequestBehavior behavior)
{
 return new JsonResult { Data = data, ContentType = contentType, ContentEncoding = contentEncoding, JsonRequestBehavior = behavior };
}
Copy after login

JsonResult类ActionResult类的子类,ExecuteResult方法:

从上面的代码中不难看出微软的JsonResult类仍然是使用了JavaScriptSerializer,所以返回的结果与方法一未处理时是一样的,要解决这个问题我们可以派生出一个新的类,重写ExecuteResult方法,使用Json.net来完成序列化工作,JsonResultPro.cs文件的代码如下:

namespace JSONDateMVC.Common
{
 using System;
 using System.Web;
 using System.Web.Mvc;
 using Newtonsoft.Json;
 using Newtonsoft.Json.Converters;
 public class JsonResultPro : JsonResult
 {
 public JsonResultPro(){}
 public JsonResultPro(object data, JsonRequestBehavior behavior)
 {
 base.Data = data;
 base.JsonRequestBehavior = behavior;
 this.DateTimeFormat = "yyyy-MM-dd hh:mm:ss";
 }
 public JsonResultPro(object data, String dateTimeFormat)
 {
 base.Data = data;
 base.JsonRequestBehavior = JsonRequestBehavior.AllowGet;
 this.DateTimeFormat = dateTimeFormat;
 }
 /// <summary>
 /// 日期格式
 /// </summary>
 public string DateTimeFormat{ get; set; }
 public override void ExecuteResult(ControllerContext context)
 {
 if (context == null)
 {
 throw new ArgumentNullException("context");
 }
 if ((this.JsonRequestBehavior == JsonRequestBehavior.DenyGet) && string.Equals(context.HttpContext.Request.HttpMethod, "GET", StringComparison.OrdinalIgnoreCase))
 { 
 throw new InvalidOperationException("MvcResources.JsonRequest_GetNotAllowed");
 }
 HttpResponseBase base2 = context.HttpContext.Response;
 if (!string.IsNullOrEmpty(this.ContentType))
 {
 base2.ContentType = this.ContentType;
 }
 else
 {
 base2.ContentType = "application/json";
 }
 if (this.ContentEncoding != null)
 {
 base2.ContentEncoding = this.ContentEncoding;
 }
 if (this.Data != null)
 {
 //转换System.DateTime的日期格式到 ISO 8601日期格式
 //ISO 8601 (如2008-04-12T12:53Z)
 IsoDateTimeConverter isoDateTimeConverter=new IsoDateTimeConverter();
 //设置日期格式
 isoDateTimeConverter.DateTimeFormat = DateTimeFormat;
 //序列化
 String jsonResult = JsonConvert.SerializeObject(this.Data,isoDateTimeConverter);
 //相应结果
 base2.Write(jsonResult);
 }
 }
 }
}
Copy after login

使用上面的JsonResultPro Action类型的代码如下:

 public JsonResultPro GetJson2()
 {
 //序列化当前日期与时间对象,并允许客户端Get请求,注意H是大写
 return new JsonResultPro(DateTime.Now,"yyyy-MM-dd HH:mm");
 }
Copy after login

相信看了本文案例你已经掌握了方法,更多精彩请关注php中文网其它相关文章!

推荐阅读:

jsonp+json实现AJAX跨域请求

Jsonp怎样才能解决ajax跨域

The above is the detailed content of Json operation date format. For more information, please follow other related articles on the PHP Chinese website!

Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

Hot AI Tools

Undresser.AI Undress

Undresser.AI Undress

AI-powered app for creating realistic nude photos

AI Clothes Remover

AI Clothes Remover

Online AI tool for removing clothes from photos.

Undress AI Tool

Undress AI Tool

Undress images for free

Clothoff.io

Clothoff.io

AI clothes remover

Video Face Swap

Video Face Swap

Swap faces in any video effortlessly with our completely free AI face swap tool!

Hot Tools

Notepad++7.3.1

Notepad++7.3.1

Easy-to-use and free code editor

SublimeText3 Chinese version

SublimeText3 Chinese version

Chinese version, very easy to use

Zend Studio 13.0.1

Zend Studio 13.0.1

Powerful PHP integrated development environment

Dreamweaver CS6

Dreamweaver CS6

Visual web development tools

SublimeText3 Mac version

SublimeText3 Mac version

God-level code editing software (SublimeText3)

How to write the qq mailbox format? What is the qq mailbox format? How to write the qq mailbox format? What is the qq mailbox format? Feb 22, 2024 pm 03:40 PM

QQ email: QQ number@qq.com, English QQ email: English or numbers@qq.com, foxmail email account: set up your own account@foxmail.com, mobile phone email account: mobile phone number@qq.com. Tutorial Applicable Model: iPhone13 System: IOS15.3 Version: QQ Mailbox 6.3.3 Analysis 1QQ mailbox has four formats, commonly used QQ mailbox: QQ number@qq.com, English QQ mailbox: English or numbers@qq.com, foxmail Email account: set up your own account@foxmail.com, mobile phone email account: mobile phone number@qq.com. Supplement: What is qq mailbox? 1 The earliest QQ mailbox was only between QQ users

What is the difference between MySQL5.7 and MySQL8.0? What is the difference between MySQL5.7 and MySQL8.0? Feb 19, 2024 am 11:21 AM

MySQL5.7 and MySQL8.0 are two different MySQL database versions. There are some main differences between them: Performance improvements: MySQL8.0 has some performance improvements compared to MySQL5.7. These include better query optimizers, more efficient query execution plan generation, better indexing algorithms and parallel queries, etc. These improvements can improve query performance and overall system performance. JSON support: MySQL 8.0 introduces native support for JSON data type, including storage, query and indexing of JSON data. This makes processing and manipulating JSON data in MySQL more convenient and efficient. Transaction features: MySQL8.0 introduces some new transaction features, such as atomic

Performance optimization tips for converting PHP arrays to JSON Performance optimization tips for converting PHP arrays to JSON May 04, 2024 pm 06:15 PM

Performance optimization methods for converting PHP arrays to JSON include: using JSON extensions and the json_encode() function; adding the JSON_UNESCAPED_UNICODE option to avoid character escaping; using buffers to improve loop encoding performance; caching JSON encoding results; and considering using a third-party JSON encoding library.

How do annotations in the Jackson library control JSON serialization and deserialization? How do annotations in the Jackson library control JSON serialization and deserialization? May 06, 2024 pm 10:09 PM

Annotations in the Jackson library control JSON serialization and deserialization: Serialization: @JsonIgnore: Ignore the property @JsonProperty: Specify the name @JsonGetter: Use the get method @JsonSetter: Use the set method Deserialization: @JsonIgnoreProperties: Ignore the property @ JsonProperty: Specify name @JsonCreator: Use constructor @JsonDeserialize: Custom logic

Pandas usage tutorial: Quick start for reading JSON files Pandas usage tutorial: Quick start for reading JSON files Jan 13, 2024 am 10:15 AM

Quick Start: Pandas method of reading JSON files, specific code examples are required Introduction: In the field of data analysis and data science, Pandas is one of the important Python libraries. It provides rich functions and flexible data structures, and can easily process and analyze various data. In practical applications, we often encounter situations where we need to read JSON files. This article will introduce how to use Pandas to read JSON files, and attach specific code examples. 1. Installation of Pandas

In-depth understanding of PHP: Implementation method of converting JSON Unicode to Chinese In-depth understanding of PHP: Implementation method of converting JSON Unicode to Chinese Mar 05, 2024 pm 02:48 PM

In-depth understanding of PHP: Implementation method of converting JSONUnicode to Chinese During development, we often encounter situations where we need to process JSON data, and Unicode encoding in JSON will cause us some problems in some scenarios, especially when Unicode needs to be converted When encoding is converted to Chinese characters. In PHP, there are some methods that can help us achieve this conversion process. A common method will be introduced below and specific code examples will be provided. First, let us first understand the Un in JSON

Quick tips for converting PHP arrays to JSON Quick tips for converting PHP arrays to JSON May 03, 2024 pm 06:33 PM

PHP arrays can be converted to JSON strings through the json_encode() function (for example: $json=json_encode($array);), and conversely, the json_decode() function can be used to convert from JSON to arrays ($array=json_decode($json);) . Other tips include avoiding deep conversions, specifying custom options, and using third-party libraries.

uefiu disk song format uefiu disk song format Feb 12, 2024 pm 10:18 PM

With the continuous updating of win10 system, its original installation image is getting larger and larger, which brings troubles to students who like to use U disk for UEFI boot method installation. As we all know, using EFI method to install the system directly installs the original Microsoft image. After decompressing, copy to the root directory of the U disk in fat32 or fat16 format, and then directly set the motherboard U disk to start the installation. However, many friends have reported that it backfired recently. There is a restriction on using the U disk in fat format, that is, a single file. The maximum cannot exceed 4G, otherwise it will be impossible to write. However, as the win10 image increases, the install.wim file in the installation package becomes larger and larger, exceeding 4G, which makes it impossible to directly use

See all articles