Kirby 3 as Headless CMS for Vue/Nuxt


Please note that KirbyText is just an extension of Markdown, which is an extension of HTML. Which means: KirbyText may as well contain HTML. Therefore you need to strip all HTML tags from the KirbyText on the client side or you might as well parse KirbyText on the backend. However stripping HTML may not mitigate all attacks (like XSS in a link tag).

My recommendation is to only load resources from trusted sources anyway, then you won‘t need all that complex and potentially still not 100 % secure client logic.



I do get your point, but really, there is some ingrown historic (and probably irrational) fear of sending HTML over any api.

I’d rather limit my users to use kirbytext only and I work to extend as required.



I keep getting a CORS error

Access to XML:HttpRequest at 'http://localhost:888/api/pages/test' 
from origin 'http://localhost:8080' has been blocked by CORS policy: 
Response to preflight request doesn't pass access control check: 
No 'Access-Control-Allow-Origin' header is present on the 
requested resource.

If I connect with Postman, it works fine, though.

Does anyone have the same issue? Or any idea on how to fix that?

And before that I even get a 404 on the api page… Even though it is definitely there…

I’m a big fan of the new API feature but with Kirby 2 I built I own api routes through the templates and that worked much easier somehow.

Thanks a lot!



You can use the nuxt proxy module to get around this.

As an example for your case, you might configure the proxy from /kirby to http://localhost:888/api/. That way your server will pass the apis to the kirby backend transparently and you won’t have cors issues.

Let me know if you need some more details.



Regarding parsing of Kirbytext, I think the following OPTION would be amazing to have:

const requestConfig = {
  auth: {
  username: XXX,
  password: XXX,
  params: { select: 'files, content', parse: 'fieldA', 'fieldC', 'introtext', 'whateveryouwant' },

You’d basically be able to tell Kirby which fields to parse before answering the API call.
No idea how complicated it would be though.