use streaming proxy

This commit is contained in:
j 2021-11-24 12:45:15 +01:00
parent 16a9439152
commit c230b57dca
9 changed files with 34 additions and 25 deletions

View file

@ -211,13 +211,13 @@ function renderAnnotation(config, video, ascroll, clip) {
} }
var values = [] var values = []
clip.annotations.forEach(a => { clip.annotations.forEach(a => {
values.push(a.value.replace(/src="\//g, `src="${pandoraURL}/`).replace(/href="\//g, `href="${pandoraURL}/`)) values.push(a.value.replace(/src="\//g, `src="${streamPrefix}/`).replace(/href="\//g, `href="${pandoraURL}/`))
}) })
values = values.join('<br><br>') values = values.join('<br><br>')
div.innerHTML = ` div.innerHTML = `
<div class="frame"> <div class="frame">
<figure> <figure>
<img src="${pandoraURL}/${annotation.id.split('/')[0]}/${imageResolution}p${annotation.in}.jpg"> <img src="${streamPrefix}/${annotation.id.split('/')[0]}/${imageResolution}p${annotation.in}.jpg">
${figcaption} ${figcaption}
</figure> </figure>
</div> </div>
@ -228,7 +228,7 @@ function renderAnnotation(config, video, ascroll, clip) {
document.addEventListener('scroll', onVisibilityChange(div.querySelector('.frame'), function(visible) { document.addEventListener('scroll', onVisibilityChange(div.querySelector('.frame'), function(visible) {
var src var src
if (config.edit) { if (config.edit) {
src = `${pandoraURL}/${annotation.id.split('/')[0]}/480p.webm` src = `${streamPrefix}/${annotation.id.split('/')[0]}/480p.webm`
} }
if (config.loaded && visible) { if (config.loaded && visible) {
updatePlayer(video, frame, annotation['in'], annotation['out'], src) updatePlayer(video, frame, annotation['in'], annotation['out'], src)
@ -248,7 +248,7 @@ function renderAnnotations(config) {
video.WebKitPlaysInline = true video.WebKitPlaysInline = true
video.muted = true video.muted = true
if (config.item) { if (config.item) {
setVideoSrc(video, `${pandoraURL}/${config.item}/480p.webm`) setVideoSrc(video, `${streamPrefix}/${config.item}/480p.webm`)
} }
video.addEventListener('timeupdate', timeupdate) video.addEventListener('timeupdate', timeupdate)
video.addEventListener('touchstart', showOverlay) video.addEventListener('touchstart', showOverlay)
@ -268,7 +268,7 @@ function renderAnnotations(config) {
if (frame) { if (frame) {
var src var src
if (config.edit) { if (config.edit) {
src = `${pandoraURL}/${config.first.id.split('/')[0]}/480p.webm` src = `${streamPrefix}/${config.first.id.split('/')[0]}/480p.webm`
} }
updatePlayer(video, frame, config.first['in'], config.first['out'], src) updatePlayer(video, frame, config.first['in'], config.first['out'], src)
} }

View file

@ -200,8 +200,8 @@ function renderPlayer(config) {
video.muted = false video.muted = false
video.controls = true video.controls = true
if (config.item) { if (config.item) {
setVideoSrc(video, `${pandoraURL}/${config.item}/480p.webm`) setVideoSrc(video, `${streamPrefix}/${config.item}/480p.webm`)
video.poster = `${pandoraURL}/${config.item}/480p.jpg` video.poster = `${streamPrefix}/${config.item}/480p.jpg`
} }
video.addEventListener('timeupdate', timeupdate) video.addEventListener('timeupdate', timeupdate)
var box = document.createElement('div') var box = document.createElement('div')

View file

@ -59,11 +59,11 @@ body {
</div> </div>
<div class="video-block"> <div class="video-block">
<img src="https://archive.njp.ma/{{ film.data.items.0.id }}/timelineslitscan64pframe.jpg" class="video-fallback-block"> <img src="{{ stream_prefix }}/{{ film.data.items.0.id }}/timelineslitscan64pframe.jpg" class="video-fallback-block">
<video <video
id="timeline-video" id="timeline-video"
src="https://archive.njp.ma/{{ film.data.items.0.id }}/timelineslitscan64p.mp4" src="{{ stream_prefix }}/{{ film.data.items.0.id }}/timelineslitscan64p.mp4"
poster="https://archive.njp.ma/{{ film.data.items.0.id }}/timelineslitscan64pframe.jpg" poster="{{ stream_prefix }}/{{ film.data.items.0.id }}/timelineslitscan64pframe.jpg"
controlsList="nodownload" controlsList="nodownload"
autoplay autoplay
loop loop
@ -82,7 +82,7 @@ body {
<div class="overlay"> <div class="overlay">
<img src="{% static 'svg/play.svg' %}"> <img src="{% static 'svg/play.svg' %}">
</div> </div>
<img src="https://archive.njp.ma/{{ item.id }}/480p.jpg"> <img src="{{ stream_prefix }}/{{ item.id }}/480p.jpg">
<figcaption> <figcaption>
{{ item.title | safe }} {{ item.title | safe }}
{% if item.date %}({{item.date | safe }}){% endif %} {% if item.date %}({{item.date | safe }}){% endif %}

View file

@ -6,6 +6,7 @@
<script> <script>
var config = {{ config | safe }}; var config = {{ config | safe }};
var pandoraURL = "{{ pandora_url }}"; var pandoraURL = "{{ pandora_url }}";
var streamPrefix = "{{ stream_prefix }}";
</script> </script>
<script src="{% static 'js/api.js' %}"></script> <script src="{% static 'js/api.js' %}"></script>
<script src="{% static 'js/play.js' %}"></script> <script src="{% static 'js/play.js' %}"></script>

View file

@ -30,11 +30,11 @@
<figure> <figure>
<div> <div>
{% for item in film.data.items %} {% for item in film.data.items %}
<img src="https://archive.njp.ma/{{ item.id }}/480p.jpg"> <img src="{{ stream_prefix }}/{{ item.id }}/480p.jpg">
{% endfor %} {% endfor %}
</div> </div>
<figcaption> <figcaption>
<img src="https://archive.njp.ma/{{ film.data.items.0.id }}/timeline64p.jpg"> <img src="{{ stream_prefix }}/{{ film.data.items.0.id }}/timeline64p.jpg">
</figcaption> </figcaption>
<figcaption> <figcaption>
{{ film.data.title | safe }} {{ film.data.title | safe }}

View file

@ -22,11 +22,11 @@
<div class="index"> <div class="index">
{% if featured %} {% if featured %}
<div class="video-block"> <div class="video-block">
<img src="https://archive.njp.ma/{{ featured }}/timelineslitscan64pframe.jpg" class="video-fallback-block"> <img src="{{ stream_prefix }}{{ featured }}/timelineslitscan64pframe.jpg" class="video-fallback-block">
<video <video
id="timeline-video" id="timeline-video"
src="https://archive.njp.ma/{{ featured }}/timelineslitscan64p.mp4" src="{{ stream_prefix }}{{ featured }}/timelineslitscan64p.mp4"
poster="https://archive.njp.ma/{{ featured }}/timelineslitscan64pframe.jpg" poster="{{ stream_prefix }}{{ featured }}/timelineslitscan64pframe.jpg"
controlsList="nodownload" controlsList="nodownload"
autoplay autoplay
loop loop

View file

@ -38,6 +38,7 @@
<script> <script>
var config = {{ text.json | safe }}; var config = {{ text.json | safe }};
var pandoraURL = "{{ pandora_url }}"; var pandoraURL = "{{ pandora_url }}";
var streamPrefix = "{{ stream_prefix }}";
</script> </script>
<script src="/static/js/api.js?2021112223"></script> <script src="/static/js/api.js?2021112223"></script>
{% if text.data.view == 'player' %} {% if text.data.view == 'player' %}

View file

@ -18,6 +18,7 @@ def index(request):
context = {} context = {}
context['films'] = Film.objects.filter(public=True).count() context['films'] = Film.objects.filter(public=True).count()
context['texts'] = Text.objects.filter(public=True).count() context['texts'] = Text.objects.filter(public=True).count()
context['stream_prefix'] = get_stream_prefix(request)
featured = Film.objects.filter(featured=True) featured = Film.objects.filter(featured=True)
featured_count = featured.count() featured_count = featured.count()
if featured_count: if featured_count:

View file

@ -11,6 +11,8 @@ from . import models
logger = logging.getLogger(__name__) logger = logging.getLogger(__name__)
stream_prefix_cache = {}
def get_ip(request): def get_ip(request):
if 'HTTP_X_FORWARDED_FOR' in request.META: if 'HTTP_X_FORWARDED_FOR' in request.META:
ip = request.META['HTTP_X_FORWARDED_FOR'].split(',')[0] ip = request.META['HTTP_X_FORWARDED_FOR'].split(',')[0]
@ -21,17 +23,17 @@ def get_ip(request):
return ip return ip
def get_stream_prefix(request): def get_stream_prefix(request):
return settings.DEFAULT_PANDORA_API.replace('/api/', '/') #domain = settings.DEFAULT_PANDORA_API.split('/')[2]
''' domain = 'njp.ma'
domain = settings.DEFAULT_PANDORA_API.split('/')[3] prefix = "https://media.v1.%s" % domain
prefix = "https://v2.%s/" % domain
cdn = { cdn = {
'Eastern Asia': "https://v1.%s/" % domain, 'Eastern Asia': "https://media.v2.%s" % domain,
'Southern Asia': "https://v1.%s/" % domain, 'Southern Asia': "https://media.v2.%s" % domain,
'Asia': "https://v1.%s/" % domain, 'Asia': "https://media.v2.%s" % domain,
} }
'''
ip = get_ip(request) ip = get_ip(request)
if ip in stream_prefix_cache:
return stream_prefix_cache[ip]
try: try:
g = GeoIP2() g = GeoIP2()
country = g.country(ip) country = g.country(ip)
@ -42,15 +44,19 @@ def get_stream_prefix(request):
location = info.get(key) location = info.get(key)
#print(location) #print(location)
if location in cdn: if location in cdn:
stream_prefix_cache[ip] = cdn[location]
return cdn[location] return cdn[location]
except: except:
logger.error('using default prefix, no geoip data found, run ./mange.py update_geoio', exc_info=True) logger.error('using default prefix, no geoip data found, run ./mange.py update_geoio', exc_info=True)
stream_prefix_cache[ip] = prefix
return prefix return prefix
stream_prefix_cache[ip] = prefix
return prefix return prefix
def films(request): def films(request):
context = {} context = {}
context['films'] = models.Film.objects.filter(public=True).order_by('position', 'data__title') context['films'] = models.Film.objects.filter(public=True).order_by('position', 'data__title')
context['stream_prefix'] = get_stream_prefix(request)
context['settings'] = settings context['settings'] = settings
return render(request, 'films.html', context) return render(request, 'films.html', context)
@ -66,10 +72,10 @@ def film_play(request, slug, id):
context = {} context = {}
context['settings'] = settings context['settings'] = settings
context['config'] = json.dumps({ context['config'] = json.dumps({
'stream_prefix': get_stream_prefix(request),
'layer': 'transcripts', 'layer': 'transcripts',
'item': id 'item': id
}) })
context['stream_prefix'] = get_stream_prefix(request)
context['pandora_url'] = settings.DEFAULT_PANDORA_API.replace('/api/', '') context['pandora_url'] = settings.DEFAULT_PANDORA_API.replace('/api/', '')
return render(request, 'film_play.html', context) return render(request, 'film_play.html', context)