Unhandled Promise Rejection: [object DOMError]

Hello @jonathan @Daniel

when click play on the video, it shows:

[Error] Unhandled Promise Rejection: [object DOMError]
(anonymous function)
rejectPromise

Screenshot here:


and here is my setting in Hype:

This test project is upload to sever by FTP, and screenshot:

Project url : https://lovcour.com/lovcourecodev/lovcourecodev.html

The video play well in Chrome and Firefox, but it does not play in Safari.

How to fix this error please?

Alex

When I play that video in Safari, it shows a / over the play button, which usual has something to do with Mime types. Our server shows a mime-type / content-type of: content-type: video/mp4 for that video (and it plays), so I recommend ensuring that files with the extension .m4v are served with the content-type of video/mp4 on your server.

You can test what content type is being served by typing:

curl -I https://lovcour.com/lovcourecodev/lovcourecodev.hyperesources/美到没有偏见%201.m4v in terminal. For that file, I get:

This htaccess file has a line in it (46) which would set the mime type correctly: https://github.com/h5bp/server-configs-nginx/blob/master/mime.types

Chrome and Firefox are likely disregarding the mime type and doing their best, whereas Safari is being more strict.

Ok, thanks, I will test, do you mean the screenshot show the sever does not support this video?

I am using niginx, should I input that confirms lines into our nginx config please?

Alex

The content-type is set as video/x-m4v and I don’t think Safari knows what to do what that. It prefers video/mp4 for that.

That file appears to be here: /etc/nginx/mime.types but I’m not familiar with this. Check out: https://stackoverflow.com/a/19630564

@Daniel,

For test purpose, I upload a new Hype project in which I embed a sample video, which is downloaded from a video Pro site, and guarantee the video format is mp4.

unfortunately, it still only not work in Safari:

Here is the page: https://lovcour.com/testvideo/testvideo.html

Here are some steps:

1# what I checked by:

curl -I https://lovcour.com/testvideo/testvideo.hyperesources/mp4_video.mp4

Show:

root@lovcour:~# curl -I https://lovcour.com/testvideo/testvideo.hyperesources/mp4_video.mp4
HTTP/1.1 200 OK
Server: nginx
Date: Wed, 09 May 2018 15:30:38 GMT
Content-Type: video/mp4
Connection: keep-alive
ETag: “5af3132b-4fde13”
Expires: Thu, 31 Dec 2037 23:55:55 GMT
Cache-Control: max-age=315360000
Access-Control-Allow-Origin: *

root@lovcour:~#


2# Also, I check what type of mime support on our wordpress by using this plugin: Mime Types Plus(https://wordpress.org/plugins/mime-types-plus/)

and I found it support both mp4 and m4v, here is screenshot: http://prntscr.com/jfqnk9

3~# /usr/sbin/nginx -t
nginx: the configuration file /etc/nginx/nginx.conf syntax is ok
nginx: configuration file /etc/nginx/nginx.conf test is successful

4.~# cat /etc/nginx/nginx.conf
user www-data;
worker_processes auto;
worker_rlimit_nofile 100000;
pid /run/nginx.pid;

events {
worker_connections 4096;
multi_accept on;
}

