I am trying to take files from an external hard drive and use it in my HTML pages. Since i am using Flask as my frame work i am having great difficult accessing anything outside of the virtual environment. I have tried to change the static folder but i have found no effective way of completing this. It would be great if there is a way that i can route all HTML static files to my external hard drive. At the moment everything is working accept the video file.
So far my init.py looks like this
from flask import Flask
app = Flask(__name__)
app.config.from_object('config')
from app import views
And my html file looks like this
<!DOCTYPE html>
<html>
<head>
<style>
body {background-image: url(static/B1.jpg);}
</style>
<title>Server</title>
</head>
<body>
<video width="original" height="original" controls>
<source src="static/movie.mp4" type="video/mp4">
</video>
</body>
</html>
Thanks for the help everyone :)
could i change the html to src to something like this
<source src="../../../../../E:/Movies/movie.mp4" type="video/mp4">
And if i can't why does that work with just opening an html with that source?
I think my problem is that flask can't route a file to the html is there a way to route the file?
All static files must be in static folder. Some oprions you have:
Copy the files that are elsewhere on your filesystem into that folder
Add some code to your server script that copies the files from their origin to the static files folder
Put your server script on your external drive, so your static folder is on that drive, and run it from there. If you need to serve content from several folders on that drive you might be able to create shortcuts to those folders under static folder but I can't test right now , on Windows I doubt this will work (on Linux very likely that symbolic links would work).
You could have one flask app running for each different folder where you have static content, listening on a different port. Those apps would all be identical. Your HTML served by your main app would have links with those ports.
Find where in the source flask looks for the source folder, and extend by a few lines of code to be able to look in other folders.
Use flask.send_file and flask.send_file_from_directory: as long as your database contains a mapping of file ID's to file paths, and you put the file ID's in the HTML served to client, then when client requests the file, your flask app uses the ID in the URL to determine file location and uses flask.send_file_from_directory to serve the file.
You might also be able to use Flask Blueprints since each blueprint can have its own static folder
Related
I have a problem with ember-cli build option.
While running server by ember s it's showing normal page with content, styles etc.
But now I want to build this app and put it on my website by ftp so i tried ember build which build my project into /disk folder but the index.html file doesn't contain the stuff from application.hbs + no styles from styles/app.css.
I'm new to ember. What am I doing wrong? Docs of ember are saying nothing about this.
All of your app is actually pulled in through external assets.
So, looking at your pre-built index.html, you'll see something like this:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>emberclear</title>
{{content-for "head"}}
<link rel="stylesheet" href="{{rootURL}}assets/vendor.css">
<link rel="stylesheet" href="{{rootURL}}assets/emberclear.css">
{{content-for "head-footer"}}
</head>
<body class='has-navbar-fixed-top'>
{{content-for "body"}}
<script src="{{rootURL}}assets/vendor.js"></script>
<script src="{{rootURL}}assets/emberclear.js"></script>
{{content-for "body-footer"}}
</body>
</html>
my application is https://emberclear.io, named emberclear, so substitute your app name where applicable.
In the head, we see two link tags.
the first link is for all the styles that your addons may include (maybe such as material-ui, or bootstrap, or bulma).
The second link is your actual app styles. for me, emberclear.css includes everything from app.css, and all of its dependencies (I'm actually using scss, so I can include stuff via scss' #import).
Down in the body we see two script tags.
vendor.js will contain ember itself, and any addon dependencies that need to be included at run time, such as ember-paper's library of components.
emberclear.js includes your app -- routes, templates, etc.
This technique is common for all single page apps, and isn't exclusive to ember. anything built with react, or vue, has a similar pattern.
If you're wanting to have html and css be a part of your index.html, fastboot (https://www.ember-fastboot.com/) + prember (pre-rendered ember: https://github.com/ef4/prember ) may be of interest to you.
Hope this helps! :)
If something is wrong, feel free to copy your built index.html from dist (and maybe additional files as well).
Some follow up questions for you, depending on the issues you are running in to:
Are you getting any errors?
What happens when you try to open the dist/index.html file locally?
You're uploading the contents of dist to an ftp folder. This in-of-itself is fine, but has the web-sever been told to use that ftp folder for a website?
How are you attempting to access the ftp folder via browser?
Maybe there is a domain/path we could look at to see additional details?
I am facing problem with static content such as .png, .jpg files in Django+extjs environment.
I develop my client side in Extjs with sencha environment and test it locally with sencha server (sencha app watch) which works fine and I see the static images on the UI page.
Now I take a production build of that app (sencha app build classic).
It generates two folders.
Classic : This has app.js and CSS,fonts etc...
resources : (Here is the problem) This has static files like images and json files(if any)
Now I copy these two folders to my Django static path and access the app.js and and CSS files from Django's HTML template. This works.
However, The problem is Django is unable to locate the image files that are there in resources folder (mentioned in list item 2).
If the URL is 'localhost:81/app_name', it searches for the images in the below path
localhost:81/app_name/resources/images/abc.png
But is should look in the below path to get these files
localhost:81/static/resources/images/abc.png
What am i missing here? How Do I tell Django/Extjs to search for the static content in localhost:81/static/resources/images/abc.png
Please suggest.
I have following structure (inside static directory):
css
--stylesheet.css
--fonts
---flexslider-icon.eot
stylesheet.css opens correctly in browser (like mysite.com/static/css/stylesheet.css)
But eot file is processed by django.
Why?
All js and css files, as well as images open correctly.
Can you try with a different browser? Some browsers will work quirkily with font files.
If trying with other browsers doesn't do the trick,
Are you using the default web server? Have you tried running your site with Gunicorn web server (http://gunicorn.org/)? Its a very simple test to do.
I've made a website using Flask and I have no problems getting things to work properly on the built-in development server. I've also been able to get things running on my production server under mod_wgsi. However, I host my static media from a static/CGI/PHP-5.2 application and I can't get Flask to 'see' it without manually changing all the urls in my html files.
The problem seems to be that the basic Flask setup expects static files to be within the flask application. See here for details. Essentially, I think I need to change the url of 'static' portion of the following one liner:
<link rel="stylesheet" href="{{url_for('static', filename='css/print.css')}}" type="text/css" media="print"/>
It looks like I can change this in init.py, instructions here, but defining the static_path as follows doesn't seem to work.
app = Flask(__name__, static_path = '/web_media')
To be clear, if I manually define my url like this:
<link rel="stylesheet" href="/web_media/css/print.css" type="text/css" media="print"/>
everything works fine. Any help would be greatly appreciated.
Override static_folder instead.
app = Flask(__name__, static_folder = '/web_media')
If this is a production set up Flask should not be serving your static content; the web server (nginx, apache, cherokee, etc...) should be handling that as it is more efficient at handling those types of operations than the python process. From the sounds of it (based on the mod_wsgi reference) you are using apache, so this is how you could alter your config file to serve static content from static/CGI/PHP-5.2 using apache.
Assuming "web_media" is a directory under the somewhat fictitious /var/www/static/CGI/PHP-5.2 directory and contains your css/js/etc. assets. In your config file, within the area where you configure this app add something along the lines of.
Alias /web_media/ /var/www/static/CGI/PHP-5.2/web_media/
<Directory /var/www/static/CGI/PHP-5.2/web_media>
Order deny,allow
Allow from all
</Directory>
It's been a while since I used/configured apache, so no guarantees that the above will work perfectly the first time. But the main point is, use the webserver to handle the static media.
For production environment you should serve your static files via http server (e.g. nginx/apache). See answer of Philip Southam above.
Nonetheless, there are times when you use werkzeug server (e.g. dev/testing). In that case, there are 2 keyword arguments to look at:
static_folder: physical location on the file system. If it is relative path than it is relative to the project root directory.
static_url_path: this is the url lookup path for static content.
For example, if I have a static file located at /path/to/static/files/myfile.jpg, with /path/to/static/files as static file root and you want to access it via http://example.com/mystatic/myfile.jpg. I will do the following:
from flask import Flask
app_name = __name__
app = Flask(app_name, static_folder='/path/to/static/files', static_url_path='/mystatic')
Assuming you are using flask version 0.7 or above (currently 0.11.1)
I am using Django to create a small web app, however I do not know where i must put my HTML and JS files. I don't want to use the templateing system because I have no need to pass the values from Django directly to the HTML template, Instead the HTML will be static and I will fetch all the data necessary and send the data to be input back into the database using AJAX with Jquery.
My Question is where must I put my HTMl and JS files so they are accessible from the web browser and will be in the same directory so that I can send my ajax requests to something like
http://localhost:2000/webapp/RPC/updateitem/ (more stuff here)
and where the HTML files are
http://localhost:2000/webapp/index.html
Thanks,
RayQuang
You let your main webserver (the one you're running django on) deal with the static files. In most cases this means that you simly server the files through apache (or lighttpd or cherrypy or whatever). Django is only ment for the rendering of dynamic things and thus should not be used for serving static files.
If you're running from a development server (which I can't recommend), this tutorial will help you through setting it up: Serving static files