Giả sử bạn đã tạo một ứng dụng web, ngoài các chức năng còn lại của nó, … Được gắn thẻ bằng javascript, webdev, hướng dẫn, phản ứng.

Bạn đang xem : ngày hết hạn 1 ano javascript

Giả sử bạn đã tạo một ứng dụng web, ngoài các chức năng còn lại của nó, còn trình bày một phần thông tin cho người dùng mà bạn chỉ muốn có một thời hạn sử dụng nhất định trên trang. Đó có thể là bất kỳ điều gì, từ thông tin cá nhân trong ghi chú tạm thời, đến “Trích dẫn trong ngày” sẽ hết hạn vào mỗi buổi tối lúc nửa đêm, đến dữ liệu được lấy từ một API bên ngoài có giới hạn tốc độ.

Có nhiều cách bạn có thể thực hiện với tư cách là nhà phát triển, nhưng một cách đơn giản và thú vị là cung cấp cho phần thông tin đó thời hạn sử dụng, theo đó phần thông tin sẽ tự hủy trở lại hệ thống kỹ thuật số kể từ khi nó xuất hiện.

Thủ thuật này sẽ khám phá một số chức năng tích hợp sẵn khác nhau trong ngôn ngữ JavaScript và sẽ chứng tỏ là một công cụ linh hoạt để sửa đổi hoặc truyền cảm hứng cho các ý tưởng khác trong ứng dụng của bạn sau này.

Đối với hướng dẫn này, tôi sẽ sử dụng ngữ cảnh của một ứng dụng mà tôi đã xây dựng với React , cung cấp cho người dùng bộ hẹn giờ thiền, bộ đếm thời gian lấy nét / pomodoro cũng như trang chủ và trang đích bao gồm ngày và giờ, thời tiết địa phương và một câu trích dẫn đầy cảm hứng trong ngày.

Trong trang chủ này, tôi biết rằng tôi muốn tự động lấy báo giá từ API bên ngoài– nhưng tôi đã gặp sự cố trong đó API bị giới hạn tốc độ để bảo toàn băng thông của chúng. Tôi chỉ có thể thực hiện một số cuộc gọi nhất định mỗi giờ trước khi ứng dụng của tôi tạm thời bị hạn chế và báo giá đã biến mất hoàn toàn khỏi trang (thay thế bằng một lỗi bảng điều khiển khó coi!)

Tôi biết mình có thể thử và ngăn chặn điều này bằng cách chỉ tìm nạp báo giá mỗi ngày một lần ở phía máy chủ, nhưng tôi nghĩ mình sẽ sử dụng cơ hội để thử nghiệm với việc duy trì tìm nạp ở phía máy khách và thử nghiệm với việc cung cấp dữ liệu hết hạn hẹn hò trên cơ sở từng khách, vì tôi biết điều đó có thể có lợi cho tôi trong các ứng dụng sau này.

Trong cuộc thảo luận này, chúng tôi sẽ sử dụng hai chức năng được tiêu chuẩn hóa của phát triển web hiện đại.

Đầu tiên trong số đó là một khía cạnh của Cửa sổ chứa tài liệu DOM của trang web:

  Window.localStorage
 

Và đối tượng thứ hai là đối tượng tích hợp sẵn của ngôn ngữ JavaScript:

  Ngày ()
 

localStorage là thuộc tính cấp cho bạn quyền truy cập vào đối tượng lưu trữ trong tài liệu vẫn tồn tại qua phiên trình duyệt. Nó có thể được truy cập thông qua mã JavaScript của bạn hoặc trực tiếp thông qua bảng điều khiển của trình duyệt.

Xem Thêm  5 cách để kiểm tra xem một mảng có chứa giá trị trong JavaScript hay không - javascript kiểm tra xem giá trị có trong mảng không

Ngày () là một đối tượng đại diện cho một thời điểm duy nhất khi nó được tạo, được đo bằng số mili giây kể từ ngày 1 tháng 1 năm 1970 theo giờ UTC. Đối tượng Date () này có một số hàm được tích hợp sẵn để thao tác với nó, một trong số đó chúng tôi sẽ sử dụng trong ví dụ của mình.

