daybrush / moveable

Moveable! Draggable! Resizable! Scalable! Rotatable! Warpable! Pinchable! Groupable! Snappable!
https://daybrush.com/moveable/
MIT License
10.08k stars 618 forks source link

nonce attribute support #279

Closed ghost closed 3 years ago

ghost commented 4 years ago

Hello. Thank you for this great project.

I'm setting the nonce attribute on the style element in CSP. moveable is When you create your own style element in your program, you can use the optional nonce attribute It would be very helpful to reflect the

We thought this option was not a waste of time and suggested it. I know you are busy, but I hope you will consider it.

daybrush commented 4 years ago

@plotpoi Are you saying this?

<style data-styled-id="rCSD1534">...</style>
<div class="moveable" data-style-id="rCSD1534"></div>
ghost commented 4 years ago

When the first instance of a moveable is created, a style element is created under the head element.

<head>
<style>.rCS2a3loo{...}</style>
</head>

I want to set the nonce attribute to that style element.

<head>
<style nonce="hoge">.rCS2a3loo{...}</style>
</head>
daybrush commented 4 years ago

@plotpoi

Do you need an api that specifies a nonce value?

I don't think I can read the header. How can I put nonce value?

ghost commented 4 years ago

If you have nonce set to style in CSP, moveable fails to insert the style element, which was necessary for me.

It's easy to set up, but now that there is no option, this problem can only be solved by rewriting the js content directly.

var o=document.createElement("style");
o.setAttribute("nonce", "hoge");

I thought it would be useful to simply specify the "hoge" part as an option, so I suggested it. It's not a must, so if someone else has the same problem, please consider it. I would be happy to do so.

daybrush commented 4 years ago

@plotpoi

moveable's new version is released. cspNonce prop is added.