Uzyskiwanie adresu URL obrazu z obrazu_pola w węźle

42

Mam więc ten Węzeł:

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)

Teraz field_image ma tablicę z x-default i podstawowymi danymi obrazu. Jak wyświetlić obraz lub utworzyć łącze do obrazu w szablonie Twig?

Rias
źródło
Nie mam czasu na sprawdzenie, ale może tak proste jak url(node.field_image.0.entity.uri)( istotny problem )
Clive
@Clive Próbowałem tego i daje mi ten błąd: Recoverable fatal error: Object of class Drupal\Core\Field\FieldItemList could not be converted to string więc spróbowałem z tym: url(node.field_image.0.entity.uri.value)ale potem to po prostu mówi mi to:Twig_Error_Runtime: An exception has been thrown during the rendering of a template ("Route "public://image.png" does not exist.")
Rias
Errr ... Wydaje mi się, że należy to zrobić w haczyku przetwarzania wstępnego, chyba że istnieje funkcja pomocnicza Gałązka, która przekształca FieldItemLists w ciąg znaków (którego nie mogę znaleźć)
Clive
Och, rozumiem, url()chce trasy. Jak o url_from_path(node.field_image.0.entity.uri.value)?
Clive
Hmm url_from_path()wydaje się to generować: http://mywebsite.local/public%3A//image.pngwięc wydaje się, że jest to urlencoding i dołączanie dokładnej wartości do adresu
Rias

Odpowiedzi:

49

Oto zaktualizowana wersja tej odpowiedzi po wersji 8.0.x. Ta baza jest oparta na komentarzu @joelpittet .

{{ file_url(node.field_image.entity.fileuri) }}
itsdarrylnorris
źródło
2
Pamiętaj, że otrzymasz adres URL „niestylowanego” obrazu oryginalnego, a nie adres URL specyficzny dla stylu obrazu (np. Miniatura). Oprócz odpowiedzi VladimirM nie ma sposobu, aby uzyskać poprawny stylizowany adres URL obrazu na gałązce. Przynajmniej obecnie ...
Philipp Michael
2
... style obrazów są teraz dostępne w Twig Tweak - drupal.org/project/twig_tweak
4k4 18.03.17
1
Klasa File ma url()metodę, więc możesz po prostu zadzwonić entity.url()zamiast przekazać entity.fileuridofile_url()
Kiee
36

Nie wiem o Twig, ale dostajesz identyfikator URI pliku $node->field_image->entity->getFileUri()w PHP i musisz to wywołać file_create_url():

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

Nie wiem, czy to możliwe z gałązki. Jeśli nie jest to możliwe, zawsze możesz obliczyć go w procesie wstępnym i dodać jako nową zmienną.

Berdir
źródło
2
Próbujemy przenieść file_create_url () do rdzenia, ale brak zainteresowania sprawił, że problem stał się nieaktualny. drupal.org/node/2168231 Chociaż jeśli to się pojawiło , powinno być {{file_url (node.field_image.entity.fileuri)}}
joelpittet
26

Jeśli ktoś potrzebuje stylizowanego obrazu:

$styled_image_url = ImageStyle::load('large')->buildUrl($node->field_image->entity->getFileUri());
VladimirM
źródło
4
To świetna odpowiedź. Pamiętaj, że w pliku .theme lub .module chcesz dodać to do góry:use Drupal\image\Entity\ImageStyle;
mikeDOTexe,
2
Wystąpił problem z https, w którym Safari nie wyświetla obrazu, ponieważ używa adresu IP. Możesz dodać, $relative = file_url_transform_relative($styled_image_url);aby upewnić się, że jest względna. API tutaj
mikeDOTexe
9

Żadne z powyższych rozwiązań dla gałązek nie działało dla mnie (być może te działały dla starszych wersji 8.x, ale nie dla wersji 8.5

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

UWAGA: powinien działać dla Drupal 8.5+

GiorgosK
źródło
Myślę, że to źle, że tego rodzaju rzeczy po pewnym czasie stają się przestarzałe. Uaktualnienie Drupala powinno sprawić, by działali! To działa dla mnie w Drupal 8.6, dzięki.
Stef Van Looveren
7

Tak więc znalazłem odpowiedź z pomocą Clive .

Uzyskiwanie obrazu URI w Twig odbywa się za pomocą node.field_image.0.entity.uri.value

Uzyskanie pełnego adresu URL obrazu można wykonać za pomocą file_create_url(node.field_image.0.entity.uri.value)

Robienie tego w Twig nie jest jeszcze możliwe, ale pracują nad tym -> patrz tutaj

Rias
źródło
6

To, co zakończyło się dla mnie pracą w D8, to:

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

Używanie kint($node->get('field_image')->entity)i przeglądanie tablicy było bardzo pomocne

wprowadź opis zdjęcia tutaj

Następnie w moim pliku gałązki użyłem:

<img class="top-article-image" src="{{ file_url(imageUrl) }}" />
Crobicha
źródło
co jeśli nie ma wstawionego obrazu i ustawiliśmy wartość domyślną.
amol
2

możesz uzyskać adres URL bezpośrednio, używając field_image.entity.url

Adrian Kremer
źródło
2

Zawsze używam funkcji pomocnika

  /**
   * 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());
    }
  }
hugronaphor
źródło
1

W ten sposób chcesz uzyskać adres URL obrazu ze skojarzonym stylem obrazu dla dowolnego pola obrazu w szablonie gałązki:

Najpierw zainstaluj moduł Twig Tweak

Następnie ustaw identyfikator URI obrazu jako zmienną. Za pomocą identyfikatora URI można użyć wzoru poprawek gałązek, aby uzyskać ścieżkę w dowolnym stylu obrazu. Patrz poniżej:

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

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

Twig Tweak v2.4 + oferuje file_urlfiltr do wyodrębnienia adresu URL pliku z encji.

<img src="{{ node.field_image|file_url|image_style('image1200x1103') }}"/>
Robb Davis
źródło
0

Miałem ten sam problem, więc utworzyłem funkcję get_image_path()Twig i dodałem ją z kilkoma innymi przydatnymi rzeczami do mojego modułu startowego:

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

Funkcja akceptuje pole obrazu i nazwę maszyny stylu obrazu, a następnie zwraca tę ścieżkę obrazu.

To działa w wielu kontekstach - można przejść node.field_name, content.field_namelub row._entity.field_name(w przypadku Widok pól szablonu).


źródło
0

Boże, właściwie zajęło mi to całe wieki, aby dowiedzieć się, dlaczego moje wynikowe adresy URL nie działają. Wszyscy 404. Najpierw musisz utworzyć pochodną, ​​jeśli jeszcze nie istnieje .

Na przykład, jeśli dodasz styl obrazu później, po przesłaniu oryginalnego obrazu, nie ma jeszcze pliku ze stylizowanym obrazem (pochodna obrazu). Najpierw należy go utworzyć.

Wymień field_MYIMAGEi MYSTYLEjak potrzebujesz.

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

Chciałbym, żeby stało się to automatycznie.

leymannx
źródło
0

nieco spokrewnione, oto, czego użyłem (dzięki wszystkim poprzednim odpowiedziom, aby mnie tam dostać), aby uzyskać adres URL pliku obrazu z pola obrazu encji medialnej w gałązce:

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

teraz mogę użyć tej zmiennej w moim szablonie gałązki

{{ media_img_url }}
bdanin
źródło
0

Aby uzyskać atrybut obrazu, taki jak URI, alt, tytuł itp., Użyj składni jak poniżej szablonu

W szablonie gałązki węzła

{{node.field_name.entity.fileuri}}

W polu szablon gałązka

{{content.field_name.entity.fileuri}}

W innym polu szablon gałązki

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

UWAGA: Należy również sprawdzić twig_tweaks moduł Ściągawka do szczegółów związanych z gałązka powiązanego problemu.

Prem Patel
źródło
0

Możesz użyć url()metody znajdującej się w klasie File jako skrótu, aby:

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

można skrócić do:

{{ node.field_image.entity.url }}

Działa to w funkcjach wstępnego przetwarzania, ale wyzwala Twig_Sandbox_SecurityErrorwywołanie w szablonie gałązki.

Jeśli otrzymasz Twig_Sandbox_SecurityError, możesz powiedzieć gałązce, aby zezwoliła urlw pliku settings.php, jak wspomniano w tym poście Stackoverflow

Zobacz dokumentację dotyczącą File :: Url () https://api.drupal.org/api/drupal/core%21modules%21file%21src%21Entity%21File.php/function/File%3A%3Aurl/8.6.x

Kiee
źródło
-4

Możesz to zrobić na dwa sposoby!

1) file_create_url (---------) // wewnątrz napisz ścieżkę do węzła

2) file_url (-------) // wewnątrz napisz ścieżkę do węzła

Drock
źródło