cloudinary
cloudinary copied to clipboard
Fetch by tag or all images
Hello ,
i'm don't find a way to get all images from my cloudinary by tag. maybe i'm missing somthing ?
Searching for the same. Please tell me if you find a Solution @sandro-git . I will tell you mine if I find one.
I have a Solution / Workaround for this. Its quick and dirty for testing purpose for me. I'm not happy with it but its a step in the right direction.
Working with Tags. Just replace it with your name. Hope it helps you
<template>
<div class="px-12 md:px-48 ">
<div v-for="post of posts">
<cld-image :public-id="post.public_id" responsive loading="lazy" />
</div>
<button @click="refresh()">Refresh</button>
</div>
</template>
<script>
export default {
data() {
return {
posts: []
}
},
methods: {
async refresh() {
const list = await this.$axios.$get('https://res.cloudinary.com/YOUR-ACCOUNT-NAME/image/list/YOUR-TAG-NAME.json')
this.posts = list.resources
}
}
}
</script>
i was inspired with your solution and i come to this one which doesn't need button i think he is reactive.
`async asyncData({ $axios }) { const images = await $axios.$get( 'https://res.cloudinary.com/vr-cafe/image/list/Jeux.json' ) return { images } },
computed: { imageComputed() { return this.images.resources.map((image) => { return this.$cloudinary.image.url(image.public_id) }) }, }, `
sorry i'm not fluent in making pretty code in github. ;)
@sandro-git Nice Solution. I am still struggling get the Additional Metadata or Tags from the Cloudinary API.
Thats why I needed a Refresh button for testing. But implemented now your Solution :) Happy Coding
It’s my next step getting metadata. I let you know when I get it. Thanks for helping me. It’s good to help each other. Happy coding too.
has anyone found a way to get all the urls in cloudinary with this module? the gridsome version of this module allows to do this very simply. is it not possible in Nuxt? i need an array of all my images that contain a word and to pass this into async await function.
mounted(){
this.$nextTick(async function () {
const data = await this.$cloudinary.image.url('art')
console.log(data)
this.images = data
});
}
here i am trying to get any image that contains the folder name 'art' . in the gridsome-cloudinary module (which was written by the same author as this one) you can do this :
allCldMedia(filter: { public_id : { regex:"Art"} }) { edges { node { public_id secure_url } } }
isnt there a way to do this with this module in nuxt without resorting to Axios/Apollo?
Hey, I am closing this issue as it is targeting the v1 version and it is really old (more than one year stale)