I have a basic web app, with a Python/Flask backend exposing an image through the API as shown:
class ImageResource(Resource):
def get(self):
return send_file('path/to/file', mimetype='image/jpeg')
...
api.add_resource(ImageResource, '/v1/preview')
In AngularJS, I then have a factory which creates the API, providing access this as a $resource:
var previewResource = $resource('/v1/preview')
This would be easy enough if I could use the following HTML
<img ng-src="{{ imgUrl }}" />
with $scope.imgUrl
set to '/v1/preview'
.
The problem is that the controller where I want to actually get the image can only reference previewResource
- with no knowledge of the path.
How can I use this to retrieve the image and have it displayed on the page?
--
For some additional context (in case it makes a difference), the image will be constantly changing so there will be some $timeout
action to refresh it every few seconds. Again, here it would be easy if the path is known, as it would be possible to have a bit of JS to append ?(timestamp)
to have the browser automatically reload it every time it changes.