Having problems with Dojo making HTTP requests on a HTTPS site - https

I'm attempting to use a vBulletin plugin called "MGC Chatbox Evo". This plugin uses the Dojo library, but I'm having some trouble making it work via HTTPS.
Within the plugin, the library is called as such:
$js .= '<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/dojo/1.6.1/dojo/dojo.xd.js" data-dojo-config="parseOnLoad: true"></script>';
This loads that particular fine over HTTPS. However, this subsequently seems to attempt to load further files, of which I can find absolutely no reference of in the source files for the plugin (using find in Notepad++). I wondered if anyone had any idea as to how I can force these requests to be made via HTTPS instead of HTTP, as they are currently being automatically blocked. Thanks.
http://i.imgur.com/gQfkzp6.png

Would you be able to modify that script tag to load Dojo 1.6.2 instead of 1.6.1? I think that may fix your problem.
Here's why. This is from the uncompressed CDN version of dojo.xd.js in 1.6.1:
dojo.registerModulePath("dojo", "http://ajax.googleapis.com/ajax/libs/dojo/1.6.1/dojo");
dojo.registerModulePath("dijit", "http://ajax.googleapis.com/ajax/libs/dojo/1.6.1/dijit");
dojo.registerModulePath("dojox", "http://ajax.googleapis.com/ajax/libs/dojo/1.6.1/dojox");
Then here's the same lines from 1.6.2:
dojo.registerModulePath("dojo", "//ajax.googleapis.com/ajax/libs/dojo/1.6.2/dojo");
dojo.registerModulePath("dijit", "//ajax.googleapis.com/ajax/libs/dojo/1.6.2/dijit");
dojo.registerModulePath("dojox", "//ajax.googleapis.com/ajax/libs/dojo/1.6.2/dojox");
These paths instruct Dojo where to load additional modules that are requested via dojo.require. Notice that the URLs in 1.6.1 are hard-coded to http, but in 1.6.2 are protocol-relative.

Related

Website store JS and CSS on client side without any framework

I am making a website in Codeigniter and not using any client side framework like angularJS. However I need some features of angularJS like downloading the JS and CSS once at the client rather than downloading it for each page. As my website content is much dependent on the server, should I use angularJS? I read that it makes tha application slower.
your question is not about angular at all!
I recommend you to read something about build systems like require, grunt, yeoman...
What you want to do is ajaxifying your website, as Stever said it's not about angular at all..
you may use RequireJS to load the script when a page need it.
For a best perfomance, use grunt for running any task like : minifying, compressing your stylesheet and so on..

How do I set caching headers for my CSS/JS but ensure visitors always have the latest versions?

I'd like to speed up my site's loading time in part by ensuring all CSS/JS is being cached by the browser, as recommend by Google's PageSpeed tool. But I'd like to ensure that visitors have the latest CSS/JS files, if they are updated and the cache now contains old code.
From my research so far, appending something like "?459454" to the end of the CSS/JS url is popular. But wouldn't that force the visitor's browser to re-download the CSS/JS file every time?
Is there a way to set the files to be cached by the browser, but ensure the browser knows about updated versions of the cached files?
If you're using Apache, you can use mod_pagespeed (mentioned earlier by symcbean) to do this automatically.
It would work best if you also use the ModPagespeedLoadFromFile directive since that will create a new URL as soon as it detects that the resource has changed on disk, however it will work fine without that (it will use the cache expiry time returned when it fetches the resource to rewrite it).
If you're using nginx, you could use ngx_pagespeed.
If you're using IIS, you could use IISpeed, which is not a Google product and I don't know it's full feature set.
Version numbers will work, but you can also append a hash of the file to the filename with your web framework or asset build script:
<script src="script-5054a101c8b164cbfa570d97fe23cc0d.js"></script>
That way, once your HTML changes to reflect this new version, browsers will just download and cache the updated version of your script.
As you say, append a query string to the URL of the asset, but only change it if the content is different, or change it when you deploy a new version.
appending something like "?459454" to the end of the CSS/JS url is popular. But wouldn't that force the visitor's browser to re-download the CSS/JS file every time?
No it won't force them to download each time, however there are a lot of intermediate proxies out there which ignore query strings on cacheable content - hence many tools (including mod_pagespeed which does automatic url rewriting based on file conents, and content merging on the fly along with lots of other cool tricks) move the version information into the path / filename.
If you've only got .htaccess type access then you can strip the version information out to map direct to a file, or use a scripted 404 redirector (but this is probably only a good idea if you're behind a caching reverse proxy).