Phiên bản có dấu đầu dòng của những gì tôi sắp trình chiếu như sau:

  1. Khi trang chủ được tải, chúng tôi kiểm tra localStorage của người dùng để xem liệu đã có một báo giá ở đó đã được tìm nạp chưa.
    • Nếu không có báo giá, thì chúng tôi tìm nạp một báo giá mới từ API, lưu báo giá đó vào localStorage và cũng chạy một chức năng để lưu ngày / giờ hết hạn cùng với nó khi chúng tôi muốn báo giá đó. đã thay thế.
  2. Nếu có báo giá, thì chúng tôi so sánh ngày / giờ hiện tại với ngày / giờ hết hạn (trong trường hợp này, ngày hết hạn là nửa đêm cùng ngày mà báo giá đã được lưu vào localStorage).
    • Nếu ngày / giờ hiện tại trước ngày / giờ hết hạn, thì chúng tôi lấy báo giá từ localStorage và hiển thị trên trang.
    • Nếu ngày / giờ hiện tại sau ngày / giờ hết hạn, thì chúng tôi xóa localStorage và quay lại bước 1 và tìm nạp một báo giá mới từ API.

Bây giờ, hãy xem điều này hoạt động trong mã!

Trước hết, tôi đang tạo hai hàm trợ giúp được tóm tắt để giữ cho mã sạch và KHÔ .

Đầu tiên là một hàm có nhãn secondsToMidnight () nhận đối tượng Date () là n và sử dụng các hàm getHours (), getMinutes () và getSeconds () của đối tượng để tìm lượng giây cho đến nửa đêm cùng ngày với đối tượng Ngày () . Điều này có vẻ hơi khó hiểu, nhưng về cơ bản đây là bước có thể được sửa đổi để tìm khoảng thời gian ở bất kỳ đâu trong tương lai mà bạn muốn đặt làm ngày hết hạn cho dữ liệu của mình.

 

const

secondsToMidnight

=

(

n

)

= & gt;

{

trả về

(

((

24

-

n < / p>

.

getHours

()

-

1

)

*

60

*

60

)

+

((

60

-

n

.

getMinutes

() < / p>

-

1

)

*

60

)

+

(

60

-

n

.

getSeconds

())

)

}

Hàm trợ giúp thứ hai có nhãn là gánQuoteToLocalStorage (), thực hiện 4 việc:

  1. Sử dụng cách tìm nạp API (getQuoteOfTheDay ()) để nhận báo giá.
  2. Tạo đối tượng Date () trong biến currentTime và thực hiện 3 việc với nó để tạo ngày / giờ hết hạn:
    • Sử dụng hàm getTime () tích hợp sẵn để tính thời gian hiện tại tính bằng mili giây (phép đo thời gian hiện tại theo khoảng cách từ ngày 1 tháng 1 năm 1970).
    • Chuyển đối tượng ngày currentTime vào giâyToMidnight (), sau đó nhân nó với 1000 để có được mili giây cho đến nửa đêm.
    • Cộng hai số lại với nhau để có ngày / giờ trong tương lai tính bằng mili giây tương đương với chính xác nửa đêm cùng ngày.
  3. Đặt cả báo giá và thời hạn cho localStorage làm cặp khóa / giá trị trong đối tượng.
  4. Đặt câu trích dẫn thành trạng thái trong React sẽ được hiển thị trên trang (setQuoteOfTheDay ()).
  

const

gánQuoteToLocalStorage

=

()

= & gt;

{

getQuoteOfTheDay

()

.

thì

(

trích dẫn

= & gt;

{

const

currentTime

=

new

Ngày

()

const

hết hạn

=

currentTime

.

getTime

()

+

(

secondsToMidnight

(

currentTime

)

*

1000

)

localStorage

.

trích dẫn

=

JSON

.

stringify

(

trích dẫn

)

localStorage

.

hết hạn

=

hết hạn

setQuoteOfTheDay

(

trích dẫn

)

})

}

Bây giờ, chúng tôi sử dụng cả hai phương thức trợ giúp ở trên để thực hiện những việc sau trong quá trình gắn kết thành phần của chúng tôi (diễn ra mỗi khi trang được tải):

  

if

(

!!

localStorage

.

trích dẫn

)

