技術的なQ＆A

Naru_05 · ‎05-23-2023

liquid内で現在時刻を取得し、メタフィールドから入力された値と比較させ表示、非表示の制御を実装中です。
現在日時はJsで下記のように取得してcapture変数に代入しています。

{% capture current_datetime %}
<script>
var currentDate = new Date();
var year = currentDate.getFullYear().toString();
var month = ('0' + (currentDate.getMonth() + 1)).slice(-2);
var day = ('0' + currentDate.getDate()).slice(-2);
var hour = ('0' + currentDate.getHours()).slice(-2);
var minute = ('0' + currentDate.getMinutes()).slice(-2);
var currentDateTimeString = year + '-' + month + '-' + day + ' ' + hour + ':' + minute;
document.write(currentDateTimeString);
</script>
{% endcapture %}

メタフィールドの値は下記のように取得してります。

%- assign start_datetime = block.settings.start_date_time | date: "%Y-%m-%d %H:%M" -%}

変数current_datetimeと変数start_datetimeを{%- for block in section.blocks -%}内で比較しているのですが比較されず困っています。
変数の中身をデバックで確認したところ2023-05-20 18:55のように取得出来ています。
型の違いなどがあるのでしょうか。
お手数ですがご教示いただけましたらと思います。

株式会社フルバランス · ‎05-23-2023

Naru_05　様

お世話になっております。

現在時刻とメタフィールド値の比較は、過去やったことがあるので、サンプルコードを計算します。

時刻の比較は、秒数に変換してからされるのが良いかと思います

■liquid

{%- assign now = "now" | date: "%Y-%m-%d" | date: "%s" -%}
{%- assign release = product.metafields.custom.release | date: "%Y-%m-%d" | date: "%s" -%}
{%- assign diff = now | minus: release -%}
{%  comment %}604,800s(7日間){%  endcomment %}
{%- if release and diff < 604800 -%}
　　<div>現在時刻とメタフィールド日時との差が7日未満のときはこのdivが表示されます。</div>
{%- endif -%}

■JS

  if(`{{ product.metafields.custom.release | strip }}`) {
    const release = new Date(new Date(`{{ product.metafields.custom.release | strip }}`).toLocaleString('ja-JP').slice(0, -3)).getTime();
    const now = new Date(new Date().toLocaleString('ja-JP').slice(0,-3)).getTime();

    const diff = (release - now) / 86400000; // 日差 (1日 = 86,400,000ms)
    
    // 0 < diff <= 7 のとき、
    if(diff > 0 && diff <= 7) {
　　　　　　　　　　　// 実行したい処理
    }
  }

なにかヒントになれば幸いです。

私たちの励みにもなりますので、

お役に立てていればBest Answerボタンを押して頂ければ嬉しいです。

株式会社フルバランス（Shopify Experts）
Shopify専門のEC成長支援会社です。ECの技術・実務・成長、お悩みのことがあれば、気軽にご相談ください。
『すべてのブランドの特大成長エンジンを搭載する』株式会社フルバランス

元の投稿で解決策を見る

株式会社フルバランス · ‎05-23-2023