Walking around in the dark here ...
I am creating a personal web UI to identify duplicates in my photo repositories. I am using it as a vehicle to learn Flask, etc. I use a symbolic link in the static folder to point to my photos directory which works great. The workflow is:
- The user picks the directories to be compared
- The selected files in the directories are hashed.
- A list of duplicate files (URLs) are produced.
- The list of URLs are sent to the browser to be displayed back to the user.
Everything works up until the list of URLs are sent to be rendered in the browser. From the Developer Tools console in the Browser, I can see that the html is correctly generated. I saved off the html and opened it in the browser ... it displays the images as expected.
Problem: The html is NEVER displayed in the browser by the server back to the user.
I believe my problem has to do with how I am handling the GET/POSTs but I just don't see it. It is almost like the browser is not requesting (GETting the html to be displayed). This is my first time posting a question, although I am a long-time researcher/lurker. Thank you for your help, my code follows:
duper.py
@app.route("/")
def get_dirs():
return render_template(
'get_paths.html',
page_title='Select Directories',
jsonTreeData=dw.dirTree)
@app.route("/get_paths", methods=['GET', 'POST'])
def get_paths():
if request.method == 'POST':
dir_indexes = request.get_json()
dir_list = dw.getSearchDirs(dir_indexes)
df.searchDirs(dir_list)
urls = df.getURLResults()
if len(urls) == 0: # no dups found
print "Good job - no dups!"
else: # results ready to be displayed
return render_template(
'duply.html',
page_title='Results',
results=urls)
duply.html
{% extends "base2.html" %}
{% block content %}
<div class="container-fluid">
<table id="myTable" class="table table-bordered">
<tbody>
<tr>
<td colspan="10">
{%- for result in results %}
<tr>
{% for img_url in result %}
<td>
<a href="C:/DeDuper{{ img_url }}">
<img src="C:/DeDuper{{ img_url }}" class="img-circle" width="150" height="150">
</a>
</td>
{% endfor %}
</tr>
<tr>
<td colspan="10">
{% for img_url in result %}
<div>{{ img_url }}</div>
{% endfor %}
</td>
</tr>
{% endfor %}
</td>
</tr>
</tbody>
</table>
</div>
{% endblock %}
HTML contents copied from Developer Tools Console:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
<!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
<meta name="description" content="">
<meta name="author" content="">
<link rel="icon" href="../static/ico/favicon.ico">
<title>Results</title>
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css"
integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">
<!-- Optional theme -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap-theme.min.css"
integrity="sha384-fLW2N01lMqjakBkx3l/M9EahuwpSfeNvV63J5ezn3uZzapT0u7EYsXMjQV+0En5r" crossorigin="anonymous">
<!-- Latest compiled and minified JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"
integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS"
crossorigin="anonymous"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jstree/3.2.1/themes/default/style.min.css"/>
<style>
.dirTree {
overflow: auto;
border: 1px solid silver;
min-height: 100px;
}
</style>
</head>
<body>
<div class="container-fluid">
<nav class="navbar navbar-inverse navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed"
data-toggle="collapse" data-target="#navbar"
aria-expanded="false" aria-controls="navbar">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">Super Duper Finder!!</a>
</div>
<div id="navbar" class="collapse navbar-collapse">
<ul class="nav navbar-nav">
<li><a href="/">Start</a></li>
<li><a href="/x">About</a></li>
</ul>
</div><!--/.nav-collapse -->
</div>
</nav>
<br>
<br>
<br>
<br>
<div class="container-fluid">
<table id="myTable" class="table table-bordered">
<tbody>
<tr>
<td colspan="10">
<tr>
<td>
<a href="C:/DeDuper/static/media/pics/_from Otto/2015/Pets/Mega '12/2012-10-13 18.36.33.jpg">
<img src="C:/DeDuper/static/media/pics/_from Otto/2015/Pets/Mega '12/2012-10-13 18.36.33.jpg" class="img-circle" width="150" height="150">
</a>
</td>
<td>
<a href="C:/DeDuper/static/media/pics/_from Otto/2015/Pets/Mega '12/To CCI/2012-10-13 18.36.33.jpg">
<img src="C:/DeDuper/static/media/pics/_from Otto/2015/Pets/Mega '12/To CCI/2012-10-13 18.36.33.jpg" class="img-circle" width="150" height="150">
</a>
</td>
</tr>
<tr>
<td colspan="10">
<div>/static/media/pics/_from Otto/2015/Pets/Mega '12/2012-10-13 18.36.33.jpg</div>
<div>/static/media/pics/_from Otto/2015/Pets/Mega '12/To CCI/2012-10-13 18.36.33.jpg</div>
</td>
</tr>
<tr>
<td>
<a href="C:/DeDuper/static/media/pics/_from Otto/2015/Pets/Mega '12/IMAG1060.jpg">
<img src="C:/DeDuper/static/media/pics/_from Otto/2015/Pets/Mega '12/IMAG1060.jpg" class="img-circle" width="150" height="150">
</a>
</td>
<td>
<a href="C:/DeDuper/static/media/pics/_from Otto/2015/Pets/Mega '12/To CCI/IMAG1060.jpg">
<img src="C:/DeDuper/static/media/pics/_from Otto/2015/Pets/Mega '12/To CCI/IMAG1060.jpg" class="img-circle" width="150" height="150">
</a>
</td>
</tr>
<tr>
<td colspan="10">
<div>/static/media/pics/_from Otto/2015/Pets/Mega '12/IMAG1060.jpg</div>
<div>/static/media/pics/_from Otto/2015/Pets/Mega '12/To CCI/IMAG1060.jpg</div>
</td>
</tr>
<tr>
<td>
<a href="C:/DeDuper/static/media/pics/_from Otto/2015/Pets/Mega '12/IMAG1136 (1).jpg">
<img src="C:/DeDuper/static/media/pics/_from Otto/2015/Pets/Mega '12/IMAG1136 (1).jpg" class="img-circle" width="150" height="150">
</a>
</td>
<td>
<a href="C:/DeDuper/static/media/pics/_from Otto/2015/Pets/Mega '12/IMAG1136.jpg">
<img src="C:/DeDuper/static/media/pics/_from Otto/2015/Pets/Mega '12/IMAG1136.jpg" class="img-circle" width="150" height="150">
</a>
</td>
</tr>
<tr>
<td colspan="10">
<div>/static/media/pics/_from Otto/2015/Pets/Mega '12/IMAG1136 (1).jpg</div>
<div>/static/media/pics/_from Otto/2015/Pets/Mega '12/IMAG1136.jpg</div>
</td>
</tr>
<tr>
<td>
<a href="C:/DeDuper/static/media/pics/_from Otto/2015/Pets/Mega '12/2012-10-14 15.08.41.jpg">
<img src="C:/DeDuper/static/media/pics/_from Otto/2015/Pets/Mega '12/2012-10-14 15.08.41.jpg" class="img-circle" width="150" height="150">
</a>
</td>
<td>
<a href="C:/DeDuper/static/media/pics/_from Otto/2015/Pets/Mega '12/IMAG0903.jpg">
<img src="C:/DeDuper/static/media/pics/_from Otto/2015/Pets/Mega '12/IMAG0903.jpg" class="img-circle" width="150" height="150">
</a>
</td>
</tr>
<tr>
<td colspan="10">
<div>/static/media/pics/_from Otto/2015/Pets/Mega '12/2012-10-14 15.08.41.jpg</div>
<div>/static/media/pics/_from Otto/2015/Pets/Mega '12/IMAG0903.jpg</div>
</td>
</tr>
<tr>
<td>
<a href="C:/DeDuper/static/media/pics/_from Otto/2015/Pets/Mega '12/2012-10-12 17.04.22.jpg">
<img src="C:/DeDuper/static/media/pics/_from Otto/2015/Pets/Mega '12/2012-10-12 17.04.22.jpg" class="img-circle" width="150" height="150">
</a>
</td>
<td>
<a href="C:/DeDuper/static/media/pics/_from Otto/2015/Pets/Mega '12/IMAG0875.jpg">
<img src="C:/DeDuper/static/media/pics/_from Otto/2015/Pets/Mega '12/IMAG0875.jpg" class="img-circle" width="150" height="150">
</a>
</td>
</tr>
<tr>
<td colspan="10">
<div>/static/media/pics/_from Otto/2015/Pets/Mega '12/2012-10-12 17.04.22.jpg</div>
<div>/static/media/pics/_from Otto/2015/Pets/Mega '12/IMAG0875.jpg</div>
</td>
</tr>
<tr>
<td>
<a href="C:/DeDuper/static/media/pics/_from Otto/2015/Pets/Mega '12/PART95141493701117495Screenshot952014-08-26-20-08-01.jpg">
<img src="C:/DeDuper/static/media/pics/_from Otto/2015/Pets/Mega '12/PART95141493701117495Screenshot952014-08-26-20-08-01.jpg" class="img-circle" width="150" height="150">
</a>
</td>
<td>
<a href="C:/DeDuper/static/media/pics/_from Otto/2015/Pets/Mega '12/To CCI/PART95141493701117495Screenshot952014-08-26-20-08-01.jpg">
<img src="C:/DeDuper/static/media/pics/_from Otto/2015/Pets/Mega '12/To CCI/PART95141493701117495Screenshot952014-08-26-20-08-01.jpg" class="img-circle" width="150" height="150">
</a>
</td>
</tr>
<tr>
<td colspan="10">
<div>/static/media/pics/_from Otto/2015/Pets/Mega '12/PART95141493701117495Screenshot952014-08-26-20-08-01.jpg</div>
<div>/static/media/pics/_from Otto/2015/Pets/Mega '12/To CCI/PART95141493701117495Screenshot952014-08-26-20-08-01.jpg</div>
</td>
</tr>
<tr>
<td>
<a href="C:/DeDuper/static/media/pics/_from Otto/2015/Butch/7.jpg">
<img src="C:/DeDuper/static/media/pics/_from Otto/2015/Butch/7.jpg" class="img-circle" width="150" height="150">
</a>
</td>
<td>
<a href="C:/DeDuper/static/media/pics/_from Otto/2015/Butch/a.jpg">
<img src="C:/DeDuper/static/media/pics/_from Otto/2015/Butch/a.jpg" class="img-circle" width="150" height="150">
</a>
</td>
<td>
<a href="C:/DeDuper/static/media/pics/_from Otto/2015/Butch/b.jpg">
<img src="C:/DeDuper/static/media/pics/_from Otto/2015/Butch/b.jpg" class="img-circle" width="150" height="150">
</a>
</td>
</tr>
<tr>
<td colspan="10">
<div>/static/media/pics/_from Otto/2015/Butch/7.jpg</div>
<div>/static/media/pics/_from Otto/2015/Butch/a.jpg</div>
<div>/static/media/pics/_from Otto/2015/Butch/b.jpg</div>
</td>
</tr>
<tr>
<td>
<a href="C:/DeDuper/static/media/pics/_from Otto/2015/Pets/Mega '12/2012-10-14 15.08.48.jpg">
<img src="C:/DeDuper/static/media/pics/_from Otto/2015/Pets/Mega '12/2012-10-14 15.08.48.jpg" class="img-circle" width="150" height="150">
</a>
</td>
<td>
<a href="C:/DeDuper/static/media/pics/_from Otto/2015/Pets/Mega '12/IMAG0904.jpg">
<img src="C:/DeDuper/static/media/pics/_from Otto/2015/Pets/Mega '12/IMAG0904.jpg" class="img-circle" width="150" height="150">
</a>
</td>
<td>
<a href="C:/DeDuper/static/media/pics/_from Otto/2015/Pets/Mega '12/To CCI/IMAG0904.jpg">
<img src="C:/DeDuper/static/media/pics/_from Otto/2015/Pets/Mega '12/To CCI/IMAG0904.jpg" class="img-circle" width="150" height="150">
</a>
</td>
</tr>
<tr>
<td colspan="10">
<div>/static/media/pics/_from Otto/2015/Pets/Mega '12/2012-10-14 15.08.48.jpg</div>
<div>/static/media/pics/_from Otto/2015/Pets/Mega '12/IMAG0904.jpg</div>
<div>/static/media/pics/_from Otto/2015/Pets/Mega '12/To CCI/IMAG0904.jpg</div>
</td>
</tr>
</td>
</tr>
</tbody>
</table>
</div>
</div><!-- /.container -->
</body>
</html>
