plugin-copy-clipboard loading from external cloudflare

Hi @worldsdream, glad to help.

1) “Do you know why the plugin is going externally to grab the clipboard.min.js?”

Normally it does not. Looking at the file path you share, it seems like some sort of cache plugin is involved.

2) “Is there a reason why we have the above plugin-copy-clipboard.js loaded from our website and another one from cloudflare?”

Again, normally the plugin loads its own resources directly from its own directory. In your example shows /cache/ in the file path, so it seems the site is using some sort of cache plugin.

3) “If we need to have the clipboard.min.js. Is it not a better option to load it from our website then going externally for that?”

Yes, in general always is optimal to use scripts that are included in WP core. In this case however, the two “clipboard” scripts are not the same. The one included in the plugin specifically is written for Prism.js.

I hope this helps. Let me know if I can provide any further infos, etc. Thank you, @worldsdream.

Hi Jeff,

Thank you for the help.

I did some troubleshooting on a clean install with the default theme and only the plugin prismatic installed.

The Cloudflare external file shows up when you enable “Copy to clipboard” in the Prismatic plugin settings.

I am sure that you can reproduce it and confirm.

Can you please look into that and don’t load the https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/2.0.0/clipboard.min.js, because we already have the wp-content/plugins/prismatic/lib/prism/js/plugin-copy-clipboard.js?

Screenshot: https://i.imgur.com/L8QXh6u.png

I hope this helped you. Let me know if you need more information.

Extra: I can see that in the prismatic/lib/prism/js/plugin-copy-clipboard.js file shows the Cloudflare URL:

!function(){if("undefined"!=typeof self&&self.Prism&&self.document)if(Prism.plugins.toolbar){var c=window.ClipboardJS||void 0;c||"function"!=typeof require||(c=require("clipboard"));var u=[];if(!c){var t=document.createElement("script"),o=document.querySelector("head");t.onload=function(){if(c=window.ClipboardJS)for(;u.length;)u.pop()()},t.src="https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/2.0.0/clipboard.min.js",o.appendChild(t)}Prism.plugins.toolbar.registerButton("copy-to-clipboard",function(t){var o=t.element,e=function(t){var o={copy:"Copy","copy-error":"Press Ctrl+C to copy","copy-success":"Copied!","copy-timeout":5e3};for(var e in o){for(var n="data-prismjs-"+e,r=t;r&&!r.hasAttribute(n);)r=r.parentElement;r&&(o[e]=r.getAttribute(n))}return o}(o),n=document.createElement("button");return n.textContent=e.copy,n.setAttribute("type","button"),c?r():u.push(r),n;function r(){var t=new c(n,{text:function(){return o.textContent}});t.on("success",function(){n.textContent=e["copy-success"],i()}),t.on("error",function(){n.textContent=e["copy-error"],i()})}function i(){setTimeout(function(){n.textContent=e.copy},e["copy-timeout"])}})}else console.warn("Copy to Clipboard plugin loaded before Toolbar plugin.")}();

I believe it’s better to have it load (if we need it) from our website than to have a JS being called from Cloudflare.

• This reply was modified 3 years, 1 month ago by worldsdream.

I am testing on default WordPress and this is the path that is used to include the Prism clipboard script:

https://example.com/wp-content/plugins/prismatic/lib/prism/js/plugin-copy-clipboard.js?ver=2.9.1

There is no “cloudflare” anything in any of my plugins. I do not use the service, ever for anything literally anywhere. If in doubt, search the plugin source code, there you will find zero instances of anything with the term “cloudflare” in it.

Please look into that JS you mentioned. You will see the Cloudflare link.

I also edited my original post.

See screenshot:

View post on imgur.com

Okay I am seeing what you are seeing now, it looks like the clipboard script does make reference to this URL:

https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/2.0.0/clipboard.min.js

However, that is not something that I have control over. The plugin simply includes the Prism clipboard script, it does not and can not make any changes to it. So that means if you enable the clipboard script in the plugin settings, the plugin will load the script provided from Prism website; the path looks like this:

https://example.com/wp-content/plugins/prismatic/lib/prism/js/plugin-copy-clipboard.js?ver=2.9.1

Then that script in turn loads the cloudflare version of the actual clipboard script.

• This reply was modified 3 years, 1 month ago by Jeff Starr.
• This reply was modified 3 years, 1 month ago by Jeff Starr.

Thanks, Jeff.

I didn’t like to have an external request going to Cloudflare, and I thought maybe you could create the JS file into the plugin, so we don’t have an external request to Cloudflare.

But, it seems we have to live with this.

Thanks.

I can take a look at it, and if feasible try to implement a standalone script so that cloudflare is not needed for anything. Honestly I did not realize that the script was doing that, so I definitely appreciate you bringing it to my attention. Thank you, @worldsdream.

Thanks for looking at it.

You’re welcome, Jeff!

Thank you for the great support and keeping the plugin up to date!

clipboard.js – dependency for plugin-copy-clipboard.js
you can enqueue clipboard.min.js before plugin-copy-clipboard.js and it will not be loaded from CDN

add_action( 'wp_enqueue_scripts', 'enqueue_clipboard_js', 0 );
function enqueue_clipboard_js(){
  wp_enqueue_script( 'clipboard-js', get_template_directory_uri() . '/js/clipboard.min.js' );
}

Thanks for sharing @webdezy ??

And also clipboard.js is included in the core of WordPress.
wp_enqueue_script( 'clipboard' );

Thanks @webdezy.

Hopefully @specialk will adjust this in the next update. I don’t think we need an external request for this.

If it is feasible, yes it should be possible.

Just to be clear, is this clipboard script:

https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/2.0.0/clipboard.min.js

..the same as the one included in WordPress core via:

wp_enqueue_script( 'clipboard' );

Yes, it’s the same

Thumbs up emoji