I’m developing a web application written in Django, I’m running the server in my machine and use Chrome/Firefox to view and test the website. I want to be able to work on it while I’m on a plane/tube and I don’t have internet.
Now, the HTML loads some resources from the local server but some others from external CDNs. I want to work on some js and css files that are hosted on my machine and view the changes in the browser, so I have to force reload the website since chrome by default just shows the cached versions of these, but if I force reload, then ALL sources are reloaded and the CDN sources obviously fail to be fetched (and my site looks horrible).
So I want to know how I can reload (in Chrome or Firefox) only some of the sources of my site and still use the cached versions of the CDN ones (assume these are cached because I load them before going into the plane).
Any help or advise on how other people would solve this would be much appreciated.
Related
I've built a gatsby website, but when I try to use it offline (by directly loading index.html into my browser), it fails to load the files in the assets folder, and links to other pages fails
running in windows:
after installing gatsby , I did the following:
gatsby new sample
cd sample
gatsby build
then I went to file explorer and opened the sample/dist directory and double clicked on index.html (Chrome is my default browser, but IE behaves the same)
the result is a half-loaded webpage that is missing the style sheets, javascript, images, and links are broken.
For instance, the "about" link on the first page points to "D:/about" vs. ".\about.html".
Is there anyway to make gatsby work to create a truly off-line website?
I've built a gatsby website, but when I try to use it offline (by directly loading index.html into my browser), it fails to load the files in the assets folder, and links to other pages fails
Gatsby will create a React app for you when it is built, and because most React apps use client-side routing, your links won't work with file:// URLs.
After installing the Gatsby CLI and building your site with gatsby build you should run gatsby serve which will serve up index.html with a static file server on your own machine.
See a similar answer about create-react-app here
Try using gatsby serve from the root of your project. Serve spins up a web server to serve your prod build.
Look it up on the Gatsby CLI docs on their site.
Gatsby isn't really set up to do that, unfortunately. It's a site generator, not page generator, and it expects living on a server. The result is that while the files are static, the navigation isn't.
Because I spent some time experimenting, this is what DOESN'T work:
Setting . as pathPrefix in gatsby-config.js. Gatsby lets you set path prefix, which it then prepends to all generated urls. Unfortunately, this prefix always gets "absolutized" somehow. . gets converted to /., for example.
Setting the absolute path of the file on disk as pathPrefix. Same as above - file:///path/to/file doesn't survive the build (results in file:/) and /path/to/file breaks the JavaScript.
Setting the pathPrefix to a bogus value like /NOTAPREFIX and search-replacing it in the generated files. Breaks the JavaScript, again.
Something I haven't tried but might get you somewhere, would be to disable the Single Page App functionality. It's possible, reportedly, (or maybe with this plugin?) but no good step-by-step instructions anywhere.
I'm building a website with Django 1.11 with a fairly simple javascript/html/css part (no framework like Vuejs). I have page reload on each navigation which is fine for my use case.
For convenience, I serve my website from App Engine Standard and it's going well so far. Now, I need my user to be able to upload files (up to 300MB size). Due to App Engine's limitation on request size (32MB), I'm using signed urls so I can send these files directly from my client's Javascript to Cloud Storage.
Due to the size of the files, the upload may take some time, but I can't seem to navigate to another page since it may cancel the upload. I understand that for a case like this a client app like single-page app in Vuejs for example would be appropriate but is there a way to achieve this with my current setup without rewriting my whole website (with possibly Vuejs and Django REST API)?
Any suggestions would be much appreciated.
I've designed a desktop app using PyQt GUI toolkit and now I need to embed this app on my Django website. Do I need to clone it using django's own logic or is there a way to get it up on website using some interface. Coz I need this to work on my website same way it works as desktop. Do I need to find out packages in django to remake it over the web or is there way to simplify the task?
Please help.
I'm not aware of any libraries to port a PyQT desktop app to a django webapp. Django certainly does nothing to enable this one way or another. I think, you'll find that you have to rewrite it for the web. Django is a great framework and depending on the complexity of your app, it might not be too difficult. If you haven't done much with web development, there is a lot to learn!
If it seemed like common sense to you that you should be able to run a desktop app as a webapp, consider this:
Almost all web communication that you likely encounter is done via HTTP. HTTP is a protocol for passing data between servers and clients (often, browsers). What this means is that any communication that takes place must be resolved into discrete chunks. Consider an example flow:
You go to google in your browser.
Your browser then hits a DNS server (or cache) that resolves the name google.com to some IP address.
Cool, now your browser makes a request to that IP address and says "get me some stuff".
Google decides to send you back a minimal amount of HTML and lots of minified JavaScript in the page.
Your browser realizes that there are some image links in the HTML and so it makes additional requests to google to get each of the images so that it can display them.
Now all the content is loaded on your browser so it starts to execute the JavaScript code, and that code needs some more data from google so it starts sending requests to google too.
This is just a small example of how fundamentally different a web application operates than how a desktop application does. On a desktop app you have the added convenience that any operation doesn't need to be "packaged up" and sent, then have an action taken, etc (unless you're using a messaging architecture, but that's relatively uncommon outside of enterprise apps).
I'm working on several Django projects on my local machine, following a single page application architecture. To initiate the server, I have a couple copies of a script in my /bin folder containing
#!/bin/bash
python /path/to/app/manage.py runserver 8080
and have each script with the app name. This makes the application accessible via localhost:8080. In addition, I usually have the majority of my site CSS inside main.css
My issue is that I seem to be coming across a caching issue with Firefox, regardless of which application server is running. Sometimes a page will load with almost no CSS styling, but the jQuery UI elements will be initialized and I can interact somewhat with the application, although the functionality and styling is seriously broken. Refreshing the page shows no improvement, and no errors are shown in the console.
Clearing the cache and changing the port in the scrip seem to solve the issue, but it requires me to have bookmarks for each project, whereas it is pretty convenient to have a single localhost:8080 URL for all projects.
Has anyone come across this issue, and is there a solution other than clearing cache and changing ports?
This thread discusses methods to prevent client side caching of content served by the development server in Django:
Fighting client-side caching in Django
I prefer to simply disable caching in my browser though, seeing that I spend so much time on developing that I don't want to bother with the hassle of trying to prevent it in my own code.
A simple web search for "how to disable caching in firefox" came up with this:
http://support.mozilla.org/en-US/questions/764993
I'm pretty sure that searching for the same thing for different browsers will also give you expected results.
EDIT:
These guys also seem to go pretty in depth about how to prevent the caching of static files when using the Django development server.
Turn off caching of static files in Django development server
Just add something like this to /etc/hosts:
127.0.0.1 site1.dev
127.0.0.1 site2.dev
Visit site1.dev:8080, now site1 has its own cache and cookies (session) in the browser.
This is a bit of a long shot given how vague my problem is but I'm at my wit's end here.
Basically on my local machine, my website looks fine. However, once it's deployed to the live server, the CSS is not being applied in the same manner. Some of the overwrites that are happening on my local server are not being replicated on the remote server.
All the CSS files are loading for sure on the remote. Collectstatic command has also been ran.
Has anyone experienced such an issue before? Or does anyone have an guesses as to why this might be happening?
UPDATE
I know which style sheets are causing my problem, reset.css and text.css for those familiar with 960.gs. The thing is the overwrites are working in the right order locally but not on the remote.
It could be a lot of things, but I've had this happen to me before. It could be related to some virtual directories not being set up properly on your dev machine when compared to the production environment (causing some CSS to not load).
Have you used Firebug to see which CSS files are being loaded? You could use the Web Developer Toolbar in firefox to disable individual style sheets to see which is your culprit.
Are you sure there aren't any embedded styles on the remote server that you don't have locally?
Remember that there is a cascading order of priority for which CSS takes precedence in a browser. See: http://www.w3schools.com/css/css_howto.asp (bottom of page "Multiple Styles Will Cascade into One").
Good luck.
clear cache as well as cookies of your browser and recheck it. sometimes if network is slow , page does not download properly. basically css has to take nothing from the server. It may differ from browser to browser.
By default, Intranet sites are displayed in compatibility view in Internet Explorer.
This setting can be disabled