{

let

quoteExpiry

=

parseInt

(

localStorage

.

getItem

(

"

hết hạn

"

))

let

now

=

new

Ngày

()

if

(

now

.

getTime

()

& gt;

quoteExpiry

)

{

localStorage

.

removeItem

(

"

trích dẫn

"

)

localStorage

.

removeItem

(

"

hết hạn

"

)

gánQuoteToLocalStorage

()

}

else

{

let

trích dẫn

=

JSON

.

phân tích cú pháp

(

localStorage

.

getItem

(

"

trích dẫn

"

) )

setQuoteOfTheDay

(

trích dẫn

)

}

}

else

{

gánQuoteToLocalStorage

()

}

Trong câu lệnh if đầu tiên, chúng tôi đang kiểm tra xem có trích dẫn trong localStorage hay không. Nếu có, sau đó chúng tôi kéo ngày hết hạn ra khỏi localStorage, tạo đối tượng Date () hiện tại mới và so sánh hai đối tượng.

Chúng tôi sử dụng câu lệnh if lồng nhau để kiểm tra xem thời điểm hiện tại có sau thời gian hết hạn hay không. Nếu vậy, chúng tôi xóa cả báo giá và thời hạn sử dụng khỏi localStorage và gọi hàm trợ giúp của chúng tôi (gánQuoteToLocalStorage ()) để tìm nạp một báo giá mới và tạo thời hạn sử dụng mới cho nó. Nếu thời gian hiện tại vẫn còn trước khi hết hạn, chúng tôi lấy báo giá từ localStorage và đặt nó về trạng thái của chúng tôi để hiển thị trên trang.

Nếu câu lệnh if đầu tiên của chúng tôi trả về false và không có báo giá nào được tìm thấy trong localStorage, thì chúng tôi sẽ gọi lệnh allowQuoteToLocalStorage () và tìm nạp một câu trích dẫn mới và gán nó cũng như ngày hết hạn cho localStorage.

Và chúng tôi đã hoàn tất! Mặc dù tất cả điều này được thực hiện trong bối cảnh cụ thể của ứng dụng của tôi, nhưng các nguyên tắc tương tự vẫn đúng ở mọi nơi.

Bạn có thể sử dụng một thủ thuật như thế này với các đối tượng JavaScript Date () và các hàm liên quan của chúng để lưu thời gian hết hạn vào localStorage hoặc vào cơ sở dữ liệu của bạn ở bất kỳ định dạng nào bạn muốn, để tạo ra sự tự hủy phần dữ liệu.

Cảm ơn bạn đã đọc! Hãy cho tôi biết trong phần bình luận nếu bạn có bất kỳ câu hỏi hoặc đề xuất nào.


Xem thêm những thông tin liên quan đến chủ đề ngày hết hạn 1 ano javascript