What is the "right" way to use YUI3 with HTTPS?

I have a lot of experience with YUI2 and I'm getting up to speed on YUI3. The service I'm writing needs HTTPS, but the vanilla YUI experience loads from Yahoo's HTTP-only CDN, which quietly fails in Chrome and loudly fails in modern IE when the browser tries to mix an HTTPS page with HTTP javascript.
My goals are to get all of:
Site uses HTTPS
YUI works in Chrome & IE (so scripts also must be delivered over SSL)
Uses a modern version of YUI 3 (this disqualifies YUI PHP Loader which hasn't been updated to support even YUI 3.4, while 3.8 is "current")
Use roll up combos for speed instead of many JS and CSS files (this disqualifies Google's CDN... if YUI 3 is actually hosted there which I couldn't find.)
Site dynamically loads YUI dependencies (dependencies change regularly as I add functionality, going back to the configurator and saving a new bundle every time is a PITA)
The obvious solution appears to be to give up goal #5 and just self-host combos.
How can I meet all 5 goals?
The easiest way to solve it is to change base URL from
http://yui.yahooapis.com/ to
https://yui-s.yahooapis.com/
Depending upon your server environment, you have a couple of options.
Development
Download the latest YUI library, and upload the yui/build/ folder to your server. The seed file should work fine without modification, though you won't be able to take advantage of combo loading.
Production
Use the YUI Configurator to determine all the files that you will need for each module set, and download them manually from the combo links provided. Rename them to something suitable like yui3.8.0-node-rollup.js and serve these to your users.
Be advised that if you use different module sets for different scripts, you may need to make multiple sets of files from this process, depending upon how you set it up. There is also a question here about concatenating Javascript together, if you are curious.
As an addendum, in my past research, I discovered that pulling external libraries over a secure connection may not be a safe idea.

caching kills links (jquery mobile on iPad)

I am working on a webapplication that uses caching to make it available offline. Everything works fine when running it chrome (offline and online). But when I run it on iPad the links don't work anymore and I get failed to load page everywhere. Removing the caching makes the links work again so it obviously has something to do with the caching. Navigating directly to the seperate pages of the webapp also works fine in Safari, its the link that causes the error. By default all links are loaded with AJAX in jQuery Mobile. Changing this by adding rel="external" also fixes the problem, but obviously I don't want to do that.
To enable caching I added this code: and created a manifest file with ALL the files (scripts, css, images, html). Does anyone know what the problem could be?
I've experienced this as well while working with caching using manifests. What I discovered was that there Chrome has no limits. iPad and iPhone do. This appears to be pretty small, around 5mb. Try removing images as much as possible and using YUI Compressor on your scripts.
Ajax requests can be cached actually, the system doesn't care if the request is by AJAX or normal full request. All you have to do is put the URLs you wanted to retrieve by ajax into the manifest like the rest of the assets.
Hope this helps

How to use Google Custom Search on https to avoid non secure content prompt?

Is there a way to get the script for search results from an HTTPS site
instead of http://www.google.com/afsonline/show_afs_search.js
I am using the custom google business search on a HTTPS site.
When search is submitted web browser shows warning:
"This page contains both secure and nonsecure items"
I tried to modify the source to be https://www.google.com/afsonline/show_afs_search.js but that doesn't work. Still JavaScript returned from that link connects to http links instead of https links.
Does anybody knows how to fix this ?
A hack that works for me is to provide a modified version of the script
https://www.google.com/afsonline/show_afs_search.js
on another server, say:
https://www.myserver.com/show_afs_search.js
Just copy the original scripts source code and replace 'http' with 'https' in the script (one occurrence). Of course that might stop working anytime if Google changes something.
Even if you modify the Javascript link to HTTPS, show_afs_search.js is still hardcoded to get the search results via HTTP, not HTTPS. To avoid this error, make your own copy of show_afs_search.js that grabs results via HTTPS.
Steps:
download show_afs_search.js
open the file and replace 'http' with 'https'
put this file one your https server and use it
Just change the one instance of http to https.

Resources