如何检查ipfs哈希是否为图像/video/.在React Js中



我需要使用ipfs哈希来确定文件是图像还是视频,这样我就可以使用它来显示图像/播放视频。在这个上找不到任何有用的资源。该怎么办?

仅使用ipfs哈希无法找到它。你必须获取文件并找到它的mime类型。查看这些线程12

该代码将在加载图像时检查第一个图像加载是否出错,然后如果视频加载也失败,它将尝试加载视频,然后它将只添加一个样本伪图像

import { Fragment, useState } from "react";
import noImagePreview from "../../Assets/Images/noImage.png"

const ImageComponent = (props) => {
const [imageLoadFailed, setImageLoadFailed] = useState(false)
const [videoLoadFailed, setVideoLoadFailed] = useState(false)
return (
<Fragment>
{!imageLoadFailed && !videoLoadFailed &&
<img {...props} alt={props?.alt}
onError={({ currentTarget }) => {
currentTarget.onerror = null; // prevents looping
currentTarget.src = noImagePreview;
setImageLoadFailed(true)
}} />
}

{/* If image not loaded then load the video  */}
{imageLoadFailed && !videoLoadFailed &&
<video width="100%" height="100%" autoPlay muted
onError={() => setVideoLoadFailed(true)}>
<source src={props?.src} type="video/mp4" />
</video>
}

{videoLoadFailed &&
<img {...props} alt={props?.alt}
onError={({ currentTarget }) => {
currentTarget.onerror = null; // prevents looping
currentTarget.src = noImagePreview;
}} />
}
</Fragment>

)
}

export default ImageComponent

最新更新