In Sitecore JSS
, how can we refer a media item in the front end?(image ,pdf file etc)
Can we use Layout Service? Any other way?
-
The Layout service can be used on items for which presentation details (components) defined. To access Media Items directly, you can use the ItemService.– Amit KumarJun 20, 2019 at 3:13
1 Answer
There are multiple ways to accomplish this but purely based on your requirement. If you are looking for any image which is part of your web page, I would recommend you to upload the image in media library but refer the same in your page item using an Image field for ex. sampleField. From layout service you could able to access this image field and render in JSS app,
import { Image } from '@sitecore-jss/sitecore-jss-react';
const TestImage = (props) => (
<Image media={props.fields.sampleField} />
);
export default TestImage;
Other ways are using Item Service or GraphQL where you no need to worry about your Layout Service or Page Item. You can directly access any media folder/item using Item Service or GraphQL and render wherever you want.
Also you can consider customizing the Layout Service for your need, but it's up to you to pick a right approach for your need.