CORS question embedding Blogspot

AI-generated summary

CORS Issue with Blogspot Embedding

DonH is trying to embed a Blogspot blog into a Discourse forum but is facing CORS issues. They have enabled CORS in the App.yml file with DISCOURSE_ENABLE_CORS: true and set DISCOURSE_CORS_ORIGIN: '*', but the issue persists. The JavaScript console shows an error message indicating a blocked resource.

Falco suggests that the issue might be due to the incorrect replacement of {{url absolute="true"}} in the embedded script, and recommends limiting the code loading Discourse comments to only article pages.

Having see our newly embedded (same-domain) Ghost blog one of our members asked if it was possible to do the same with his at Blogspot. I’ve tried but can only get this far:

Allowed hosts are:

The embedded script is:

<script type="text/javascript">
DiscourseEmbed = { discourseUrl: 'https://forum.rosehybridizers.org/',
			     discourseEmbedUrl: '{{url absolute="true"}}' };
(with and without discourseReferrerPolicy: 'strict-origin-when-cross-origin'};)

(function() {
var d = document.createElement('script'); d.type = 'text/javascript'; d.async = true;
d.src = DiscourseEmbed.discourseUrl + 'javascripts/embed.js';
(document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(d);
</script>  

CORS is enabled through App.yml:

DISCOURSE_ENABLE_CORS: true

I also tried it with

DISCOURSE_CORS_ORIGIN: ‘*’

followed by app destroy/ start each time.

The allowed origin is:

These settings are both checked:

Enable Content-Security-Policy
and
Restrict who can embed this site in iframes via CSP.

Jscript console says

Any help would be greatly appreciated.

This is wrong, as the {{url absolute="true"}} is not replaced before the code is executed.

Also, you may want to limit the code loading the Discourse comments to only article pages and not the homepage.