When running my website locally (via yesod devel) the styling loads up and all is good.
CSS files are loaded correctly. Using this method
But when uploaded onto my amazon ec2 server styling is not loaded correctly.
I'm using nginx that listens to port 80, then redirects it to port 3000 where my yesod webapp is running. My nginx.conf settings.
So I can directly got to header.css showing that the static files are passed on to the user browser. However, for some reason the css is not connecting correctly.
Another thing I've noticed is that if I directly go to the IP and port 3000, the default favicon.ico icon will get loading, whereas if I go to the domain it will not get loaded.
Any ideas?
Does the approot setting in config/settings.yml agree with the start of the url you were using to access the ec2 server? The log you show could certainly be explained by it being wrong. Yesod builds in fully qualified urls, using the approot as the prefix, for all of the additional pieces needed to build up a page. (Check the page source to see what Yesod has produced.)
If you are running using yesod devel for now, the approot setting will be the one set for the "Development" environment - which will be the one in the "Defaults" section if you have kept the structure of settings.yml as it was when you created your scaffolded site.
Found nothing seriously wrong on your nginx.conf file.
I hit http://www.finance-web.biz/static/css/header.css and the result is fine.
/*!
* Extra header style
*/
.beta {
color: #CC3300;
}
Maybe it's something cached in your browser.
Related
I've been messing around with a tutorial site, and I found that my VS Code LiveServer plugin doesn't work properly when I try to open Django templates. The CSS I applied is missing (although everything renders correctly in my local development sever), and the template language code is actually printed to the screen rather than executed (see image below). My liveserver plugin appears to be working with html files outside of Django.
(1) Right now I'm right clicking and selecting "Open with Liveserver." Is this wrong for Django? The liveserver docs recommend trying to "visit the Actual Server Address: http://localhost/[workspace], not the VS Code extension's Live Server Address: http://127.0.0.1:5500/". I tried including the file path in place of [workspace], but no luck. What do I do here?
(2) I saw in another thread where someone recommended their own solution, here. I'm not sure where I'm supposed to run the './manage.py livereload' command, but it's not working in command prompt. What is the difference between './manage.py' and 'py manage.py'? And will this solution be any better than the VS Code plugin?
I have had the same problem as you and managed to get it working with the link you included in point (2) of your post. You may have gotten sorted by now, but I thought I'd post it here in case.
First I went to my console and ran:
pip install livereload
which was installed successfully. Then I added 'livereload' to my installed apps in my settings.py file. E.g...
INSTALLED_APPS = [
...
'livereload',
...
]
Then I went to the directory containing my manage.py file on the terminal and ran
./manage.py livereload
and this provided me with a link to a live update server. Previously I had been running a server with "python manage.py runserver", so this is to replace that command.
Now when I save any changes I make in my IDE, they update live on the browser.
Sorry that I haven't included any screenshot images for clarity, I wasn't able to for some reason.
I am working through Scrimba/VSchool tutorial, so I am wondering if you may have run into this problem through a similar path.
I believe Live Server and Django are incompatible - but if you find a fix, let me know.
Live server is acting as your web server (port 5500 by default), serving up files as your make changes.
Django is also acting as a web server (port 8000 by default), interpreting Python code, and rendering the Django Template Language.
Unfortunately, as far as I can tell, live server cannot execute all this Python code, so all the Django Template Language will not render. This includes the {% load static %} method that Django uses to read the CSS & JS links in the html.
For those of you who tried the top answer, but still got stuck: you have to install dj-static, or whitenoise (as recommended by the dj-static github page) to serve the static files. I noticed that it's really slow though. Maybe it's just me, but I found it to be quite unworkable. I ended up writing an autohotkey script to activate my browser and then refresh. At least for me, that´s a lot quicker.
in your command line you have to run the server by the following command:
python manage.py runserver
but be sure that you are in the directory that has manage.py file. you don't need to type the port. because you will get the default port which is:8000
I've been using codekit for ages now, and now I've been using the version 3 since it came out.
I really like this app, but there's something I never really understood and I decided to post it here (hoping to finally understand how this works and how to make it works like I want).
I have MAMP pro installed, with some hosts.
Let's say I have this list of hosts with (fake) document root:
localhost -> documents/site1/dist
test -> documents/sitetest/dist
and let's assume that test is a wordpress site having the site url set to
http://test/ in the database.
In codekit, when I enable the browser refresh, the bottom options asks me to write down the address I would visit to see my website.
Now, if I navigate to http://test/ my WordPress website loads and I am able to see everything.
In codekit I then setup the browser refreshing options to be the following:
Animation: ticked
Refresh Delay: 0.0 seconds (default)
Preview: empty
Document-Root Subpath: empty
External Server Required: on
External Server Address: http://test/
Then when I click on the green dot (server) to preview my website, I'm expecting codekit to navigate to http://test:5757 and to properly display my website. This, unfortunately, is not the case. When I click on the preview (or server, it doesn't really make any difference for me) codekit navigates to my mac IP and the website is either not loading or loading without any external resource.
I don't think the issue is in the way I load the resource in WordPress (i use enqueue sources properly, and the website without using codekit refresh function works, load and displays as meant to).
So far, I always switched my current project to use the localhost host (changing the document root in MAMP pro) and then telling codekit to use the localhost ip as external server, but now it's a bit more complex, as I have way more projects and I was hoping not to change back and forth the document root to use codekit built in refreshing feature.
Is it possible? am I missing something here?
I read all I was able to find as well as watched the videos on codekit, but this bit here is still a bit unknown to me and any help would be really appreciated.
Thanks
PS: No need to mention I am on a MAC, right? :)
I don't believe I actually managed to fix this.
I'll leave the answer here in case somebody else is facing the same issue.
The problem I had was that my website http://test/ was using a theme called test.
Codekit, for refreshing the browser, uses a simple string search and replace in the URL, and so everything that looked like "test" in the url was replaced by the internal ip.
Quick example:
http://test/wp-content/themes/test/index.php
became
http://192.168.0.1:5757/wp-content/themes/192.168.0.1:5757/index.php
and of course no file where loaded successfully, as the path was wrong.
To fix this?
Just change the MAMP pro address to something that won't be present in the URL (in my case, the MAMP pro host called test became dev.test and problem solved.
I am trying to get my Dart Polymer 1.0 single page app working with pushState. I have set up nginx to route all requests to the dev server which runs when executing pub serve. Nginx also takes care of always requesting index.html instead of the real url.
The problem I am facing is that as soon as I load a url with at least one folder, the js cannot be loaded anymore.
Example
Requesting project.local loads the index.html file and works fine. The same is true for project.local/test. As soon as I try going to project.local/test/something, it stops working because the file index.bootstrap.initialize.dart is requested from project.local/test/index.bootstrap.initialize.dart and not from project.local/index.bootstrap.initialize.dart.
Source code
The whole project can be found at https://github.com/agileaddicts/blitzlicht. The index.html is where the magic happens.
How do I tell the transformer to put absolute urls into the html instead of relative ones?
you should by able to upgrade to the last version of polymer by changing the version of reflectable.
reflectable: >=0.5.0
and perhaps add this in you pubspec
- $dart2js:
$include: '**/*.bootstrap.initialize.dart'
I'm hosting an ASP.NET website on Local IIS (not IIS Express), and as soon as I save a change to a .css file in Visual Studio, the change immediately appears in browser windows that use that file (or after mousing over the window in Chrome), without clearing caches and refreshing.
Why do the changes appear immediately?
Opening the .css file itself (not a page using the file) in the browser shows a more expected result: saving the file in Visual Studio does not change what I see in the browser until I refresh the .css file.
As it turns out, I had Browser Link enabled in Visual Studio, and with it, CSS Auto-Sync. This opens up a port on the local machine and uses SignalR to communicate with the browser window about 400 times per second, including any CSS changes needed.
For more information, see these topics:
.net localhost website consistently making get arterySignalR/poll?transport=longPolling&connectionToken= calls
How can I disable __vwd/js/artery in VS.NET 2013?
This probably happens due to caching. when you open the css itself, it retrieves a new copy from the server, but when you open a page that uses the css file, the css file is being cached as the page's resource and the browser just shows the cached resources until you force it to reload them.
a trick i learned to fix the issue, is to link the css file to the aspx page and include a random query string to the linking, that way it tricks the browser to think that its a new resource and reload it from the server anyway.
like this:
<link href="../stylesheets/MyCSS.css?<%=DateTime.Now%>"
rel="stylesheet" type="text/css" />
we use the aspx preprocessor directive <%=DateTime.Now%> to append the current time as a query string, to ensure the link is always different.
Dont forget the question mark between the css filename and the preprocessor directive
I have an HttpModule that displays images that follow a certain URL pattern. For example, /images/employees/jason.jpg is handled by the module, but all other images aren't. It works just fine on my local machine (Cassini and IIS 7). However, the IIS6 production server isn't working. I've had the hosting company map the images to the ASP.NET worker process. Now, all images are showing that they can't render except for the images that should be rendered by the module. They are working correct.
I ran an HttpWatch instance on one of the files and received the following error:
ERROR_HTTP_INVALID_SERVER_RESPONSE
Any ideas?
Final Answer:
The module needed to be updated to transmit server files. So, I added an else to my original if and checked to see if it was an image type (by using a utility method) then use Response.TransmitFile() to pass on the file to the browser.
I then ran into a spacing issue with the images. This was because I forgot that I had .aspx files registered as an image type to perform the testing. So each page would crash during the debug process or add padding that was established from CSS. Doh!
Everything is just peachy now. Thanks to all!
There's doesn't seem to be anything particularly wrong with your module, so the issue must be coming from somewhere else. Have you got security that might be blocking the images? What actually gets returned when you request a static file?
I'd suggest seeing what gets returned (and its headers) using something like firebug to check things like the response code, content type, the actual raw response, etc...
check your web.config IIS6 / IIS7 have different places to add modules and depends on what mode your IIS7 is running in.
http://arcware.net/use-a-single-web-config-for-iis6-and-iis7