Android - keep playing audio with HTML5 javascript when Internet drops - fetch, blob [duplicate]
up vote
0
down vote
favorite
This question already has an answer here:
Pre-loaded sounds being unloaded?
2 answers
I'd like to preload an entire mp3 file so the page keeps working on computer and mobile when Internet drops. I found and tried the following code which appears to work on my Windows 7 desktop, but not my Android. The Android doesn't fail on the fetch statement but appears to fail on the ".then(r => r.blob())" statement. Should r be declared first? Any ideas why android fails. I haven't been able to access the Android console.
fetch("https://foo.com/foo2/foo4.mp3")
.then(r => r.blob()) // could be xhr.responseType = 'blob'
.then(blob => {
aud = new Audio(URL.createObjectURL(blob));
document.body.appendChild(aud);
console.log('Fully loaded and cached until the page dies...')
});
javascript html5 audio preload
asked Nov 20 at 3:11
user3055937
11
marked as duplicate by Nick, SherylHohman, Kaiido javascript
Users with the javascript badge can single-handedly close javascript questions as duplicates and reopen them as needed.
StackExchange.ready(function() {
if (StackExchange.options.isMobile) return;
$('.dupe-hammer-message-hover:not(.hover-bound)').each(function() {
var $hover = $(this).addClass('hover-bound'),
$msg = $hover.siblings('.dupe-hammer-message');
$hover.hover(
function() {
$hover.showInfoMessage('', {
messageElement: $msg.clone().show(),
transient: false,
position: { my: 'bottom left', at: 'top center', offsetTop: -7 },
dismissable: false,
relativeToBody: true
});
},
function() {
StackExchange.helpers.removeMessages();
}
);
});
});
Nov 20 at 5:22
This question has been asked before and already has an answer. If those answers do not fully address your question, please ask a new question.
add a comment |
up vote
0
down vote
favorite
This question already has an answer here:
Pre-loaded sounds being unloaded?
2 answers
I'd like to preload an entire mp3 file so the page keeps working on computer and mobile when Internet drops. I found and tried the following code which appears to work on my Windows 7 desktop, but not my Android. The Android doesn't fail on the fetch statement but appears to fail on the ".then(r => r.blob())" statement. Should r be declared first? Any ideas why android fails. I haven't been able to access the Android console.
fetch("https://foo.com/foo2/foo4.mp3")
.then(r => r.blob()) // could be xhr.responseType = 'blob'
.then(blob => {
aud = new Audio(URL.createObjectURL(blob));
document.body.appendChild(aud);
console.log('Fully loaded and cached until the page dies...')
});
javascript html5 audio preload
asked Nov 20 at 3:11
user3055937
11
marked as duplicate by Nick, SherylHohman, Kaiido javascript
Users with the javascript badge can single-handedly close javascript questions as duplicates and reopen them as needed.
StackExchange.ready(function() {
if (StackExchange.options.isMobile) return;
$('.dupe-hammer-message-hover:not(.hover-bound)').each(function() {
var $hover = $(this).addClass('hover-bound'),
$msg = $hover.siblings('.dupe-hammer-message');
$hover.hover(
function() {
$hover.showInfoMessage('', {
messageElement: $msg.clone().show(),
transient: false,
position: { my: 'bottom left', at: 'top center', offsetTop: -7 },
dismissable: false,
relativeToBody: true
});
},
function() {
StackExchange.helpers.removeMessages();
}
);
});
});
Nov 20 at 5:22
This question has been asked before and already has an answer. If those answers do not fully address your question, please ask a new question.
add a comment |
up vote
0
down vote
favorite
up vote
0
down vote
favorite
This question already has an answer here:
Pre-loaded sounds being unloaded?
2 answers
I'd like to preload an entire mp3 file so the page keeps working on computer and mobile when Internet drops. I found and tried the following code which appears to work on my Windows 7 desktop, but not my Android. The Android doesn't fail on the fetch statement but appears to fail on the ".then(r => r.blob())" statement. Should r be declared first? Any ideas why android fails. I haven't been able to access the Android console.
fetch("https://foo.com/foo2/foo4.mp3")
.then(r => r.blob()) // could be xhr.responseType = 'blob'
.then(blob => {
aud = new Audio(URL.createObjectURL(blob));
document.body.appendChild(aud);
console.log('Fully loaded and cached until the page dies...')
});
javascript html5 audio preload
asked Nov 20 at 3:11
user3055937
11
This question already has an answer here:
Pre-loaded sounds being unloaded?
2 answers
I'd like to preload an entire mp3 file so the page keeps working on computer and mobile when Internet drops. I found and tried the following code which appears to work on my Windows 7 desktop, but not my Android. The Android doesn't fail on the fetch statement but appears to fail on the ".then(r => r.blob())" statement. Should r be declared first? Any ideas why android fails. I haven't been able to access the Android console.
fetch("https://foo.com/foo2/foo4.mp3")
.then(r => r.blob()) // could be xhr.responseType = 'blob'
.then(blob => {
aud = new Audio(URL.createObjectURL(blob));
document.body.appendChild(aud);
console.log('Fully loaded and cached until the page dies...')
});
This question already has an answer here:
Pre-loaded sounds being unloaded?
2 answers
javascript html5 audio preload
javascript html5 audio preload
asked Nov 20 at 3:11
user3055937
11
asked Nov 20 at 3:11
user3055937
11
edited Dec 7 at 21:53
asked Nov 20 at 3:11
user3055937
11
asked Nov 20 at 3:11
user3055937
11
asked Nov 20 at 3:11
user3055937
11
11
marked as duplicate by Nick, SherylHohman, Kaiido javascript
Users with the javascript badge can single-handedly close javascript questions as duplicates and reopen them as needed.
StackExchange.ready(function() {
if (StackExchange.options.isMobile) return;
$('.dupe-hammer-message-hover:not(.hover-bound)').each(function() {
var $hover = $(this).addClass('hover-bound'),
$msg = $hover.siblings('.dupe-hammer-message');
$hover.hover(
function() {
$hover.showInfoMessage('', {
messageElement: $msg.clone().show(),
transient: false,
position: { my: 'bottom left', at: 'top center', offsetTop: -7 },
dismissable: false,
relativeToBody: true
});
},
function() {
StackExchange.helpers.removeMessages();
}
);
});
});
Nov 20 at 5:22
This question has been asked before and already has an answer. If those answers do not fully address your question, please ask a new question.
marked as duplicate by Nick, SherylHohman, Kaiido javascript
Users with the javascript badge can single-handedly close javascript questions as duplicates and reopen them as needed.
StackExchange.ready(function() {
if (StackExchange.options.isMobile) return;
$('.dupe-hammer-message-hover:not(.hover-bound)').each(function() {
var $hover = $(this).addClass('hover-bound'),
$msg = $hover.siblings('.dupe-hammer-message');
$hover.hover(
function() {
$hover.showInfoMessage('', {
messageElement: $msg.clone().show(),
transient: false,
position: { my: 'bottom left', at: 'top center', offsetTop: -7 },
dismissable: false,
relativeToBody: true
});
},
function() {
StackExchange.helpers.removeMessages();
}
);
});
});
Nov 20 at 5:22
This question has been asked before and already has an answer. If those answers do not fully address your question, please ask a new question.
add a comment |
add a comment |
1 Answer
1
active
oldest
votes
up vote
0
down vote
There is a preload attribute you can try`
preload
This enumerated attribute is intended to provide a hint to the browser
about what the author thinks will lead to the best user experience. It
may have one of the following values:
- none: Indicates that the audio should not be preloaded.
- metadata: Indicates that only audio metadata (e.g. length) is fetched.
- auto: Indicates that the whole audio file can be downloaded, even if the user is not expected to use it. empty
string: A synonym of the auto value.
If not set, preload's default
value is browser-defined (i.e. each browser may have its own default
value). The spec advises it to be set to metadata.
answered Nov 20 at 4:32
Ron Royston
5,66532437
add a comment |
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
up vote
0
down vote
There is a preload attribute you can try`
preload
This enumerated attribute is intended to provide a hint to the browser
about what the author thinks will lead to the best user experience. It
may have one of the following values:
- none: Indicates that the audio should not be preloaded.
- metadata: Indicates that only audio metadata (e.g. length) is fetched.
- auto: Indicates that the whole audio file can be downloaded, even if the user is not expected to use it. empty
string: A synonym of the auto value.
If not set, preload's default
value is browser-defined (i.e. each browser may have its own default
value). The spec advises it to be set to metadata.
answered Nov 20 at 4:32
Ron Royston
5,66532437
add a comment |
up vote
0
down vote
There is a preload attribute you can try`
preload
This enumerated attribute is intended to provide a hint to the browser
about what the author thinks will lead to the best user experience. It
may have one of the following values:
- none: Indicates that the audio should not be preloaded.
- metadata: Indicates that only audio metadata (e.g. length) is fetched.
- auto: Indicates that the whole audio file can be downloaded, even if the user is not expected to use it. empty
string: A synonym of the auto value.
If not set, preload's default
value is browser-defined (i.e. each browser may have its own default
value). The spec advises it to be set to metadata.
answered Nov 20 at 4:32
Ron Royston
5,66532437
add a comment |
up vote
0
down vote
up vote
0
down vote
There is a preload attribute you can try`
preload
This enumerated attribute is intended to provide a hint to the browser
about what the author thinks will lead to the best user experience. It
may have one of the following values:
- none: Indicates that the audio should not be preloaded.
- metadata: Indicates that only audio metadata (e.g. length) is fetched.
- auto: Indicates that the whole audio file can be downloaded, even if the user is not expected to use it. empty
string: A synonym of the auto value.
If not set, preload's default
value is browser-defined (i.e. each browser may have its own default
value). The spec advises it to be set to metadata.
answered Nov 20 at 4:32
Ron Royston
5,66532437
There is a preload attribute you can try`
preload
This enumerated attribute is intended to provide a hint to the browser
about what the author thinks will lead to the best user experience. It
may have one of the following values:
- none: Indicates that the audio should not be preloaded.
- metadata: Indicates that only audio metadata (e.g. length) is fetched.
- auto: Indicates that the whole audio file can be downloaded, even if the user is not expected to use it. empty
string: A synonym of the auto value.
If not set, preload's default
value is browser-defined (i.e. each browser may have its own default
value). The spec advises it to be set to metadata.
answered Nov 20 at 4:32
Ron Royston
5,66532437
answered Nov 20 at 4:32
Ron Royston
5,66532437
answered Nov 20 at 4:32
Ron Royston
5,66532437
answered Nov 20 at 4:32
Ron Royston
5,66532437
5,66532437
add a comment |
add a comment |