How to track your lead’s referral information to their ActiveCampaign contact record.

  • Tác giả: IntegratePro
  • Ngày đăng: 2017-11-09
  • Đánh giá: 4 ⭐ ( 6750 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: Is it possible to have ActiveCampaign track organic/referral/direct as a source (even though we can’t use UTMs for those)?

    Yes.

    If you use a little javascript + cookies

    ~~~~~
    var domain = location.host;
    var refOrig = document.referrer;
    var refUrla = refOrig.replace(/^https?:\\/\\//, ”);
    var refUrl = refUrla.substr (0, domain.length).toLowerCase();
    if (refUrl.substr (0, domain.length).toLowerCase()!== domain && document.cookie.indexOf(‘cookieRefOrig’) == -1) {
    var date, expire
    date = new Date();
    date.setTime(date.getTime()+(365*24*60*60*1000));
    expire = date.toUTCString();
    document.cookie = ‘cookieRefOrig=’+refOrig+’;expires=’+expire+’;domain=’+document.domain;
    document.cookie = ‘cookieRefUrl=’+refUrl+’;expires=’+expire+’;domain=’+document.domain;
    } else {
    refOrig = ”;
    refUrl = ”;
    }
    function getCookieValue(a) {
    var b = document.cookie.match(‘(^|;)\\\\s*’ + a + ‘\\\\s*=\\\\s*([^;]+)’);
    return b ? b.pop() : ”;
    }
    var urlParams;
    if (window.location.search.indexOf(‘utm_source=’) [greater than] -1) {
    (window.onpopstate = function () {
    var match,
    pl = /\\+/g, // Regex for replacing addition symbol with a space
    search = /([^&=]+)=?([^&]*)/g,
    decode = function (s) { return decodeURIComponent(s.replace(pl, ” “)); },
    query = window.location.search.substring(1);
    nowPreserve = new Date();
    oneYear = 365*24*60*60*1000; // one year in milliseconds
    thenPreserve = nowPreserve.getTime() + oneYear;
    nowPreserve.setTime(thenPreserve);
    expireTime = nowPreserve.toUTCString();
    urlParams = {};
    while (match = search.exec(query))
    {
    urlParams[decode(match[1])] = decode(match[2]);
    document.cookie = decode(match[1])+’=’+decode(match[2])+’;expires=’+expireTime+’;domain=’+document.domain;
    }
    })();
    document.getElementsByName(‘field[19]’)[0].value = urlParams[“utm_source”];
    document.getElementsByName(‘field[20]’)[0].value = urlParams[“utm_medium”];
    document.getElementsByName(‘field[21]’)[0].value = urlParams[“utm_campaign”];
    document.getElementsByName(‘field[22]’)[0].value = urlParams[“utm_term”];
    document.getElementsByName(‘field[23]’)[0].value = urlParams[“utm_content”];
    document.getElementsByName(‘field[24]’)[0].value = getCookieValue(“cookieRefOrig”);
    document.getElementsByName(‘field[25]’)[0].value = getCookieValue(“cookieRefUrl”);
    } else {
    document.getElementsByName(‘field[19]’)[0].value = getCookieValue(“utm_source”);
    document.getElementsByName(‘field[20]’)[0].value = getCookieValue(“utm_medium”);
    document.getElementsByName(‘field[21]’)[0].value = getCookieValue(“utm_campaign”);
    document.getElementsByName(‘field[22]’)[0].value = getCookieValue(“utm_term”);
    document.getElementsByName(‘field[23]’)[0].value = getCookieValue(“utm_content”);
    document.getElementsByName(‘field[24]’)[0].value = getCookieValue(“cookieRefOrig”);
    document.getElementsByName(‘field[25]’)[0].value = getCookieValue(“cookieRefUrl”);
    }

Những thư viện xử lý ngày tháng trong JavaScript

  • Tác giả: ehkoo.com
  • Đánh giá: 4 ⭐ ( 4972 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: JavaScript cung cấp lớp Date để xử lý thời gian khi phát triển ứng dụng. Nhưng để làm việc với múi giờ và các thao tác phức tạp hơn thì bạn không thể bỏ qua các thư viện được giới thiệu trong bài viết này.

Đối tượng date trong javascript

  • Tác giả: toidicode.com
  • Đánh giá: 3 ⭐ ( 4526 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: Bài này, chúng ta sẽ tìm hiểu về đối tượng date trong javascript. Một đối tượng được dùng rất là nhiều trên các trang web.

Tên miền sắp hết hạn: Tên miền hết hạn ngày Sep 15 2020

  • Tác giả: tenmiensaphethan.blogspot.com
  • Đánh giá: 4 ⭐ ( 9283 lượt đánh giá )
  • Khớp với kết quả tìm kiếm:

Hướng dẫn thiết lập cảnh báo ngày đến hạn trong Excel

  • Tác giả: gitiho.com
  • Đánh giá: 4 ⭐ ( 5415 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: Liệu có cách nào để Excel có thể cảnh báo ta về các deadline để ta nâng cao hiệu quả làm việc hay không? Gitiho sẽ giúp bạn thiết lập cảnh báo các ngày hết hạn trong Excel.

Tìm việc làm Javascript việc hết hạn

  • Tác giả: it.viecoi.vn
  • Đánh giá: 5 ⭐ ( 5150 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: Viecoi có 171 tuyển dụng việc làm Javascript việc hết hạn tại TP HCM, Hà Nội, Đà Nẵng và các nơi ở Việt Nam. Ví dụ: việc làm Lập Trình Viên FE Vue.js UI/EX designer web tester, Teamlead Java – REMOTE – 2500$ gross.

Thắc mắc về ngày hết hạn của 1 domain

  • Tác giả: forum.idichvuseo.com
  • Đánh giá: 5 ⭐ ( 7163 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: Khi mình search 1 domain trên web các nhà cung cấp dịch vụ domain (trong hình là của Mắt Bão). Thì có thấy cái ngày hết hạn của 1 domain (Expiration…

Xem thêm các bài viết khác thuộc chuyên mục: Kiến thức lập trình

By ads_php