Vue.js での Discourse コメント

Vue.js を使用した Web サイトと、Discourse のフォーラムを持っています。フォーラムのコメントを Vue.js サイトの特定のページに連携させるため、テンプレートファイルに JavaScript を挿入しようとしています。しかし、以下のエラーが発生します。

Templates should only be responsible for mapping the state to the UI. 
Avoid placing tags with side-effects in your templates, such as <script>,
as they will not be parsed.

text/javascriptapplication/javascript に変更しようとしましたが、レンダリング時に以下のエラーが表示されます。

 - invalid expression: missing ) after argument list in

" \n  DiscourseEmbed = { discourseUrl: 'https://forum.epicseven.ru/',\n                     
discourseEmbedUrl: '"+_s(url absolute="true")+\"' };\n\n  (function() {\n    
var d = document.createElement('script'); d.type = 
'application/javascript'; d.async = true;\n    d.src = 
DiscourseEmbed.discourseUrl + 'javascripts/embed.js';\n    
(document.getElementsByTagName('head')[0] || 
document.getElementsByTagName('body')[0]).appendChild(d);\n  })();\n"

  Raw expression: DiscourseEmbed = { discourseUrl: 
'https://forum.epicseven.ru/',
                 discourseEmbedUrl: '{{url absolute="true"}}' };

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

私の理解では、Vue.js での JS ファイルの使用は、呼び出し元のドメインからのみ許可されています。しかし、私のフォーラムはサブドメインに設定されています。

このエラーを修正するにはどうすればよいでしょうか?もしかしたら、コードの異なる部分を使用する必要があるかもしれません。

The embedding code we provide is meant for static sites, not client side rendered (SPAs) like Vue/React/Ember/Angular.

You will have to look into another method of obtaining the data from Discourse. We do offer a full API but you might have to proxy it through your own server to avoid cross domain requests.

「いいね!」 3

シングルページアプリケーションの場合、いくつかの試行錯誤を経て、以下の解決策が見つかりました。

このトピックは、最後の返信から30日後に自動的にクローズされました。新しい返信は許可されていません。