feat: Add browser connectivity check

Signed-off-by: Julius Härtl <jus@bitgrid.net>

lib/Controller/SettingsController.php

@@ -64,8 +64,6 @@ class SettingsController extends Controller {
 		parent::__construct($appName, $request);
 	}
 
-	#[PublicPage]
-	#[NoCSRFRequired]
 	public function checkSettings(): DataResponse {
 		try {
 			$output = new NullOutput();
@@ -76,7 +74,6 @@ class SettingsController extends Controller {
 			return new DataResponse([
 				'status' => $e->getCode(),
 				'data' => [
-					// FIXME ONLY AS ADMIN
 					'message' => 'Failed to connect to the remote server: ' . $e->getMessage(),
 					'settings' => $this->getSettingsData(),
 				],

lib/Listener/AddContentSecurityPolicyListener.php

@@ -59,6 +59,10 @@ class AddContentSecurityPolicyListener implements IEventListener {
 			$policy->addAllowedImageDomain($url);
 		}
 
+		if ($this->isSettingsPage()) {
+			$policy->addAllowedConnectDomain("*");
+		}
+
 		$event->addPolicy($policy);
 	}
 
@@ -66,4 +70,8 @@ class AddContentSecurityPolicyListener implements IEventListener {
 		$scriptNameParts = explode('/', $this->request->getScriptName());
 		return end($scriptNameParts) === 'index.php';
 	}
+
+	private function isSettingsPage(): bool {
+		return str_starts_with($this->request->getPathInfo(), '/settings/admin/richdocuments');
+	}
 }

src/components/AdminSettings.vue

@@ -51,6 +51,13 @@
 				<NcNoteCard v-else-if="serverError == 3" type="error">
 					<p>{{ t('richdocuments', 'Collabora Online should use the same protocol as the server installation.') }}</p>
 				</NcNoteCard>
+				<NcNoteCard v-else-if="serverError == 4" type="error">
+					<p>
+						{{ t('richdocuments', 'Your browser has been unable to connect to the Collabora server:') }}
+						{{ settings.public_wopi_url }}
+					</p>
+					<p>{{ t('richdocuments', 'This URL is determined on the Collabora server either from the configured URL or the server_name parameter in coolwsd.xml.') }}</p>
+				</NcNoteCard>
 				<NcNoteCard v-else type="success">
 					<p>{{ t('richdocuments', 'Collabora Online server is reachable.') }}</p>
 					<p>{{ settings.product_name }} {{ settings.product_version }} {{ settings.product_hash }}</p>
@@ -422,6 +429,8 @@ const SERVER_STATE_OK = 0
 const SERVER_STATE_LOADING = 1
 const SERVER_STATE_CONNECTION_ERROR = 2
 const PROTOCOL_MISMATCH = 3
+const SERVER_STATE_BROWSER_CONNECTION_ERROR = 4
+
 const fontMimes = [
 	'font/ttf',
 	'application/font-sfnt',
@@ -609,6 +618,16 @@ export default {
 			for (const settingKey in settings) {
 				this.settings[settingKey] = settings[settingKey]
 			}
+			this.checkFrontend()
+		},
+		async checkFrontend() {
+			try {
+				await fetch(this.settings.public_wopi_url + '/hosting/discovery', { mode: 'no-cors' })
+				await fetch(this.settings.public_wopi_url + '/hosting/capabilities', { mode: 'no-cors' })
+			} catch (e) {
+				console.error(e)
+				this.serverError = SERVER_STATE_BROWSER_CONNECTION_ERROR
+			}
 		},
 		async fetchDemoServers() {
 			try {
@@ -712,6 +731,8 @@ export default {
 					this.settings[settingKey] = settings[settingKey]
 				}
 
+				this.checkFrontend()
+
 				return result
 			} catch (e) {
 				this.updating = false

src/view/Office.vue

@@ -171,7 +171,7 @@ export default {
 	},
 	computed: {
 		showIframe() {
-			return this.loading >= LOADING_STATE.FRAME_READY
+			return this.loading >= LOADING_STATE.FRAME_READY || this.debug
 		},
 		showLoadingIndicator() {
 			return this.loading < LOADING_STATE.FRAME_READY

tests/lib/Listener/AddContentSecurityPolicyListenerTest.php

@@ -65,6 +65,9 @@ class AddContentSecurityPolicyListenerTest extends TestCase {
 		$this->overwriteService(FederationService::class, $this->federationService);
 
 		$this->request = $this->createMock(IRequest::class);
+		$this->request->method('getPathInfo')
+			->willReturn('/apps/files');
+
 		$this->config = $this->getMockBuilder(AppConfig::class)
 			->setConstructorArgs([
 				$this->createMock(IConfig::class),