51 lines
No EOL
1.1 KiB
Vue
51 lines
No EOL
1.1 KiB
Vue
<template>
|
|
<img :src="image_data" :alt="owner + '/' + src"/>
|
|
</template>
|
|
|
|
<style scoped>
|
|
img {
|
|
width: 190px;
|
|
height: 107px;
|
|
object-fit: contain;
|
|
}
|
|
</style>
|
|
|
|
<script>
|
|
import {mapActions, mapGetters} from "vuex";
|
|
|
|
export default {
|
|
name: "AuthenticatedImage",
|
|
props: {
|
|
src: {
|
|
type: String,
|
|
required: true
|
|
},
|
|
owner: {
|
|
type: String,
|
|
required: true
|
|
}
|
|
},
|
|
data() {
|
|
return {
|
|
image_data: "",
|
|
servers: []
|
|
}
|
|
},
|
|
computed: {
|
|
...mapGetters(["signAuth"])
|
|
},
|
|
methods: {
|
|
...mapActions(["getFriendServers"])
|
|
},
|
|
async mounted() {
|
|
try {
|
|
this.servers = await this.getFriendServers({username: this.owner});
|
|
const response = await this.servers.getRaw(this.signAuth, this.src);
|
|
const mime_type = response.headers.get("content-type");
|
|
this.image_data = "data:" + mime_type + ";base64," + btoa(String.fromCharCode(...new Uint8Array(await response.arrayBuffer())));
|
|
} catch (e) {
|
|
console.log(e);
|
|
}
|
|
}
|
|
}
|
|
</script> |