Lấy URL hình ảnh từ một trường_image trên một nút

Vì vậy, tôi có nút này:

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)

Bây giờ field_image có một mảng với x-default và một số dữ liệu hình ảnh cơ bản. Làm cách nào để hiển thị hình ảnh hoặc tạo liên kết đến hình ảnh bên trong mẫu Twig?

Đây là phiên bản cập nhật cho câu trả lời này sau 8.0.x. Điều này dựa trên bình luận @joelpittet .

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

Tôi không biết về Twig, nhưng bạn nhận được tệp URI bằng $node->field_image->entity->getFileUri()PHP và bạn cần phải gọi file_create_url()nó:

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

Tôi không biết nếu điều đó là có thể trong twig. Nếu không thể, bạn luôn có thể tính toán nó trong quá trình tiền xử lý và thêm dưới dạng một biến mới.

Nếu ai đó cần một hình ảnh theo kiểu:

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

Không có giải pháp twig nào ở trên hoạt động với tôi (có lẽ những giải pháp này hoạt động cho các phiên bản 8.x cũ hơn nhưng không phải cho phiên bản 8.5

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

LƯU Ý: nên làm việc cho Drupal 8.5+

Vì vậy, tôi đã tìm ra câu trả lời với sự giúp đỡ của Clive .

Lấy URI hình ảnh trong Twig được thực hiện bằng cách sử dụng node.field_image.0.entity.uri.value

Lấy URL đầy đủ cho hình ảnh có thể được thực hiện bằng cách sử dụng file_create_url(node.field_image.0.entity.uri.value)

Làm điều này trong Twig chưa thể nhưng họ đang làm việc trên nó -> xem tại đây

Điều cuối cùng làm việc cho tôi trong D8 là:

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

Sử dụng kint($node->get('field_image')->entity)và xem qua các mảng rất hữu ích

Sau đó, trong tập tin twig của tôi, tôi đã sử dụng:

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

bạn có thể lấy url trực tiếp bằng cách sử dụng field_image.entity.url

Tôi luôn luôn sử dụng chức năng trợ giúp

  /**
   * 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());
    }
  }

Đây là cách nếu bạn muốn lấy URL hình ảnh với kiểu hình ảnh được liên kết cho bất kỳ trường hình ảnh nào trong mẫu twig:

Đầu tiên cài đặt mô-đun Twig Tweak

Sau đó đặt URI hình ảnh làm biến. Với URI, bạn có thể sử dụng mẫu điều chỉnh twig để có được đường dẫn với bất kỳ kiểu hình ảnh nào bạn muốn. Xem bên dưới:

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

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

Twig Tweak v2.4 + cung cấp file_urlbộ lọc để trích xuất URL tệp từ một thực thể.

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

Tôi có cùng một vấn đề, vì vậy tôi đã tạo ra một get_image_path()hàm Twig và thêm nó với một loạt các công cụ hữu ích khác vào mô-đun Starter khởi động của tôi:

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

Hàm chấp nhận trường hình ảnh và tên máy của một kiểu hình ảnh, sau đó trả về đường dẫn hình ảnh đó.

Nó hoạt động trong rất nhiều hoàn cảnh - bạn có thể vượt qua node.field_name, content.field_namehoặc row._entity.field_name(trong trường hợp của một lĩnh vực Xem mẫu).

Trời ạ, thực sự phải mất nhiều thời gian để tìm hiểu lý do tại sao các URL kết quả của tôi không hoạt động. Tất cả 404'ed. Bạn cần tạo một đạo hàm trước nếu nó không tồn tại .

Vì vậy, ví dụ khi bạn thêm một kiểu hình ảnh sau đó, sau khi hình ảnh gốc được tải lên, thì vẫn chưa có tệp hình ảnh được tạo kiểu (hình ảnh phái sinh). Nó cần phải được tạo ra đầu tiên.

Thay thế field_MYIMAGEvà MYSTYLEkhi bạn cần.

$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);

Tôi ước điều này sẽ tự động xảy ra.

hơi liên quan, đây là những gì tôi đã sử dụng (nhờ tất cả các câu trả lời trước để đưa tôi đến đó) để lấy URL tệp hình ảnh từ trường hình ảnh của thực thể phương tiện trong twig:

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

bây giờ tôi có thể sử dụng biến này trong mẫu twig của mình

{{ media_img_url }}

Để lấy thuộc tính hình ảnh như URI, alt, title, v.v ... hãy sử dụng cú pháp như mẫu dưới đây

Trong mẫu twig nút

{{node.field_name.entity.fileuri}}

Trong mẫu twig trường

{{content.field_name.entity.fileuri}}

Trong mẫu twig lĩnh vực khác

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

Lưu ý: Đồng thời kiểm tra bảng cheat mô-đun twig_tweaks để biết chi tiết liên quan đến vấn đề liên quan đến twig.

Bạn có thể sử dụng url()phương thức trên lớp Tệp làm lối tắt:

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

có thể rút ngắn thành:

{{ node.field_image.entity.url }}

Điều này hoạt động trong các chức năng tiền xử lý nhưng kích hoạt một Twig_Sandbox_SecurityErrorkhi được gọi trong một mẫu twig.

Nếu bạn nhận được, Twig_Sandbox_SecurityErrorbạn có thể yêu cầu twig cho phép urltrong tệp settings.php của bạn như được đề cập trong bài đăng Stackoverflow này

Xem tài liệu về Tệp :: Url () https://api.drupal.org/api/drupal/core%21modules%21file%21src%21Entity%21File.php/feft/File%3A%3Aurl/8.6.x

Bạn có thể làm điều đó theo hai cách!

1) file_create_url (---------) // bên trong ghi đường dẫn của nút

2) file_url (-------) // bên trong ghi đường dẫn của nút