Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Test page with description on how to test my pull request to the Calendar+ OwnCloud app.
<!DOCTYPE html>
<head>
<meta charset="utf-8" />
<title>OwnCloud Calendar+ CORS Test</title>
<script type="text/javascript">
var calendarICS = "###CALENDARICSURL###",
request = new XMLHttpRequest();
request.open('GET', calendarICS, true);
request.onload = function() {
if (request.status >= 200 && request.status < 400) {
var resp = request.responseText;
console.log(resp);
} else {
console.log('Server returned error.');
}
};
request.onerror = function() {
console.log('Connection error.');
};
request.send();
</script>
</head>
<body>
<h1>OwnCloud Calendar+ CORS Test</h1>
<h2>1. Install Owncloud (locally, or on a dev server)</h2>
<p>Install the latest version of OwnCloud from the 8.1.* tree. Tested with OwnCloud <strong>8.1.3</strong>! Also install the Calendar+ app version 1.1.*.</p>
<p>Won't work with latest master or 8.2.* version because sharing a calendar is broken :-/</p>
<h2>2. Upload this file to a different domain</h2>
<p>Copy this file to a web space you have access to. This web space should be accessed by a domain different from your OwnCloud.</p>
<p>For example, my development installation of OwnCloud resides on my local machine: <code>owncloud.local</code>. I uploaded the <code>cors-test.html</code> file to a remote web server (on <a href="https://uberspace.de/">Uberspace</a>) <code>foo.bar.uberspace.de/cors-test.html</code>.</p>
<p>This is important because if this file and your OwnCloud are not on different domains, the <a href="https://en.wikipedia.org/wiki/Same-origin_policy">Same-origin policy</a> does not prevent the loading of the .ics file.</p>
<h2>3. Create Shared Calendar</h2>
<ol>
<li>In your OwnCloud, open the Calendar+ app and create a new calendar, e.g. called <code>cors-test</code>.</li>
<li>Click on the <code>Share calendar</code> icon in the left sidebar, just next to the calendar name.</li>
<li>In the right-hand sidebar, check <code>Share link</code>, and copy the link URL from the input field that appears. It should look something like this <code>http://your.owncloud.tld/index.php/apps/calendarplus/s/QQpPqaSW1l6PZYf</code></li>
<li>Open the link in a new tab. It should show a full calendar view of the calendar you just selected for sharing.</li>
<li>Right-click on the <code>Subscribe</code> button on the top and copy its URL (e.g. <code>http://your.owncloud.tld/index.php/apps/calendarplus/exporteventscalendar?t=QQpPqaSW1l6PZYf</code>). You will need to insert it into this file.</li>
<li>(Optional) Download the file (named e.g. <code>cors-test.ics</code>) from this last URL, either by opening it in a new tab, or using <code>wget</code> or a similar tool.</li>
<li>Edit the JavaScript in the <code>head</code> section of this page by replacing <code>###CALENDARICSURL###</code> with the URL you just downloaded.</li>
</ol>
<h2>4. Reload This Page</h2>
<ol>
<li>Open the developer tools of your browser (Chrome dev tools, or Firebug in Firefox), select the <code>Console</code> view, and reload this page</li>
<li>What you should see (Chrome):
<pre>XMLHttpRequest cannot load http://owncloud.local/. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access.
cors-test.html:1</pre>
<pre>Connection error. cors-test.html:17</pre>
</li>
<li>Now apply the PR, adding the <code>@CORS</code> annotation to the <code>exportEvents()</code> method in <code>calendarplus/controller/exportcontroller.php</code>, and you should see:
<pre>BEGIN:VCALENDAR
VERSION:2.0
PRODID:ownCloud Calendar 1.1.1
X-WR-CALNAME:cors-test
END:VCALENDAR</pre>
</li>
</ol>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment