รับ URL รูปภาพจาก field_image บนโหนด

ดังนั้นฉันมีโหนดนี้:

object(Drupal\node\Entity\Node)[1862]
  protected 'values' => 
    array (size=17)
      'vid' => 
        array (size=1)
          'x-default' => string '7' (length=1)
      'langcode' => 
        array (size=1)
          'x-default' => 
            array (size=1)
              0 => 
                array (size=1)
                  'value' => string 'en' (length=2)
      ... (more fields)
      'field_image' => 
        array (size=1)
          'x-default' => 
            array (size=1)
              0 => 
                array (size=5)
                  'target_id' => string '1' (length=1)
                  'alt' => string '' (length=0)
                  'title' => string '' (length=0)
                  'width' => string '150' (length=3)
                  'height' => string '120' (length=3)

ตอนนี้ field_image มีอาร์เรย์พร้อม x-default และข้อมูลรูปภาพพื้นฐานบางอย่าง ฉันจะแสดงรูปภาพหรือสร้างลิงค์ไปยังรูปภาพภายในเทมเพลต Twig ได้อย่างไร

นี่คือเวอร์ชันอัปเดตสำหรับคำตอบนี้หลังจาก 8.0.x ฐานความคิดเห็น@joelpittetนี้

{{ file_url(node.field_image.entity.fileuri) }}

ฉันไม่รู้เกี่ยวกับ Twig แต่คุณได้รับไฟล์ URI ด้วย$node->field_image->entity->getFileUri()ใน PHP และคุณต้องโทรหาfile_create_url():

file_create_url($node->field_image->entity->getFileUri())

ฉันไม่รู้ว่ามันเป็นไปได้ในกิ่งไม้ หากไม่สามารถทำได้คุณสามารถคำนวณได้ใน preprocess และเพิ่มเป็นตัวแปรใหม่

หากมีคนต้องการภาพสไตล์:

$styled_image_url = ImageStyle::load('large')->buildUrl($node->field_image->entity->getFileUri());

ไม่มีวิธีแก้ปัญหาทวิกข้างต้นสำหรับฉัน (อาจใช้กับรุ่นเก่ากว่า 8.x แต่ไม่ใช่สำหรับรุ่น 8.5)

{{ file_url(node.field_image['#items'].entity.uri.value) }}

หมายเหตุ: ควรใช้กับ Drupal 8.5+

ดังนั้นผมจึงได้พบคำตอบด้วยความช่วยเหลือของไคลฟ์

ทำให้ URI รูปภาพใน Twig เสร็จสิ้นโดยใช้ node.field_image.0.entity.uri.value

การรับ URL แบบเต็มสำหรับภาพสามารถทำได้โดยใช้ file_create_url(node.field_image.0.entity.uri.value)

การทำเช่นนี้ในทวิกยังไม่สามารถทำได้ แต่พวกเขากำลังทำงานอยู่ -> ดูที่นี่

สิ่งที่ได้ผลสำหรับฉันใน D8 คือ:

$imageUrl = $node->get('field_image')->entity->uri->value;

การใช้kint($node->get('field_image')->entity)และการดูอาร์เรย์มีประโยชน์มาก

จากนั้นในไฟล์ทวิกของฉันฉันใช้:

<img class="top-article-image" src="{{ file_url(imageUrl) }}" />

คุณสามารถรับ url ได้โดยตรงโดยใช้ field_image.entity.url

ฉันมักจะใช้ฟังก์ชั่นตัวช่วย

  /**
   * Get the Image URI.
   *
   * @param \Drupal\Core\Entity\Entity $entity
   * @param $fieldName
   * @param bool $imageStyle
   * @return mixed
   */
  public function getImageUri(\Drupal\Core\Entity\Entity $entity, $fieldName, $imageStyle = FALSE) {
    $imageField = $entity->get($fieldName)->getValue();
    if (!empty($imageField[0]['target_id'])) {
      $file = File::load($imageField[0]['target_id']);
      if ($imageStyle) {
        return ImageStyle::load($imageStyle)->buildUrl($file->getFileUri());
      }

      // Original URI.
      return file_create_url($file->getFileUri());
    }
  }

นี่คือวิธีถ้าคุณต้องการได้รับ URL ภาพที่มีสไตล์ภาพที่เกี่ยวข้องสำหรับฟิลด์ภาพใด ๆ ในแม่แบบกิ่งไม้:

ขั้นแรกให้ติดตั้งโมดูล Twig Tweak

จากนั้นตั้งค่า URI รูปภาพเป็นตัวแปร ด้วย URI คุณสามารถใช้รูปแบบ twig tweaks เพื่อให้ได้เส้นทางด้วยสไตล์ภาพที่คุณต้องการ ดูด้านล่าง:

