如何正确显示列表。File_ReferenceMetafield Image在Shopify主题中？

Question

{% assign feature_images = product.metafields.accentuate.product_features_image %}
Looping through the values:

{% if feature_images and feature_images.size > 0 %}
    {% for feature_image in feature_images %}
        <img src="{{ feature_image | image_url }}" alt="Feature Image">
    {% endfor %}
{% endif %}
Debugging the metafield output: When I print feature_images using:

<pre>{{ feature_images | json }}</pre>

我得到：

["gid://shopify/MediaImage/32558718288180", "gid://shopify/MediaImage/32558717075764"] timiss确认Metafield正确存储了图像参考。

用product.media：

匹配图像

{% for feature_image in feature_images %}
    {% assign media_id = feature_image | split: '/' | last | plus: 0 %}

    {% for media in product.media %}
        {% if media.id == media_id %}
            <img src="{{ media.preview_image.src }}" alt="Feature Image">
        {% endif %}
    {% endfor %}
{% endfor %}

但图像仍未显示 - 标签保持空。

预期的行为

部分应循环遍历元场，并正确显示所有图像。 Shopify的媒体库图像应使用Preview_image.src.

渲染

什么是不起作用的

从gid：// shopify/mediaImage/...提取的媒体.ID不匹配product.media。
使用image_url或file_url不适用于gid：//shopify/mediaimage/...

问题

如何正确检索并从列表中显示图像。file_Referencemetafield？

我从gid中正确提取ID：// shopify/mediaImage/...并与product.media？ 我应该使用其他方法显示这些图像吗？

additionalInformation

METAFIELD类型：list.file_reference 示例元场值：

["gid://shopify/MediaImage/32558718288180", "gid://shopify/MediaImage/32558717075764"]

示例product.media调试输出：

[
    {
        "id": 32558718288180,
        "preview_image": {
            "src": "https://cdn.shopify.com/.../image1.jpg"
        }
    },
    {
        "id": 32558717075764,
        "preview_image": {
            "src": "https://cdn.shopify.com/.../image2.jpg"
        }
    }
]

任何帮助将不胜感激！

使用file_url是正确的，我能够使用此代码来完成此工作-

{% assign feature_images = product.metafields.accentuate.product_features_image.value %}

<!-- Debug: Check raw feature images -->
<pre style="display:none">Feature Images (Raw): {{ feature_images | json }}</pre>

<!-- Store and clean image URLs -->
{% assign image_urls = "" %}

{% for image in feature_images %}
    {% assign image_url = image | file_url %}
    
    <!-- Ensure HTTPS and correct path without duplicate /products/ -->
    {% if image_url contains "/files/" %}
        {% assign formatted_image_url = image_url | replace: "//", "https://" | replace: "/files/", "/" %}
    {% else %}
        {% assign formatted_image_url = image_url | replace: "//", "https://" %}
    {% endif %}

    {% assign image_urls = image_urls | append: formatted_image_url | append: "," %}
{% endfor %}

{% assign image_urls = image_urls | split: "," %}

{% assign feature_image = image_urls[i] %}

                            <!-- Debug: Check extracted image -->
                            <pre style="display:none">Feature Image {{ i }}: {{ feature_image }}</pre>

                            <div class="product-features-image">
                                {% if feature_image != blank %}
                                    <img src="{{ feature_image }}" alt="{{ feature_titles[i] | escape }}" width="100%" height="auto">
                                {% else %}
                                    <img src="https://cdn.shopify.com/s/files/1/0244/2824/9134/files/image-not-available.jpg?v=1724262286" alt="Placeholder image" width="100%" height="auto">
                                {% endif %}
                            </div>