I'm trying to let players join a game via QR Code. Since that game will be hosted on several IP's, i want to dynamically generate the URL.
This is my current workaround in my NuxtJS Vue Component:
<template>
<input placeholder="copy browser window url into this field" v-model="fullPath" @change="generateQR">
</template>
<script setup>
const fullPath = ref(null)
QRCode.toDataURL(fullPath.value + ...
</script>
What I want to do is something like:
<script setup>
// not working phantasy code
QRCode.toDataURL(window.location.href + ...
</script>
When using useRouter() and useRoute()'s .fullPath
attribute, I still only get the relative path /
instead of http://10.16.1.173:3000/
.
Full code on GitLab: pages/index.vue
Try to check if you are in client side before accessing to 'window' object, you can use :
if (process.client) {
console.log(window.location.href)
}