When working on Nextcloud connector for Afterlogic WebMail to make it compatible with Nextcloud version 19, we considered a complete rewrite of the application. What we couldn't find was a really basic "Hello world" kind of application we could start from. And to make things work, we had to create such an application ourselves. Now that the application is released, we thought it may be worth sharing such a sample with the community, for those interested in making their apps for Nextcloud.
To start working on the application, we need to create a subdirectory under apps dir of Nextcloud installation, directory name must match app ID, and in our case, it's going to be sample.
At the very least, application directory needs to contain the following subdirectories:
appinfostores meta information about the app and core information on application structure;imgwill hold the application icon;libis where main code of the application resides;templatesstores files in charge of visual look of the application.
Let's assume you're willing to embed some external application (probably running on the same server) into Nextcloud. You can do so with a minimal modification of this sample. Replace templates/index.php file content with the following:
<iframe id="appcon" style="border: none; width: 100%; height: 100%; position: absolute; top: 0px; left: 0px; right: 0px; bottom: 0px;" tabindex="-1" frameborder="0" src="http://localhost/external-app/"></iframe> This code provides an IFrame container for placing the external application into it.
By default, Content Security Policy used by Nextcloud will block such an external content. To allow for the content, modify lib/Controller/PageController.php file, adding the use of ContentSecurityPolicy class:
use OCP\AppFramework\Http\ContentSecurityPolicy;As for index() method, you'll need something like this:
public function index() {
$oTemplate = new TemplateResponse('sample', 'index');
$oCsp = new ContentSecurityPolicy();
$oCsp->addAllowedFrameDomain("localhost");
$oTemplate->setContentSecurityPolicy($oCsp);
return $oTemplate;
}Hope you find this sample useful for your needs. If you have any comments or suggestions, please feel free to post them at the issue tracker.