{% set image_uri = content.field_feature_row_image['#items'].entity.uri.value %}

<img src="{{ image_uri|image_style('image1200x1103') }}"/>

Twig Tweak v2.4 + เสนอfile_urlตัวกรองเพื่อแยก URL ไฟล์จากเอนทิตี

<img src="{{ node.field_image|file_url|image_style('image1200x1103') }}"/>

ฉันมีปัญหาเดียวกันดังนั้นฉันจึงสร้างget_image_path()ฟังก์ชั่น Twig และเพิ่มด้วยสิ่งที่มีประโยชน์อื่น ๆ ให้กับโมดูลเริ่มต้นของฉัน:

https://github.com/brynj-digital/starter

ฟังก์ชั่นยอมรับฟิลด์ภาพและชื่อเครื่องของรูปแบบภาพจากนั้นส่งคืนเส้นทางภาพนั้น

มันทำงานได้ในหลายบริบท - คุณสามารถส่งผ่านnode.field_name, content.field_nameหรือrow._entity.field_name(ในกรณีของแม่แบบดูฟิลด์)

เอ้ยจริงแล้วมันใช้เวลานานมากในการค้นหาสาเหตุที่ URL ที่เป็นผลลัพธ์ของฉันไม่ทำงาน ทั้งหมด 404'ed คุณจำเป็นต้องสร้าง derivate เป็นครั้งแรกถ้ามันไม่ได้อยู่แล้ว

ตัวอย่างเช่นเมื่อคุณเพิ่มสไตล์ของภาพในภายหลังหลังจากอัพโหลดภาพต้นฉบับแล้วยังไม่มีไฟล์รูปภาพที่มีสไตล์ (ภาพต้นฉบับ) จำเป็นต้องสร้างขึ้นก่อน

แทนที่field_MYIMAGEและMYSTYLEตามที่คุณต้องการ

$original_image = $node->field_MYIMAGE->entity->getFileUri();
$style = \Drupal::entityTypeManager()->getStorage('image_style')->load('MYSTYLE');

$destination = $style->buildUri($original_image);
if (!file_exists($destination)) {
  $style->createDerivative($original_image, $destination);
}

$url = $style->buildUrl($original_image);

ฉันหวังว่าสิ่งนี้จะเกิดขึ้นโดยอัตโนมัติ

ค่อนข้างเกี่ยวข้องนี่คือสิ่งที่ฉันใช้ (ขอบคุณคำตอบก่อนหน้าทั้งหมดเพื่อให้ฉันไปที่นั่น) เพื่อรับ URL ไฟล์ภาพจากช่องภาพของเอนทิตีสื่อในทวิ:

{% set media_img_url = file_url(content.field_media_image.0['#item'].entity.uri.value) %}

ตอนนี้ฉันสามารถใช้ตัวแปรนี้ในแม่แบบกิ่งไม้ของฉัน

{{ media_img_url }}

ในการรับแอตทริบิวต์ของภาพเช่น URI, alt, title ฯลฯ ให้ใช้ไวยากรณ์เช่นเทมเพลตด้านล่างอย่างชาญฉลาด

ในเทมเพลตทวิกโหนด

{{node.field_name.entity.fileuri}}

ในเทมเพลตกิ่งสาขา

{{content.field_name.entity.fileuri}}

ในสาขาแม่แบบสาขาอื่น ๆ

{{element['#object'].field_name.entity.fileuri}}

หมายเหตุ:นอกจากนี้ให้ตรวจสอบtwig_tweaksโมดูลแผ่นชีทสำหรับรายละเอียดที่เกี่ยวข้องกับปัญหาที่เกี่ยวข้องกับทวิ

คุณสามารถใช้url()วิธีการที่อยู่ในระดับไฟล์เป็นทางลัดดังนั้น:

{{ file_url(node.field_image.entity.fileuri) }}

สามารถย่อให้เหลือ:

{{ node.field_image.entity.url }}

นี้ทำงานในฟังก์ชั่น preprocess แต่ทริกเกอร์Twig_Sandbox_SecurityErrorเมื่อเรียกว่าในแม่แบบกิ่งไม้

หากคุณได้รับTwig_Sandbox_SecurityErrorคุณสามารถบอกทวิให้อนุญาตurlในไฟล์ settings.php ของคุณตามที่กล่าวไว้ในโพสต์ Stackoverflowนี้

ดูเอกสารเกี่ยวกับไฟล์ :: Url () https://api.drupal.org/api/drupal/core%21modules%21file%21src%21Entity%21File.php/function/File%3A%3Aurl/8.6.x

คุณสามารถทำได้สองวิธี!

1) file_create_url (---------) // ข้างในเขียนพา ธ ของโหนด

2) file_url (-------) // ข้างในเขียนพา ธ ของโหนด