http {
##
# EasyEngine Settings
##

sendfile on;
tcp_nopush on;
tcp_nodelay on;
keepalive_timeout 30;
types_hash_max_size 2048;

server_tokens off;
reset_timedout_connection on;
add_header X-Powered-By "EasyEngine 3.7.4";
add_header rt-Fastcgi-Cache $upstream_cache_status;

# Limit Request
limit_req_status 403;
limit_req_zone $binary_remote_addr zone=one:10m rate=1r/s;

# Proxy Settings
# set_real_ip_from	proxy-server-ip;
# real_ip_header	X-Forwarded-For;

fastcgi_read_timeout 300;
client_max_body_size 100m;

##
# SSL Settings
##

ssl_session_cache shared:SSL:20m;
ssl_session_timeout 10m;
ssl_prefer_server_ciphers on;
ssl_ciphers 

ssl_protocols TLSv1 TLSv1.1 TLSv1.2;

##
# Basic Settings
##
# server_names_hash_bucket_size 64;
# server_name_in_redirect off;

**_include /etc/nginx/mime.types;_**
default_type application/octet-stream;

##
# Logging Settings
##

access_log /var/log/nginx/access.log;
error_log /var/log/nginx/error.log;

# Log format Settings
log_format rt_cache '$remote_addr $upstream_response_time $upstream_cache_status [$time_local] '
'$http_host "$request" $status $body_bytes_sent '
'"$http_referer" "$http_user_agent"';

##
# Gzip Settings
##

gzip on;
gzip_disable "msie6";

gzip_vary on;
gzip_proxied any;
gzip_comp_level 6;
gzip_buffers 16 8k;
gzip_http_version 1.1;
gzip_types
    application/atom+xml
    application/javascript
    application/json
    application/rss+xml
    application/vnd.ms-fontobject
    application/x-font-ttf
    application/x-web-app-manifest+json
    application/xhtml+xml
    application/xml
    font/opentype
    image/svg+xml
    image/x-icon
    text/css
    text/plain
    text/x-component
    text/xml
    text/javascript;

##
# Virtual Host Configs
##

include /etc/nginx/conf.d/*.conf;
include /etc/nginx/sites-enabled/*;

}

#mail {

# See sample authentication script at:

# http://wiki.nginx.org/ImapAuthenticateWithApachePhpScript

# auth_http localhost/auth.php;

# pop3_capabilities “TOP” “USER”;

# imap_capabilities “IMAP4rev1” “UIDPLUS”;

server {

listen localhost:110;

protocol pop3;

proxy on;

}

server {

listen localhost:143;

protocol imap;

proxy on;

}

#}

5.# cat /etc/nginx/mime.types

types {
text/html html htm shtml;
text/css css;
text/xml xml;
image/gif gif;
image/jpeg jpeg jpg;
application/javascript js;
application/atom+xml atom;
application/rss+xml rss;

text/mathml                           mml;
text/plain                            txt;
text/vnd.sun.j2me.app-descriptor      jad;
text/vnd.wap.wml                      wml;
text/x-component                      htc;

image/png                             png;
image/tiff                            tif tiff;
image/vnd.wap.wbmp                    wbmp;
image/x-icon                          ico;
image/x-jng                           jng;
image/x-ms-bmp                        bmp;
image/svg+xml                         svg svgz;
image/webp                            webp;

application/font-woff                 woff;
application/java-archive              jar war ear;
application/json                      json;
application/mac-binhex40              hqx;
application/msword                    doc;
application/pdf                       pdf;
application/postscript                ps eps ai;
application/rtf                       rtf;
application/vnd.apple.mpegurl         m3u8;
application/vnd.ms-excel              xls;
application/vnd.ms-fontobject         eot;
application/vnd.ms-powerpoint         ppt;
application/vnd.wap.wmlc              wmlc;
application/vnd.google-earth.kml+xml  kml;
application/vnd.google-earth.kmz      kmz;
application/x-7z-compressed           7z;
application/x-cocoa                   cco;
application/x-java-archive-diff       jardiff;
application/x-java-jnlp-file          jnlp;
application/x-makeself                run;
application/x-perl                    pl pm;
application/x-pilot                   prc pdb;
application/x-rar-compressed          rar;
application/x-redhat-package-manager  rpm;
application/x-sea                     sea;
application/x-shockwave-flash         swf;
application/x-stuffit                 sit;
application/x-tcl                     tcl tk;
application/x-x509-ca-cert            der pem crt;
application/x-xpinstall               xpi;
application/xhtml+xml                 xhtml;
application/xspf+xml                  xspf;
application/zip                       zip;

application/octet-stream              bin exe dll;
application/octet-stream              deb;
application/octet-stream              dmg;
application/octet-stream              iso img;
application/octet-stream              msi msp msm;

application/vnd.openxmlformats-officedocument.wordprocessingml.document    docx;
application/vnd.openxmlformats-officedocument.spreadsheetml.sheet          xlsx;
application/vnd.openxmlformats-officedocument.presentationml.presentation  pptx;

audio/midi                            mid midi kar;
audio/mpeg                            mp3;
audio/ogg                             ogg;
audio/x-m4a                           m4a;
audio/x-realaudio                     ra;

video/3gpp                            3gpp 3gp;
video/mp2t                            ts;
video/mp4                             mp4;
video/mpeg                            mpeg mpg;
video/quicktime                       mov;
video/webm                            webm;
video/x-flv                           flv;
video/x-m4v                           m4v;
video/x-mng                           mng;
video/x-ms-asf                        asx asf;
video/x-ms-wmv                        wmv;
video/x-msvideo                       avi;

}

obviously, the video format is already included in mime type.

Any further more instruction would be appreciated.

Alex

This video does not play for me in any major browser (Safari, Chrome, Firefox, Opera - latest versions).

Firefox: “No video with supported format and MIME type found”.

@JimScott

do you mean this one please?

"https://lovcour.com/testvideo/testvideo.hyperesources/mp4_video.mp4"
worked in Chrome & Firefox.

However the URL in your first post did not work with any browser (as per my previous post):
https://lovcour.com/lovcourecodev/lovcourecodev.html

404 :slight_smile:

1 Like

sorry, I temporarily move it for test, and you can test now, and I just suppose same issue.

https://lovcour.com/lovcourecodev/lovcourecodev.hyperesources/美到没有偏见%201.m4v

Hello,

I updated mime.type exactly same with the one at: https://github.com/h5bp/server-configs-nginx/blob/master/mime.types

but still not play in safari.

cat /etc/nginx/mime.types

types {

Data interchange

application/atom+xml                  atom;
application/json                      json map topojson;
application/ld+json                   jsonld;
application/rss+xml                   rss;
application/vnd.geo+json              geojson;
application/xml                       rdf xml;

JavaScript

# Normalize to standard type.
# https://tools.ietf.org/html/rfc4329#section-7.2
application/javascript                js;

Manifest files

application/manifest+json             webmanifest;
application/x-web-app-manifest+json   webapp;
text/cache-manifest                   appcache;

Media files

audio/midi                            mid midi kar;
audio/mp4                             aac f4a f4b m4a;
audio/mpeg                            mp3;
audio/ogg                             oga ogg opus;
audio/x-realaudio                     ra;
audio/x-wav                           wav;
image/bmp                             bmp;
image/gif                             gif;
image/jpeg                            jpeg jpg;
image/jxr                             jxr hdp wdp;
image/png                             png;
image/svg+xml                         svg svgz;
image/tiff                            tif tiff;
image/vnd.wap.wbmp                    wbmp;
image/webp                            webp;
image/x-jng                           jng;
video/3gpp                            3gp 3gpp;
video/mp4                             f4p f4v m4v mp4;
video/mpeg                            mpeg mpg;
video/ogg                             ogv;
video/quicktime                       mov;
video/webm                            webm;
video/x-flv                           flv;
video/x-mng                           mng;
video/x-ms-asf                        asf asx;
video/x-ms-wmv                        wmv;
video/x-msvideo                       avi;

# Serving `.ico` image files with a different media type
# prevents Internet Explorer from displaying then as images:
# https://github.com/h5bp/html5-boilerplate/commit/37b5fec090d00f38de64b591bcddcb205aadf8ee

image/x-icon                          cur ico;

Microsoft Office

application/msword                                                         doc;
application/vnd.ms-excel                                                   xls;
application/vnd.ms-powerpoint                                              ppt;
application/vnd.openxmlformats-officedocument.wordprocessingml.document    docx;
application/vnd.openxmlformats-officedocument.spreadsheetml.sheet          xlsx;
application/vnd.openxmlformats-officedocument.presentationml.presentation  pptx;

Web fonts

application/font-woff                 woff;
application/font-woff2                woff2;
application/vnd.ms-fontobject         eot;

# Browsers usually ignore the font media types and simply sniff
# the bytes to figure out the font type.
# https://mimesniff.spec.whatwg.org/#matching-a-font-type-pattern
#
# However, Blink and WebKit based browsers will show a warning
# in the console if the following font types are served with any
# other media types.

application/x-font-ttf                ttc ttf;
font/opentype                         otf;

Other

application/java-archive              ear jar war;
application/mac-binhex40              hqx;
application/octet-stream              bin deb dll dmg exe img iso msi msm msp safariextz;
application/pdf                       pdf;
application/postscript                ai eps ps;
application/rtf                       rtf;
application/vnd.google-earth.kml+xml  kml;
application/vnd.google-earth.kmz      kmz;
application/vnd.wap.wmlc              wmlc;
application/x-7z-compressed           7z;
application/x-bb-appworld             bbaw;
application/x-bittorrent              torrent;
application/x-chrome-extension        crx;
application/x-cocoa                   cco;
application/x-java-archive-diff       jardiff;
application/x-java-jnlp-file          jnlp;
application/x-makeself                run;
application/x-opera-extension         oex;
application/x-perl                    pl pm;
application/x-pilot                   pdb prc;
application/x-rar-compressed          rar;
application/x-redhat-package-manager  rpm;
application/x-sea                     sea;
application/x-shockwave-flash         swf;
application/x-stuffit                 sit;
application/x-tcl                     tcl tk;
application/x-x509-ca-cert            crt der pem;
application/x-xpinstall               xpi;
application/xhtml+xml                 xhtml;
application/xslt+xml                  xsl;
application/zip                       zip;
text/css                              css;
text/csv                              csv;
text/html                             htm html shtml;
text/markdown                         md;
text/mathml                           mml;
text/plain                            txt;
text/vcard                            vcard vcf;
text/vnd.rim.location.xloc            xloc;
text/vnd.sun.j2me.app-descriptor      jad;
text/vnd.wap.wml                      wml;
text/vtt                              vtt;
text/x-component                      htc;

}

I wonder if this is related to these issues questioned on Stackoverflow…

Which looks like Safari is expecting a stream from the server but if indeed you server is a blob server then it is not sending a stream so safari does not get the responsse it is looking for.

Hi Mark,

Thanks. I check that, that seems alternative way, but also means lots of work to setup anther environment.

does that mean only Streaming video playing support Safari?

If so, I am quite confused why these video play well with Safari in non-ssl server,…:grin:I mean these video play well in Safari too before SSL setup on our site.

Thanks.

Alex

Sorry I may be misleading you there… I got

Failed to https://lovcour.com/testvideo/testvideo.hyperesources/mp4_video.mp4 load resource: Plug-in handled load

In Safari, which is why I posted the above, but that maybe a red herring as I just drop a local mp4 on to safari and got the same error… but it played.

I downloaded yours and that plays also but gives me the error I mention so please ignore my last post.

Thanks.

I never try locally play video in Safari, GREAT way to test👍

Hi @Daniel @h_classen @JimScott
Thanks all,

And I happily to let you know the video play issue was resolved by migrating site from HHVM to php7.

2 Likes