Dieser Artikel stellt vor, wie man die ownCloud-Anmeldeseite und freigegebene URL-(Share-URL-)Seiten mit einem coolen Theme anpasst.
Jeder liebt ownCloud. Während ich am ownCloud-Quellcode herumbastelte, machte ich verschiedene Entdeckungen, und unter ihnen habe ich versucht, die Anmeldeseite anzupassen, was praktischen Nutzen zu haben scheint (?).
Nun lassen Sie uns zur spezifischen Methode kommen. Ich habe nicht viel geändert, also sollte es in Ordnung sein, aber bitte tun Sie dies auf eigene Verantwortung, da es Sicherheitslücken schaffen könnte.
Los geht’s
Zuerst möchten wir eine Vorlage zum Ändern, also installieren Sie eines der Plugins Wallpaper app | ownCloud Marketplace.
Dann SSH zum Server und bestätigen Sie, dass der Ordner existiert.
ls ~/shit.xsrv.jp/public_html/owncloud/apps/wallpaper/
Dann bearbeiten Sie die Datei mit rmate ~/shit.xsrv.jp/public_html/owncloud/apps/wallpaper/appinfo/app.php.
Der Code, den ich umgeschrieben habe, ist wie folgt:
<?php
if (\OC::$server->getUserSession()->isLoggedIn() !== true
&& strpos(\OC::$server->getRequest()->getRequestUri(), '/login') !== false) {
\OCP\Util::addStyle('wallpaper', 'login');
\OCP\Util::addScript('wallpaper', 'login');
$manager = \OC::$server->getContentSecurityPolicyManager();
$policy = new \OC\Security\CSP\ContentSecurityPolicy();
$policy->addAllowedImageDomain('source.unsplash.com');
$policy->addAllowedImageDomain('images.unsplash.com');
$policy->addAllowedImageDomain('yuis.xsrv.jp');
$manager->addDefaultPolicy($policy);
}
if (\OC::$server->getUserSession()->isLoggedIn() !== true
&& strpos(\OC::$server->getRequest()->getRequestUri(), '/s') !== false) {
\OCP\Util::addStyle('wallpaper', 'login');
\OCP\Util::addScript('wallpaper', 'login');
$manager = \OC::$server->getContentSecurityPolicyManager();
$policy = new \OC\Security\CSP\ContentSecurityPolicy();
$policy->addAllowedImageDomain('source.unsplash.com');
$policy->addAllowedImageDomain('images.unsplash.com');
$policy->addAllowedImageDomain('yuis.xsrv.jp');
$manager->addDefaultPolicy($policy);
}
Die wichtigsten Punkte sind:
\OCP\Util::addScript(‘wallpaper’, ‘login’); lädt ./js/login.js für URLs, die /login entsprechen, und
$policy->addAllowedImageDomain(‘yuis.xsrv.jp’); erlaubt das Laden von Bildern von diesem Server.
Platzieren Sie Ihre Lieblingsbilder auf Ihrem eigenen Server und verlinken Sie sie in CSS, aber wenn sie nicht durch diesen Code erlaubt sind, erhalten Sie einen Fehler auf der Client-Seite.
Navigation and Pre-App configuration — ownCloud Developer Manual 9.0 documentation
Also, zuerst das CSS.
Mit rmate ~/shit.xsrv.jp/public_html/owncloud/apps/wallpaper/css/login.css, verwenden Sie das Folgende als Referenz:
body {
/* background-image: url('https://source.unsplash.com/1600x900/?nature,water') !important; */
/* background-image: url('https://hdqwalls.com/download/anime-girl-in-girls-frontline-ga-1600x900.jpg') !important; */
background-image: url('https://yuis.xsrv.jp/data/6ceJfI2hvdbFFGudVpAX2A6jE5Ubb2Dw.jpg') !important;
background-size: cover !important;
}
#body-login .wrapper {
min-height: 100%;
margin: 0 auto -70px;
width: 300px;
opacity: 0.3 !important;
}
#body-login p.info {
margin: 0 auto;
padding-top: 20px;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
opacity: 0.7 !important;
}
Als nächstes, für JS mit rmate ~/shit.xsrv.jp/public_html/owncloud/apps/wallpaper/js/login.js, verwenden Sie den folgenden Code:
$(document).ready(function(){
// document.querySelector('#body-login > footer > p').remove()
document.querySelector('#body-login > footer > p').innerHTML = `If any problem about our shared files please contact us at <strong>[https://114514.click/homepage](https://114514.click/homepage)</strong>`
});
Das war’s.
Dies wendet CSS und JS auf die Anmeldeseite und Share-URL-Seiten an, was zu einem coolen Anmeldebildschirm wie im obigen Bild führt.
Beachten Sie auch, dass nach diesem Vorgang Fehler oder Warnungen in ownCloud angezeigt werden. Aus Sicherheits- und Schwachstellenperspektive empfehle ich, solche groben Dinge nicht auf Systemen zu tun, bei denen Sicherheit erforderlich ist.