jean/airsonic-refix
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

add support for configuring server url. fixes #11

Browse Source
This commit is contained in:
Thomas Amland 2020-09-19 09:23:25 +02:00
parent f22c03d2c8
commit 419f26b8bf
9 changed files with 45 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
README.md
View File

@ -22,7 +22,9 @@ Modern responsive web frontend for [Airsonic](https://github.com/airsonic/airson
https://airsonic.netlify.com https://airsonic.netlify.com
Password is `guest`. Server: `/api`
Username: `guest1`
Password:`guest`
You can use the URL and credentials for your own server if you prefer. **Note**: if your server is using http only you must allow mixed content in your browser otherwise login will not work. You can use the URL and credentials for your own server if you prefer. **Note**: if your server is using http only you must allow mixed content in your browser otherwise login will not work.
@ -37,6 +39,10 @@ $ docker run -d -p 8080:80 tamland/airsonic-frontend:latest
You can now access the application at http://localhost:8080/ You can now access the application at http://localhost:8080/
Environment variables:
- `SERVER_URL` (Optional): The backend server URL. When set the server input on the login page will not be displayed.
### Pre-built bundle ### Pre-built bundle
Pre-built bundles can be found in the [Actions](https://github.com/tamland/airsonic-frontend/actions) Pre-built bundles can be found in the [Actions](https://github.com/tamland/airsonic-frontend/actions)

7
docker/Dockerfile
View File

@ -2,5 +2,12 @@ FROM nginx:alpine
EXPOSE 80 EXPOSE 80
RUN apk add gettext
COPY docker/nginx.conf /etc/nginx/conf.d/default.conf COPY docker/nginx.conf /etc/nginx/conf.d/default.conf
COPY docker/env.js.template /env.js.template
COPY docker/docker-entrypoint.sh /docker-entrypoint.sh
RUN chmod +x /docker-entrypoint.sh
COPY dist/ /var/www/html/ COPY dist/ /var/www/html/
ENTRYPOINT ["/docker-entrypoint.sh"]
CMD ["nginx", "-g", "daemon off;"]

4
docker/docker-entrypoint.sh Normal file
View File

@ -0,0 +1,4 @@
#!/bin/sh
set -e
envsubst < env.js.template > /var/www/html/env.js
exec "$@"

3
docker/env.js.template Normal file
View File

@ -0,0 +1,3 @@
window.env = {
SERVER_URL: "$SERVER_URL",
}

4
docker/nginx.conf
View File

@ -17,4 +17,8 @@ server {
location = /index.html { location = /index.html {
add_header 'Cache-Control' 'no-cache'; add_header 'Cache-Control' 'no-cache';
} }
location = /env.js {
add_header 'Cache-Control' 'no-cache';
}
} }

1
public/index.html
View File

@ -12,6 +12,7 @@
<meta name="theme-color" content="#1a1a1a" /> <meta name="theme-color" content="#1a1a1a" />
<link rel="icon" href="<%= BASE_URL %>icon.svg"> <link rel="icon" href="<%= BASE_URL %>icon.svg">
<link rel=manifest href="<%= BASE_URL %>manifest.webmanifest"> <link rel=manifest href="<%= BASE_URL %>manifest.webmanifest">
<script src="<%= BASE_URL %>env.js"></script>
<title></title> <title></title>
</head> </head>
<body> <body>

6
src/auth/Login.vue
View File

@ -5,7 +5,7 @@
<div style="font-size: 4rem; color: #fff;" class="text-center"> <div style="font-size: 4rem; color: #fff;" class="text-center">
<Icon icon="person-circle" /> <Icon icon="person-circle" />
</div> </div>
<b-form-group label="Server"> <b-form-group v-if="!config.serverUrl" label="Server">
<b-form-input v-model="server" name="server" type="text" :state="valid" /> <b-form-input v-model="server" name="server" type="text" :state="valid" />
</b-form-group> </b-form-group>
<b-form-group label="Username"> <b-form-group label="Username">
@ -28,6 +28,7 @@
</template>> </template>>
<script lang="ts"> <script lang="ts">
import Vue from 'vue' import Vue from 'vue'
import { config } from '@/shared/config'
export default Vue.extend({ export default Vue.extend({
props: { props: {
@ -47,7 +48,8 @@
computed: { computed: {
valid(): false | null { valid(): false | null {
return this.error == null ? null : false return this.error == null ? null : false
} },
config: () => config
}, },
async created() { async created() {
this.server = await this.$auth.server this.server = await this.$auth.server

7
src/auth/service.ts
View File

@ -1,5 +1,6 @@
import axios from 'axios' import axios from 'axios'
import { randomString, md5 } from '@/shared/utils' import { randomString, md5 } from '@/shared/utils'
import { config } from '@/shared/config'
export class AuthService { export class AuthService {
public server = ''; public server = '';
@ -9,14 +10,16 @@ export class AuthService {
private authenticated = false; private authenticated = false;
constructor() { constructor() {
this.server = localStorage.getItem('server') || '/api' this.server = config.serverUrl || localStorage.getItem('server') || ''
this.username = localStorage.getItem('username') || 'guest1' this.username = localStorage.getItem('username') || ''
this.salt = localStorage.getItem('salt') || '' this.salt = localStorage.getItem('salt') || ''
this.hash = localStorage.getItem('hash') || '' this.hash = localStorage.getItem('hash') || ''
} }
private saveSession() { private saveSession() {
if (!config.serverUrl) {
localStorage.setItem('server', this.server) localStorage.setItem('server', this.server)
}
localStorage.setItem('username', this.username) localStorage.setItem('username', this.username)
localStorage.setItem('salt', this.salt) localStorage.setItem('salt', this.salt)
localStorage.setItem('hash', this.hash) localStorage.setItem('hash', this.hash)

9
src/shared/config.ts Normal file
View File

@ -0,0 +1,9 @@
export interface Config {
serverUrl: string
}
const env = (window as any).env
export const config: Config = {
serverUrl: env?.SERVER_URL || '',
}