web-dev-qa-db-ja.com

ノードのfield_imageから画像URLを取得する

だから私はこのノードを持っています：

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テンプレート内に画像を表示するか、画像へのリンクを作成するにはどうすればよいですか？

media8theming
44
Rias

これは、8.0.x以降のこの回答の更新バージョンです。 @ joelpittet コメントに基づいています。

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

Twigについては知りませんが、PHPで$node->field_image->entity->getFileUri()を使用してファイルURIを取得します。そのため、file_create_url()を呼び出す必要があります。

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

それが小枝で可能かどうかはわかりません。それが不可能な場合は、いつでも前処理で計算して、新しい変数として追加できます。

39
Berdir

スタイル設定された画像が必要な場合：

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

上記のどれもtwig解決策は私にはうまくいきませんでした

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

注：Drupal 8.5 +

11
GiorgosK

だから私は Clive の助けを借りて答えを見つけました。

Twigで画像URIを取得するには、_node.field_image.0.entity.uri.value_を使用します

画像の完全なURLを取得するには、file_create_url(node.field_image.0.entity.uri.value)を使用します。

Twigでこれを行うことはまだ不可能ですが、彼らはそれに取り組んでいます-> ここを参照

7
Rias

D8で私のために働いたのは次のとおりです。

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

kint($node->get('field_image')->entity)を使用して配列を調べると非常に役に立ちました

enter image description here

次に、私のtwigファイルで使用しました：

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

これは、twigテンプレート内の任意の画像フィールドに関連する画像スタイルを含む画像URLを取得する場合の方法です。

最初に Twig Tweak module をインストールします

次に、画像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') }}"/>
3
Robb Davis

あなたはfield_image.entity.urlを使用して直接URLを取得できます

2
Adrian Kremer

私はいつもヘルパー関数を使っています

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

Fileクラスにあるurl()メソッドをショートカットとして使用できます。

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

次のように短縮できます。

{{ node.field_image.entity.url }}

これは前処理関数で機能しますが、twigテンプレートで呼び出されるとTwig_Sandbox_SecurityErrorをトリガーします。

Twig_Sandbox_SecurityErrorを受け取った場合、twigを許可するように設定できます。これは、この Stackoverflowの投稿）で述べたように、settings.phpファイルでurlを許可することです

File :: Url（）のドキュメントを参照してください https://api.drupal.org/api/drupal/core%21modules%21file%21src%21Entity%21File.php/function/File%3A%3Aurl/8.6 .x

0
Kiee

URI、alt、titleなどの画像属性を取得するには、以下のテンプレートのような構文を使用してください

ノード内twigテンプレート

{{node.field_name.entity.fileuri}}

フィールドにtwigテンプレート

{{content.field_name.entity.fileuri}}

他の分野ではtwigテンプレート

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

注：twig_tweaks module cheat sheet も確認して、twig関連の問題。

0
Prem Patel

私は同じ問題を抱えていたので、get_image_path() Twig関数を作成し、ボイラープレートスターターモジュールに他の便利なものを追加しました：

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

この関数は、画像フィールドと画像スタイルのマシン名を受け入れ、その画像パスを返します。

それは多くのコンテキストで動作します-node.field_name、content.field_nameまたはrow._entity.field_name（ビューフィールドテンプレートの場合）。

0
user34185

少し関連していますが、ここでは、twigのメディアエンティティの画像フィールドから画像ファイルのURLを取得するために使用したもの（以前のすべての回答に感謝します）を示します。

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

これで、この変数をtwigテンプレートで使用できます

{{ media_img_url }}
0
bdanin

まあ、実際に私のURLが機能しない理由を見つけるのに私の年齢がかかりました。すべて404'ed。 派生物がまだ存在しない場合は、最初に作成する必要があります。

したがって、たとえば、元の画像がアップロードされた後、後で画像スタイルを追加する場合、スタイル設定された画像ファイルはまだありません（画像派生物）。最初に作成する必要があります。

置換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);

これが自動的に行われることを願っています。

0
leymannx