n8n-io / discourse-n8n-wf

Discourse plugin for pretty rendering of n8n workflow code
5 stars 2 forks source link

No rendering observed #2

Closed mkllnk closed 3 months ago

mkllnk commented 5 months ago

Hello! And thank you for providing this plugin.

I posted some workflows on a Discourse instance:

The posts contain code blocks like this:

```json
{
  "name": "List producers",
  "nodes": [
    ...
  ]
}
```

I installed the plugin following the official documentation by adding it to the app config containers/app.yml:

## The docker manager plugin allows you to one-click upgrade Discourse
## http://discourse.example.com/admin/docker
hooks:
  after_code:
    - exec:
        cd: $home/plugins
        cmd:
          - mkdir -p plugins
          - git clone https://github.com/discourse/docker_manager.git
          - git clone https://github.com/discourse/discourse-voting.git
          - git clone https://github.com/n8n-io/discourse-n8n-wf.git

Then I rebuilt the app:

./launcher rebuild app

But my workflows are still displayed as simple json. There's one instruction I haven't followed yet:

Make sure you also whitelist the domain your iframes are calling in the admin settings of Discourse.

I was hoping to see error messages trying to access a domain and then find the setting to whitelist it but I'm not there yet. Any idea what's going on?

I'm currently running Discourse 3.3.0.beta2-dev.

christophdb commented 3 months ago

I had the same problem. No matter what I did, the workflow was not visible.

Here I found the solution: https://n8n-io.github.io/n8n-demo-webcomponent/

It seems that the following scripts are required for the visualization. Therefore, this has to be added to your theme. Also I observed, that you don't have to configure the n8n-core-url or the CORS settings. The preview is always generated from https://n8n-preview-service.internal.n8n.cloud/workflows/demo.

image

<script src="https://cdn.jsdelivr.net/npm/@webcomponents/webcomponentsjs@2.0.0/webcomponents-loader.js" nonce="rsCczmBzksGT99X0wedhkojLz"></script>
<script src="https://www.unpkg.com/lit@2.0.0-rc.2/polyfill-support.js" nonce="rsCczmBzksGT99X0wedhkojLz"></script>
<script type="module" src="https://cdn.jsdelivr.net/npm/@n8n_io/n8n-demo-component@latest/n8n-demo.bundled.js" nonce="rsCczmBzksGT99X0wedhkojLz"></script>
mkllnk commented 3 months ago

Thank you! That solved my problem.