fix(webui-new): cross origin calls

This commit is contained in:
Roberto Tonino 2021-07-17 17:17:45 +02:00
parent b2df54765e
commit 5ba56f5249
7 changed files with 53 additions and 14 deletions

View File

@ -3,6 +3,7 @@ import express from 'express'
import logger from 'morgan'
import cookieParser from 'cookie-parser'
import session from 'express-session'
import cors from 'cors'
import { WEBUI_DIR } from './helpers/paths'
@ -32,5 +33,15 @@ export function registerMiddlewares(app: Application) {
saveUninitialized: true
})
)
app.use(express.static(WEBUI_DIR))
if (process.env.NODE_ENV === 'production') {
app.use(express.static(WEBUI_DIR))
} else {
app.use(
cors({
credentials: true,
origin: 'http://localhost:3000'
})
)
}
}

View File

@ -674,6 +674,11 @@
resolved "https://registry.yarnpkg.com/@types/cookiejar/-/cookiejar-2.1.2.tgz#66ad9331f63fe8a3d3d9d8c6e3906dd10f6446e8"
integrity sha512-t73xJJrvdTjXrn4jLS9VSGRbz0nUY3cl2DMGDU48lKl+HR9dbbjW2A9r3g40VA++mQpy6uuHg33gy7du2BKpog==
"@types/cors@2.8.12":
version "2.8.12"
resolved "https://registry.yarnpkg.com/@types/cors/-/cors-2.8.12.tgz#6b2c510a7ad7039e98e7b8d3d6598f4359e5c080"
integrity sha512-vt+kDhq/M2ayberEtJcIN/hxXy1Pk+59g2FV/ZQceeaTyCtCucjL2Q7FXlFjtWn4n15KCr1NE2lNNFhp0lEThw==
"@types/debug@4.1.5":
version "4.1.5"
resolved "https://registry.yarnpkg.com/@types/debug/-/debug-4.1.5.tgz#b14efa8852b7768d898906613c23f688713e02cd"
@ -2008,6 +2013,14 @@ core-util-is@1.0.2:
resolved "https://registry.yarnpkg.com/core-util-is/-/core-util-is-1.0.2.tgz#b5fd54220aa2bc5ab57aab7140c940754503c1a7"
integrity sha1-tf1UIgqivFq1eqtxQMlAdUUDwac=
cors@2.8.5:
version "2.8.5"
resolved "https://registry.yarnpkg.com/cors/-/cors-2.8.5.tgz#eac11da51592dd86b9f06f6e7ac293b3df875d29"
integrity sha512-KIHbLJqu73RGr/hnbrO9uBeixNGuvSQjul/jdFvS/KFSIH1hWVd1ng7zOHx+YrEfInLG7q4n6GHQ9cDtxv/P6g==
dependencies:
object-assign "^4"
vary "^1"
create-require@^1.1.0:
version "1.1.1"
resolved "https://registry.yarnpkg.com/create-require/-/create-require-1.1.1.tgz#c1d7e8f1e5f6cfc9ff65f9cd352d37348756c333"
@ -4902,7 +4915,7 @@ oauth-sign@~0.9.0:
resolved "https://registry.yarnpkg.com/oauth-sign/-/oauth-sign-0.9.0.tgz#47a7b016baa68b5fa0ecf3dee08a85c679ac6455"
integrity sha512-fexhUFFPTGV8ybAtSIGbV6gOkSv8UtRbDBnAyLQw4QPKkgNlsH2ByPGtMUqdWkos6YCRmAqViwgZrJc/mRDzZQ==
object-assign@^4.0.1:
object-assign@^4, object-assign@^4.0.1:
version "4.1.1"
resolved "https://registry.yarnpkg.com/object-assign/-/object-assign-4.1.1.tgz#2109adc7965887cfc05cbbd442cac8bfbb360863"
integrity sha1-IQmtx5ZYh8/AXLvUQsrIv7s2CGM=
@ -6729,7 +6742,7 @@ validate-npm-package-license@^3.0.1:
spdx-correct "^3.0.0"
spdx-expression-parse "^3.0.0"
vary@~1.1.2:
vary@^1, vary@~1.1.2:
version "1.1.2"
resolved "https://registry.yarnpkg.com/vary/-/vary-1.1.2.tgz#2299f02c6ded30d4a5961b0b9f74524a18f634fc"
integrity sha1-IpnwLG3tMNSllhsLn3RSShj2NPw=

