MCMichinator/skoutz-relaunch
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Backend Verbindung mittels AXIOS (noch fehlerhaft - CORS policy)

Browse Source
This commit is contained in:
Michi Tomaschko 2024-11-10 13:40:54 +01:00
parent d9f63e01fd
commit c8350b3c19
4 changed files with 79 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
package-lock.json generated
View File

@ -25,6 +25,7 @@
"@vueuse/core": "10.9.0",
"@vueuse/math": "10.9.0",
"apexcharts": "3.46.0",
"axios": "^1.7.7",
"chart.js": "4.4.2",
"cookie-es": "1.0.0",
"eslint-plugin-regexp": "2.2.0",
@ -44,7 +45,6 @@
"vue-i18n": "9.10.1",
"vue-prism-component": "2.0.0",
"vue-router": "4.3.0",
"vue-the-mask": "^0.11.1",
"vue3-apexcharts": "1.5.2",
"vue3-perfect-scrollbar": "1.6.1",
"vuetify": "3.5.2",
@ -4167,8 +4167,7 @@
"node_modules/asynckit": {
"version": "0.4.0",
"resolved": "https://registry.npmjs.org/asynckit/-/asynckit-0.4.0.tgz",
"integrity": "sha512-Oei9OH4tRh0YqU3GxhX79dM/mwVgvbZJaSNaRk+bshkj0S5cfHcgYakreBjrHwatXKbz+IoIdYLxrKim2MjW0Q==",
"dev": true
"integrity": "sha512-Oei9OH4tRh0YqU3GxhX79dM/mwVgvbZJaSNaRk+bshkj0S5cfHcgYakreBjrHwatXKbz+IoIdYLxrKim2MjW0Q=="
},
"node_modules/available-typed-arrays": {
"version": "1.0.7",
@ -4186,10 +4185,9 @@
}
},
"node_modules/axios": {
"version": "1.7.2",
"resolved": "https://registry.npmjs.org/axios/-/axios-1.7.2.tgz",
"integrity": "sha512-2A8QhOMrbomlDuiLeK9XibIBzuHeRcqqNOHp0Cyp5EoJ1IFDh+XZH3A6BkXtv0K4gFGCI0Y4BM7B1wOEi0Rmgw==",
"dev": true,
"version": "1.7.7",
"resolved": "https://registry.npmjs.org/axios/-/axios-1.7.7.tgz",
"integrity": "sha512-S4kL7XrjgBmvdGut0sN3yJxqYzrDOnivkBiN0OFs6hLiUam3UPvswUo0kqGyhqUZGEOytHyumEdXsAkgCOUf3Q==",
"dependencies": {
"follow-redirects": "^1.15.6",
"form-data": "^4.0.0",
@ -4689,7 +4687,6 @@
"version": "1.0.8",
"resolved": "https://registry.npmjs.org/combined-stream/-/combined-stream-1.0.8.tgz",
"integrity": "sha512-FQN4MRfuJeHf7cBbBMJFXhKSDq+2kAArBlmRBvcvFE5BB1HZKXtSFASDhdlz9zOYwxh8lDdnvmMOe/+5cdoEdg==",
"dev": true,
"dependencies": {
"delayed-stream": "~1.0.0"
},
@ -5159,7 +5156,6 @@
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/delayed-stream/-/delayed-stream-1.0.0.tgz",
"integrity": "sha512-ZySD7Nf91aLB0RxL4KGrKHBXl7Eds1DAmEdcoVawXnLD7SDhpNgtuII2aAkg7a7QS41jxPSZ17p4VdGnMHk3MQ==",
"dev": true,
"engines": {
"node": ">=0.4.0"
}
@ -6868,7 +6864,6 @@
"version": "1.15.6",
"resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.15.6.tgz",
"integrity": "sha512-wWN62YITEaOpSK584EZXJafH1AGpO8RVgElfkuXbTOrPX4fIfOyEpW/CsiNd8JdYrAoOvafRTOEnvsO++qCqFA==",
"dev": true,
"funding": [
{
"type": "individual",
@ -6897,7 +6892,6 @@
"version": "4.0.0",
"resolved": "https://registry.npmjs.org/form-data/-/form-data-4.0.0.tgz",
"integrity": "sha512-ETEklSGi5t0QMZuiXoA/Q6vcnxcLQP5vdugSpuAyi6SVGi2clPPp+xgEhuMaHC+zGgn31Kd235W35f7Hykkaww==",
"dev": true,
"dependencies": {
"asynckit": "^0.4.0",
"combined-stream": "^1.0.8",
@ -8398,7 +8392,6 @@
"version": "1.52.0",
"resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.52.0.tgz",
"integrity": "sha512-sPU4uV7dYlvtWJxwwxHD0PuihVNiE7TyAbQ5SWxDCB9mUYvOgroQOwYQQOKPJ8CIbE+1ETVlOoK1UC2nU3gYvg==",
"dev": true,
"engines": {
"node": ">= 0.6"
}
@ -8407,7 +8400,6 @@
"version": "2.1.35",
"resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.35.tgz",
"integrity": "sha512-ZDY+bPm5zTTF+YpCrAU9nK0UgICYPT0QtT1NZWFv4s++TNkcgVaT0g6+4R2uI4MjQjzysHB1zxuWL50hzaeXiw==",
"dev": true,
"dependencies": {
"mime-db": "1.52.0"
},
@ -10146,8 +10138,7 @@
"node_modules/proxy-from-env": {
"version": "1.1.0",
"resolved": "https://registry.npmjs.org/proxy-from-env/-/proxy-from-env-1.1.0.tgz",
"integrity": "sha512-D+zkORCbA9f1tdWRK0RaCR3GPv50cMxcrz4X8k5LTSUD1Dkw47mKJEZQNunItRTkWwgtaUSo1RVFRIG9ZXiFYg==",
"dev": true
"integrity": "sha512-D+zkORCbA9f1tdWRK0RaCR3GPv50cMxcrz4X8k5LTSUD1Dkw47mKJEZQNunItRTkWwgtaUSo1RVFRIG9ZXiFYg=="
},
"node_modules/pump": {
"version": "3.0.0",
@ -12750,11 +12741,6 @@
"vue": ">=3.0.0"
}
},
"node_modules/vue-the-mask": {
"version": "0.11.1",
"resolved": "https://registry.npmjs.org/vue-the-mask/-/vue-the-mask-0.11.1.tgz",
"integrity": "sha512-UquSfnSWejD0zAfcD+3jJ1chUAkOAyoxya9Lxh9acCRtrlmGcAIvd0cQYraWqKenbuZJUdum+S174atv2AuEHQ=="
},
"node_modules/vue/node_modules/@vue/compiler-core": {
"version": "3.4.21",
"resolved": "https://registry.npmjs.org/@vue/compiler-core/-/compiler-core-3.4.21.tgz",

1
package.json
View File

@ -29,6 +29,7 @@
"@vueuse/core": "10.9.0",
"@vueuse/math": "10.9.0",
"apexcharts": "3.46.0",
"axios": "^1.7.7",
"chart.js": "4.4.2",
"cookie-es": "1.0.0",
"eslint-plugin-regexp": "2.2.0",

42
src/pages/BookService.js Normal file
View File

@ -0,0 +1,42 @@
import axios from 'axios'
const baseUrl = 'http://localhost:8001/api/v1/book/registration/search/isbn/' // Passe die URL an
export default {
getBookByIsbn(isbn) {
return axios.get(`${baseUrl}${isbn}`, {
headers: {
'accept': 'application/json',
},
})
.catch(error => {
// Detailliertere Fehlerbehandlung
console.error('Fehler beim Abrufen des Buches:', error)
// Zeige dem Benutzer eine informative Fehlermeldung an
})
},
}
/*const axios = require('axios')
export default {
getBookByIsbn(isbn) {
// Make a request for a user with a given ID
console.log(isbn)
axios.get('http://localhost:8001/api/v1/book/registration/search/isbn/9783898798822')
.then(function (response) {
// handle success
console.log("hi", response)
})
.catch(function (error) {
// handle error
console.log(error)
console.log("hi")
})
.finally(function () {
// always executed
console.log("hi")
})
},
}*/

30
src/pages/buechersuche.vue
View File

@ -114,6 +114,14 @@
class="mb-6"
title="Gefundene Bücher:"
>
Hallo Hier ist die API:
{{book}}
<div v-if="book">
<p>Titel: {{ book.title }}</p>
<!-- <p>Autor: {{ book.author }}</p>-->
</div>
<!-- 👉 Hier werden die Bücher aufgelistet. -->
<VCol
@ -178,6 +186,7 @@ import { themeConfig } from '@themeConfig'
import { ref, onMounted, watch } from 'vue'
import Fieberkurve from "@/components/Fieberkurve.vue"
import harry_potter from "@/assets/images/harry_potter_stein_weisen_rowling.jpg"
import BookService from './BookService'
import { useTheme } from "vuetify"
const message = ref('')
@ -277,6 +286,27 @@ const checkboxContent = [
const selectedCheckbox = ref([])
// Hier ist der Abschnitt für die API (BACKEND)
let book = null
onMounted(() => {
const isbn = '9783898798822' // Ersetze durch die gewünschte ISBN
BookService.getBookByIsbn(isbn)
.then(response => {
// book = response.data
book = response
})
.catch(error => {
console.error(error)
})
})
// const toggleCheckboxOne = ref(true)
// const genreBool = ref(false)