imfx77 / kanboard-plugin-Wysiwyg-MD-Editor

Integrates external MD editors into Kanboard in order to conveniently edit and preview the markdown textareas, as well as render the markdown fields in the Kanboard interface. Each editor may allow for different customizations of functionality, MD features, and UI themes. Rendering can parametrize theme, code highlight, and background transparency.
MIT License
3 stars 1 forks source link

StackEdit+ not loading #1

Closed e-labInnovations closed 6 months ago

e-labInnovations commented 6 months ago

Enabled both StackEdit+ and EasyMDE in the Wysiwyg MD Editor settings. But the StackEdit+ not loading and EasyMDE working as expected

image
imfx77 commented 6 months ago

At a glance, seems much of a connectivity problem.

As it is explained on the settings page of the plugin - the EasyMDE is an entirely offline js-based editor, while the StackEdit+ refers to an external online application.

EasyMDE will work even if you have no internet at all, provided that you can access your KB in some local network. It won't work only if you block JS in the browser. As for the Stackedit+, if you can't access the standalone app (as suggested in the repo readme) you won't be able to access the embedded KB editor either.

So, please, first check the StackEdit+ Online App, using the same machine and browser as when you try from within the KB. And if you experience the same problem - than you should revise your network, proxy, browser, extensions, adblockers, etc - to pinpoint the problem.

Otherwise, if the online app works but the embedded editor does not - you should provide me with info to reproduce the work context of your KB.

In either case, make sure to notify me, so to consider proceeding with the issue or closing it.

Regards

e-labInnovations commented 6 months ago

The Online App of StackEdit+ working, but the Kanboard integration have the loading issue here is console error

Refused to frame 'https://stackedit.net/' because it violates the following Content Security Policy directive: "default-src 'self'".
Note that 'frame-src' was not explicitly set, so 'default-src' is used as a fallback.
image
imfx77 commented 6 months ago

Hm, not an expert on CSPs, but looks like an explicit and intentional restriction with the web server that hosts your KB. I got KB as a docker img preconfigured with Nginx and never really bothered playing with the security. So I don't really know where to start digging from. But even if I knew the exacts server settings to reproduce that broken behavior I can pretty guess that it cannot be fixed/overridden/workarounded from within KB plugin 🤔

Anyway, I miss knowledge on the topic, it won't be a quick and easy one to resolve obviously. Any insights are welcomed.

e-labInnovations commented 6 months ago

Thank you, @imfx77 I also try to solve this issue Maybe adding a meta tag like

<meta http-equiv="Content-Security-Policy" content="default-src 'self'; frame-src 'self' https://stackedit.net/">

will solve this issue. Once it succeeds, I will ping you

imfx77 commented 6 months ago

Well, I educated myself a bit on the matter. From what I've read, it appears to me that CSP is all implemented clientside and each browser is responsible for that. I thought it is a serverside concept, isn't it?

Btw, what browser do you use? Any specific restrictions? I tested the plugin with FF, Edge, Safari (on Windows and Mac) and FF, Opera, Chrome, Samsung browser (on Android). That's quite a range of browsers and I was pretty sure I had everything covered. Yet, I didn't play with the security options.

Now, as far as I understand, in order to allow an iframe element to load from https://stackedit.net/ I need to place the meta tag you suggested in the iframe's parent page header.

Unfortunately, there is no specific page to do that atm. The StackEdit+ loads through JS script in the context of the current KB page which has a markdown editing area. It's all dynamic and I see no way to dynamically mangle the headers of all potential KB pages. Even if I could - it doesn't seem appropriate and righteous to extend their content policy. I will rather need to add a new wrapper html for the StackEdit+ that opens silently when the button is clicked and implicitly indirects to the editor.

So, it will be hard for you to try some fixes with the current impl. And I still have no notion how to to produce the problem - hence, no reliable way to test that whatever changes I introduce do actually solve it. This is what we need to understand in the first place - why does it happen at your side, so to force reproduce the bug at mine.

Or maybe alternatively, I could make a branch with some "blind and wishful" changes and let you test them?

imfx77 commented 6 months ago

@e-labInnovations

I eventually found a plugin at my side that DID override the default CSP rules of KB, thus allowing me to open anything within an iframe. When I commented out those overrides I was able to produce the problem you reported. And exactly the same override actually showed me how to fix it.

So, I just released an new v0.5.4. Not yet updated in the KB plugin directory, but you can download it from the repo Releases and try it out. Hopefully it fixes the problem for you.

Please, notify me back, and if everything is OK consider closing the issue 🙏

e-labInnovations commented 6 months ago

image

Thanks @imfx77 The new version working now But it shows this message

Due to insufficient subscriptions, the site is unsustainable. Please consider deploying your own version or using the Chinese edition. Our sincere apologies.

imfx77 commented 6 months ago

No idea what is that and why is that. Never saw such a message. Sounds like some weird country/region limitation 🙄 Does the app complain in the same way for you? Does the embedded editor work anyway? Cos' it doesn't seem like smth that is under my control ... 🤔