View File

@ -21,7 +21,7 @@ import router from '@/router'
import store from '@/store'
import { socket } from '@/utils/socket'
import { fetchData, postToServer } from '@/utils/api'
import { fetchData, postToServer, SERVER_ENDPOINT } from '@/utils/api'
import { toast } from '@/utils/toasts'
import { isValidURL } from '@/utils/utils'
import { sendAddToQueue } from '@/utils/downloads'
@ -35,7 +35,7 @@ async function startApp() {
render: h => h(App)
}).$mount('#app')
const connectResponse = await (await fetch('connect')).json()
const connectResponse = await (await fetch(`${SERVER_ENDPOINT}/connect`)).json()
if (!connectResponse.deezerAvailable) document.getElementById('deezer_not_available').classList.remove('hide')
store.dispatch('setAppInfo', connectResponse.update).catch(console.error)

View File

@ -7,7 +7,11 @@
class="top-0 left-0 flex flex-col h-screen bg-panels-bg text-foreground"
role="navigation"
>
<div class="deemix-icon-container" v-html="deemixIcon" />
<!-- <div class="deemix-icon-container" v-html="deemixIcon" />-->
<div class="deemix-icon-container">
<img src="@/assets/deemix-icon.svg" alt="deemix icon" />
</div>
<router-link
v-for="link in links"
:key="link.name"

View File

@ -93,8 +93,10 @@
:title="locale"
class="inline-flex items-center locale-flag"
@click="changeLocale(locale)"
v-html="flags[locale]"
/>
>
<!-- v-html="flags[locale]"-->
<img :src="flags[locale]" />
</li>
</ul>
</div>
@ -1042,12 +1044,14 @@ export default {
}
&.locale-flag--current {
::v-deep svg {
::v-deep svg,
::v-deep img {
filter: brightness(1) !important;
}
}
&::v-deep svg {
&::v-deep svg,
&::v-deep img {
width: 40px !important;
height: 40px !important;
filter: brightness(0.5);

View File

@ -1,5 +1,9 @@
// const SERVER_ENDPOINT = window.location.origin
export const SERVER_ENDPOINT = 'http://localhost:6595'
export const SERVER_HOST = 'localhost:6595'
export function fetchData(key, data = {}, method = 'GET') {
const url = new URL(`${window.location.origin}/api/${key}`)
const url = new URL(`${SERVER_ENDPOINT}/api/${key}`)
Object.keys(data).forEach(key => {
url.searchParams.append(key, data[key])
@ -14,7 +18,7 @@ export function fetchData(key, data = {}, method = 'GET') {
}
export function sendToServer(key, data) {
const url = new URL(`${window.location.origin}/api/${key}`)
const url = new URL(`${SERVER_ENDPOINT}/api/${key}`)
Object.keys(data).forEach(key => {
url.searchParams.append(key, data[key])
@ -26,7 +30,7 @@ export function sendToServer(key, data) {
}
export const postToServer = (endpoint, data) => {
const url = new URL(`${window.location.origin}/api/${endpoint}`)
const url = new URL(`${SERVER_ENDPOINT}/api/${endpoint}`)
return fetch(url, {
body: JSON.stringify(data),

View File

@ -1,3 +1,5 @@
import { SERVER_HOST } from '@/utils/api'
class CustomSocket extends WebSocket {
constructor(args) {
super(args)
@ -34,4 +36,5 @@ class CustomSocket extends WebSocket {
}
}
export const socket = new CustomSocket('ws://' + location.host + '/')
// export const socket = new CustomSocket('ws://' + location.host + '/')
export const socket = new CustomSocket('ws://' + SERVER_HOST + '/')