GraphQl base64图像数据和gastby
启动此Gatsby网站，我有来自远程PIM软件的数据。 响应：
"data": {
"pim": {
"getProducts": {
"name": "000F office grey jeans",
"image": {
"mimetype": "image/jpeg",
"type": "image",
"data": "/9j/2wCEAAQDAwMDAwQDAwQGBAMEBgcFBA .....
问题是，是否有插件或更友好的方式可以在盖茨比（Gatsby）上显示图像，而不必构成图像src属性，即：
<img src="data:{data.pim.getProducts.image.mimetype};base64,{data.pim.getProducts.image.data}
我尝试使用静态图像，gatsbyimage，getimage仔细图像
import { StaticImage, GatsbyImage, getImage} from 'gatsby-plugin-image'
，但无法在网站上显示图像。 我正在使用gatsby-source-graphql插件。 提前致谢。
Starting this gatsby site and i have data that come from remote PIM software.
The response :
"data": {
"pim": {
"getProducts": {
"name": "000F office grey jeans",
"image": {
"mimetype": "image/jpeg",
"type": "image",
"data": "/9j/2wCEAAQDAwMDAwQDAwQGBAMEBgcFBA .....
The question is if there is a plugin or a more friendly way to display image on Gatsby without have to compose the image src attribute i.e :
<img src="data:{data.pim.getProducts.image.mimetype};base64,{data.pim.getProducts.image.data}
I tried with StaticImage, GatsbyImage, getImage through
import { StaticImage, GatsbyImage, getImage} from 'gatsby-plugin-image'
but could not display the image on site.
Im using gatsby-source-graphql plugin.
Thanks in advance.
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（1）
您将无法使用
gatsbyimage，因为要使用它，盖茨比需要用其变压器和夏普处理资产来创建适当的GraphQl节点数据（gatsbyimimagedata）。在您的情况下，图像是基本64编码的字符串，无法在本地进行分析，因此这不是原样的选项。关于
静态图像，恐怕它仅适用于URL路径，而不适用于基本64型资产。我对您的
＆lt; img＆gt;标签没有任何错误，但是当然，您可以自由使用任何第三方依赖性来懒惰或重新创建Gatsby对图像所做的表演建立网站时。You won't be able to use
GatsbyImagebecause to use it, Gatsby needs to treat the asset with its transformers and sharps to create the proper GraphQL node data (gatsbyImageData). In your case, the image is a base64 encoded string and can't be locally analyzed, hence it's not an option as is.Regarding the
StaticImage, I'm afraid it only works with URL paths, not in base64-like assets.I don't see anything wrong with your
<img>tag, but of course you're free to use any third-party dependency to lazy-load or to recreate the performances that Gatsby does with images when builds the site.