Cloudflare - PHP and Javascript Includes not Working - javascript

Since implementing Cloudflare some of my includes aren't working.
One specific example: Inside the includes folder, I have a sub folder "texter". Here I have a php page that references a Javascript library in the same folder. The page receives a GET request with variables, then parses on the parameters to an external 3rd party API.
When Cloudflare is disabled/paused the mini app works.
I'm using Page Rules to disable Cloudflare activity for my includes folder but it's still not working.
e.g. Pattern: *mysite.com/includes/* - With all rules and chache set to disabled.
How can I get my web app running while Cloudflare is also running? Am I on the right track? Thanks in advance.
Edit: I'm using htaccess to limit direct access to these directories... could this cause an issue?

Hmmm...this goes away with us paused? Do you have something like Rocket Loader turned on in your performance settings (can potentially impact jQuery or JavaScript).
Do any error messages appear at all?

Related

control reload of 3rd party javascript

We are developing a third party java script file that is implemented as a widget on many sites (That we do not control the code of).
This script may be updated from time to time (As we modify it/ add abilities/ fix bug ...)
As the browser saves most js files in cache, we need to have some sort of solution to tell the browser to reload the Script. of course a naive solution is to make re-load always, but this solution is not very efficient, and code changes should not accrue often.
Any idea how this can be done?
The solution of changing our script src/url with "?version=1.1.1" cannot be applied here as this widget is third party and we do not have any control on clients website codes.
Thanks.
Since you are the 3rd party and are giving your clients a link to the javascript file they need to include, have them point at your javascript with a url like this:
http://example.com/file.js
Then use a redirect on your server (Url Rewrite/htaccess etc) to point them to the latest version of that file. Lets say you versioned your script by putting it into a folder and your latest version was 1.3. You would setup the redirect from http://example.com/file.js to http://example.com/1.3/file.js. Then every time you release a new version, update your redirect to point to the new folder.
EDIT: More detailed explanation

Trick a browser into loading <script> or <link rel="stylesheet"> URLs from local setup/server?

I'm debugging a CSS/JS problem on a live website, and in this situation it is unfeasible to clone the entire production system onto a local machine to fiddle with 2 lines of code.
I would LOVE it if there were a simple way to trick a browser (FF, Chrome, anything - I'm not fussy) into loading the live site but redirecting certain internal URLs to a local webserver. Any ideas?
eg. I want to load the entire live website, except one specific Javascript file. The attempt to access http://...production.../js/map.js should be rerouted to http://localhost/debug/js/map.js, which I can edit locally until the problem is fixed.
Edit re-read your issue, if you aren't happy to find/edit the SQL database for the file in question, you could always just add an adblock rule against it, and manually run your own script from console/greasemonkey it in.
Answer to question in the title:
HTML5 has a feature called an "application cache" just for this. It involves adding a manifest attribute to your <html> tag.
<html manifest="what_to_cache.appcache">
Then in what_to_cache.appcache,
CACHE MANIFEST
http://...production.../js/map.js
Future requests of items listed in the manifest will thereafter be loaded from the cache, if available, even if the user is offline. The file is stored in an SQL database for that website, so you can thereafter edit the database.
You can do this with fiddler.
Use the AutoResponder to intercept URLs and return content from local file or different server.
http://fiddler2.com/
I have found a Chrome extension which, despite its bugs, achieves precisely this behaviour. DevTools Redirect: https://chrome.google.com/webstore/detail/devtools-redirect/jmhdebkkippcccflcoddckhjjfgnfhnp
This allows developers to specify JS or CSS files to redirect, and a new URL to grab them from (eg. http://localhost/.../debug.js).
For future readers I would like to answer this question. Have a look at
Requestly - A Chrome Extension to modify Network Requests.
You can setup a Redirect Rule Request following these steps:
Select Redirect Request Rule Type
Create a new Redirect Rule
Disclaimer: I have created this So you can blame me if you do not find this helpful :)

Block JS from loading on certain domains

I have a web service that works through giving users javascript to embed in their code. Users can also place that code on other sites to make it work there. However I also need to allow users to create a blacklist of sites that the JS should not function on. For example, a competitor or an inappropriate site.
Is there a way to check where our JS files are being loaded from, and block loading or break functionality on a per account basis?
Edit: The javascript loads an iframe on the site, so another solution would be to somehow block certain domains from loading an iframe from our server, or serve different content to that iframe
Edit 2: We're also trying to avoid doing this from with the JS because it could be downloaded and modified to get pass the block
Inspecting the url of the page
Yes, the javascript file, when it starts executing, can inspect window.url and see if the url of the main document is ok.
To see where the script was loaded from
It can also go through the dom, looking for the script node which brought in the javascript file itself and see from where the JS was loaded.
However
Anyone can load the javascript into a text editor, then change it to eliminate the tests, then host the modified JS on their own server. Obfuscating or minimizing the JS can slow someone down but obscurity is not security.
One thing you could do is have the javascript load another javascript file. That you serve from the server at a given url. The trick here is that that url will not go to a file but to a server end point that will return a javascript file. The you have that endpoint check for the routes for that user and decide if it will return the javascript you want to work or an error javascript of some kind.
This blog shows how to do it in php.dynamic-javascript-with-php

IE Restrict JavaScript third party domain access other than *.currentwebsite.com

It is possible to disable JS at all.
It is possible to disable JS on certain domains by adding them to Restricted Zone for example.
I wonder if it is possible to block/restrict third party domain access other than *.currentwebsite.com for enabled JS in IE.
This could be somehow useful in ad blocking as well as security.
Or am I supposed to write an add-on myself?
I don t know is it possible or not but it is definitely a bad idea as CDNs are highly popular these days and most of the page use these for CSS and JS file as well as image file.
To block ads you can also use hosts file (under system32\drivers\etc folder) if you have the list of the URLs (I am pretty sure you can find a list at the internet) just redirect them some fake address like localhost or a server response nothing.

Liferay 6.0.6 / JBOSS - How can I edit JavaScript in a portlet without constantly re-deploying?

I'm trying to fix a tricky JavaScript issue in a Liferay portlet (that also happens to run a large Flex app) and every time I make a change, I have to go back to the prompt and do an "ant deploy" on the portlet, then wait for it to deploy, then reload the page, then wait for the Flex app to load. Every time I try any minor change it takes 3-4 minutes for this whole process.
Is there a configuration or setting that will uncompress the JavaScript and allow me to directly edit the JS files on the server without re-deploying every time? I've read up some on "Developer Mode" but it doesn't seem to be working, and all the Liferay docs seem specific to Tomcat whereas I'm using JBoss.
If you are deploying a war file, just explode it in place (in the jboss deploy directory), so rather than having one compressed file called FlexPort.war, you would have a directory called FlexPort.war which would have all the exploded content from the original WAR file.
If you update JavaScript files, you might need to clear your cache in the browser, but otherwise it should take effect right away. If you update classes, you can cause a fast re-deploy by touch-ing the WAR/web-inf/web.xml file.
===========================================================
Not sure why you're not seeing the JS update, but try reproducing this sequence. It helps to have some browser tool like Firebug or Fiddler installed so you can see the response headers.
Retrieve the JS file directly into your browser. e.g. http://localhost:8080/js/admin/jquery-ui-1.8.12.custom.min.js
Make note of the Last-Modified response header.
Modify the JS file and save. (Make sure the filesystem timestamp of the file has changed)
Retrieve the JS file again. The Last-Modified response header should be incremented to the same value as the timestamp as the filesystem timestamp.
Make sure the HTTP response code is 200 and not 304 (Not Modified).
If you are still seeing the same timestamp after the file modification:
It could be browser caching (See 304 comment above)
I suppose Liferay might be caching all the content, so changes on the file system will not take effect until you redeploy the WAR. If this is the case, try *touch*ing the myportlet.war/WEB-INF/web.xml file which will cause the WAR to be redeployed. Not as efficient, but hopefully faster than reissuing the ant command.
A quickie google revealed this link about Liferay Static Content Caching. It seems Liferay may indeed be caching all this stuff in ehcache. If this is the case with your portlet app, you have 2 choices:
Turn off caching (in dev only, of course) by setting this property in your portal-ext.properties: com.liferay.portal.servlet.filters.cache.CacheFilter=false
If Liferay registers the JMX interfaces for ehcache, you may be able to surgically remove the target items from cache through JMX-Console or twiddle. With either one, once you figure out the exact operation, you can create a batch file to execute it on demand on the command line.
Exploding the war file didn't work out for me. I get around this problem by using a node.js script(an http static file server). What I do is when editing the JS I copy this script to the javascript folder inside the portlet project and fire up the server(You need to install node.js on your dev machine). Then I change the references of my JS scripts in the portlet to point to static server urls.
Eg:- In your liferay-portlet.xml,
<footer-portlet-javascript>/js/app.js</footer-portlet-javascript>
Changes to,
<footer-portlet-javascript>http://localhost:8888/app.js</footer-portlet-javascript>
After that I can just edit the files and view changes in the browser right away.
(You also have to set Access-Control-Allow-Origin header in the static file server)

Categories

Resources