If you are used to using a browser plugin to inject the livereload.js listener into your page, you will probably be as frustrated as I am that these all have hard-coded paths and have no option for using So, we are left with our only option, include the livereload.js listener manually. As long as you provide both a key and a crt it will automatically do so. Lastly, you don’t ever explicitly tell liverealod to use https.
We’ll get more into those pros and cons in a moment. Although you could use your same key/crt as your app, the pros outweigh the cons for not doing so. They aren’t valid keys and won’t be used anywhere else. This is why there’s no real harm including it in your project. These do not need to be the same key/crt used by your app. Next, livereload uses its own key and crt files. This has come in handy for me on multiple occassions, so I just recommend getting into the habit of using a different port, even if you never end up needing it. If you have multiple watches or even the Livereload app running, you can continue to do so on over http (non-secure) on the default port without conflict. you can pass in any other options you'd like to the https server, as listed here: įirst, you will notice that we didn’t set the port to the standard 35729 used by livereload we used 9000 instead. Key: ('path/to/livereload.key'),Ĭert: ('path/to/livereload.crt') read ( 'path/to/livereload.crt' ) // you can pass in any other options you'd like to the https server, as listed here: } }, }, } , read ( 'path/to/livereload.key' ) ,Ĭert : grunt.
#Livereload how to#
There are other examples out there on how to do this with Windows, but for this example we’ll stick to Mac/Linux using Terminal. Note: in the following examples the files will be generated and saved to the current directory, so if you want it saved somewhere else, either move it after generation completes or cd (change directory) to that directory prior to executing.Ī private key can be created using OpenSSL in Mac by opening terminal and using the following command: These can easily be autogenerated using a CLI app called OpenSSL. key/.crt Filesįor livereload to work over https, you need to provide a path to both a private key file and a certificate. What isn’t so obvious is how to go about getting it all working properly-especially to a front-end focused developer, who may not be familiar with server-side ssl, keys, and certs. It is obvious from the grunt-contrib-watch documentation that it is possible to get livereload working over https to avoid browser complaints such as Google Chrome’s blocked message “this content should also be loaded over HTTPS.” Posted Jby Jason Gill & filed under Developer Blog. Complete guide to livereload over ssl (https) using grunt watch
0 kommentar(er)
