search

freakdesign / shopify-custom-fields

A javascript tool to emulate Custom Fields within the Shopify dashboard.
http://freakdesign.com.au/pages/shopify-custom-fields
132 stars 24 forks source link

Safari bookmarklet problems #23

Open colinbrogan opened 9 years ago

colinbrogan commented 9 years ago

Hi, the bookmarklet for this, which I have been using for 5 months successfully, today stopped working giving the following problem:

Refused to load the script 'https://freakdesign-us.s3.amazonaws.com/shopify/custom_fields/beta/freakdesign_custom_fields_beta.js' because it violates the following Content Security Policy directive: "script-src https://cdn.shopify.com https://js-agent.newrelic.com https://bam.nr-data.net https://dme0ih8comzn4.cloudfront.net https://device.maxmind.com https://api.stripe.com https://mpsnare.iesnare.com https://connect.facebook.net https://www.googleadservices.com https://platform.twitter.com https://stats.g.doubleclick.net https://www.google-analytics.com https://s3.amazonaws.com https://visitors.shopify.com https://s.adroll.com https://d.adroll.com 'self' 'unsafe-inline' 'unsafe-eval'".

It appears that Shopify has changed their Content Security Policy to reject third-party servers on the dashboard. I was able to fix this by uploading freakdesign_custom_fields.load.js and freakdesign_custom_fields.min.js to "Files" in shopify, changing out the links in the former file to the new server http://cdn.shopify, preventing this cross-domain error. I thought I would post it here in case anyone else runs into this.

Also, the google chrome extension was uneffected.

On a second note, any chance, Jason, you can release the unminified source javascript for this project? I would love to branch and make some tweaks, including some of the feature requests mentioned on the issue tracker.

Thanks, -Colin

philschoefer commented 8 years ago

This also happens in Firefox. Thanks Colin for sharing your approach. I would also love to see an unminified version of it.

philschoefer commented 8 years ago

For anybody who has a hard time putting that bookmarklet together... here the bookmarklet for my shopify:

javascript:(function()%7Bvar%20gaJs%20=%20document.createElement(%22script%22);gaJs.type%20=%20%22text%2Fjavascript%22;gaJs.src%20=%20%22https%3A%2F%2Fcdn.shopify.com%2Fs%2Ffiles%2F1%2F7381%2F0541%2Ffiles%2Ffreakdesign_custom_fields.min.js%3F7916606269471937657%22;document.getElementsByTagName(%22head%22)%5B0%5D.appendChild(gaJs);%7D)();

You will want to replace 7916616269471937657 and the filepath depending on your Shopify installation. %2F stands for a forward slash.

https%3A%2F%2Fcdn.shopify.com%2Fs%2Ffiles%2F1%2F7381%2F0541%2Ffiles%2Ffreakdesign_custom_fields.min.js%3F7916606269471937657

equals

https://cdn.shopify.com/s/files/1/7381/0541/files/freakdesign_custom_fields.min.js?7916606269471937657

Here a nice online tool that can help you to encode your filepath: http://meyerweb.com/eric/tools/dencoder/

I changed the values of this script, the ones above are not valid, but the way the bookmarklet is assembled is correct.

freakdesign commented 8 years ago

The above is concise and well explained. Much appreciated @perspektiveweb Why the addition of the querystring? Merely to add a basic cache busting in?

philschoefer commented 8 years ago

Good point. That's unnecessary and should be removed.

It's about the number after the file name and question mark. Both should be removed to allow for caching. Thanks Jason.

Sent from my iPhone

On Jul 11, 2016, at 21:26, Jason Bowman notifications@github.com wrote:

The above is concise and well explained. Much appreciated @perspektiveweb Why the addition of the querystring? Merely to add a basic cache busting in?

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub, or mute the thread.