I'm using nodebob for making a nodewebkit (nw.js) desktop app, but the MP4 videos wouldn't play in it ... what should I do?
I tried putting ffmpegso.dll in the same folder where my release exe is but no use
If i use webm video the following code works but for mp4 it says file not found
Here's the code I'm using
<html>
<head>
<meta charset='utf-8'>
<title>Secure Video Browsing</title>
<link rel="icon" type="image/png" href="hammer.png" />
<link rel="stylesheet" href="js/floplayer/skin/skin.css">
<!-- 3. flowplayer -->
<script src="js/floplayer/flowplayer.min.js"></script>
<script>
var encryptor = require('file-encryptor');
var $ = require('jquery');
var path = require('path');
var gui = require('nw.gui');
var win = gui.Window.get();
var key = 'My Super Secret Key';
var options = {algorithm: 'aes256'};
window.addEventListener('keydown', function (e) {
e.preventDefault();
});
var execPath = path.dirname(process.execPath);
$(document).ready(function () {
$(".close").click(function () {
win.close();
});
encryptor.decryptFile(execPath + '/wild.eng', execPath + '/wild.mp4', key, options, function (err) {
var container = document.getElementById("player");
flowplayer(container, {
clip: {
sources: [
{type: "video/mp4",
src: execPath + '/wild.mp4'}
]
}
});
});
});
</script>
</head>
<body>
<button class="close">Close</button>
<div id="player">
</div>
</body>
The easiest way to enable proprietary codecs is to download community binaries for the matching NW.js version number you are using:
https://github.com/iteufel/nwjs-ffmpeg-prebuilt/releases
More information is here:
https://nwjs.readthedocs.io/en/latest/For%20Developers/Enable%20Proprietary%20Codecs/
Related
I would like to know if it is possible to capture the audio that plays through the Websocket protocol using Chrome DevTools
Under Network, I do see a Websocket entry after the audio begins to play.
It is listed as wss://eastus.tts.speech.microsoft.com/cognitiveservices/websocket/v1?Authorization=RandomCharacterConnectionId=IDGoesHere
I checked it's Headers and Messages but it seems there is no way to get a hold of the audio file.
Any suggestions?
Example is here
https://azure.microsoft.com/en-us/services/cognitive-services/text-to-speech/
Thanks
If you want to save the resulting audio as .mp3 file, just try code below:
<!DOCTYPE html>
<html lang="en">
<head>
<title>Microsoft Cognitive Services Speech SDK JavaScript Quickstart</title>
<meta charset="utf-8" />
</head>
<body>
<button id="startSpeakTextAsyncButton" onclick="synthesizeSpeech()">speak</button>
<script src="microsoft.cognitiveservices.speech.sdk.bundle.js"></script>
<script>
function synthesizeSpeech() {
var speechConfig = SpeechSDK.SpeechConfig.fromSubscription("", "");
speechConfig.SpeechSynthesisLanguage = "en-US";
const synthesizer = new SpeechSDK.SpeechSynthesizer(speechConfig);
synthesizer.speakTextAsync(
"Hello , this is a demo about saving result of TTS API as a file",
result => {
synthesizer.close();
const link = document.createElement( 'a' );
link.style.display = 'none';
document.body.appendChild( link );
const blob = new Blob( [result.audioData], { type: 'audio/mp3' } );
const objectURL = URL.createObjectURL( blob );
link.href = objectURL;
link.href = URL.createObjectURL( blob );
link.download = 'data.mp3';
link.click();
},
error => {
console.log(error);
synthesizer.close();
});
}
</script>
</body>
</html>
structure:
Result:
Goal: To read a part/particular section of file using NodeJS.
My code:
fs = require('fs')
fs.readFile('/test/index.html', 'utf8', function (err,data) {
if (err) {
return console.log(err);
}
console.log(data);
});
Problem: This is reading whole file. And i want to read the text between body tag of html file.
Output in console:
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
<h2>Card</h2>
<div class="card">
<img src="https://www.w3schools.com/howto/img_avatar.png" alt="Avatar" style="width:100%">
<div class="container">
<h4><b>John Doe</b></h4>
<p>Engineer</p>
</div>
</div>
</body>
</html>
You need parse the text, and extract the desired part.
using Regex its possible but problematic.
for parse html its recommended use cheerio (see example), in your case (select by node) you can also use "simple" xml reader as xml2js.
using cheerio :
const cheerio = require('cheerio')
fs = require('fs')
fs.readFile('/test/index.html', 'utf8', function (err,data) {
if (err) {
return console.log(err);
}
const $ = cheerio.load(data);
console.log($('body'));
});
I am using a sample project from auth0.com to customize the login page for my app and enable social media login. However I encounter some problem when I try to deploy it to bluemix.
The video tutorial I follow is https://www.youtube.com/watch?v=sHhNoV-sS_I&t=559s
however the sample project is a little bit different from the one in video. It required the command "npm serve" to run it. When I push my project using cf push it shows noappdecked. How can I deploy my project to bluemix?
the app.js code and html code is like
<!DOCTYPE html>
<html>
<head>
<title>Auth0-VanillaJS</title>
<meta charset="utf-8">
<!-- Auth0 lock script -->
<script src="//cdn.auth0.com/js/lock/10.3.0/lock.min.js"></script>
<script src="auth0-variables.js"></script>
<script src="app.js"></script>
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
<img alt="avatar" id="avatar" style="display:none;">
<p>Welcome <span id="nickname"></span></p>
<button type="submit" id="btn-login">Sign In</button>
<button type="submit" id="btn-logout" style="display:none;">Sign Out</button>
</body>
window.addEventListener('load', function() {
var lock = new Auth0Lock(AUTH0_CLIENT_ID, AUTH0_DOMAIN);
// buttons
var btn_login = document.getElementById('btn-login');
var btn_logout = document.getElementById('btn-logout');
btn_login.addEventListener('click', function() {
lock.show();
});
btn_logout.addEventListener('click', function() {
logout();
});
lock.on("authenticated", function(authResult) {
lock.getProfile(authResult.idToken, function(error, profile) {
if (error) {
// Handle error
return;
}
localStorage.setItem('id_token', authResult.idToken);
// Display user information
show_profile_info(profile);
});
});
//retrieve the profile:
var retrieve_profile = function() {
var id_token = localStorage.getItem('id_token');
if (id_token) {
lock.getProfile(id_token, function (err, profile) {
if (err) {
return alert('There was an error getting the profile: ' + err.message);
}
// Display user information
show_profile_info(profile);
});
}
};
var show_profile_info = function(profile) {
var avatar = document.getElementById('avatar');
document.getElementById('nickname').textContent = profile.nickname;
btn_login.style.display = "none";
avatar.src = profile.picture;
avatar.style.display = "block";
btn_logout.style.display = "block";
};
var logout = function() {
localStorage.removeItem('id_token');
window.location.href = "/";
};
retrieve_profile();
});
You would use the package.json method documented at https://console.ng.bluemix.net/docs/runtimes/nodejs/index.html#nodejs_runtime , first to declare the serve package as one of your dependencies, then to indicate what the scripts.start script should do (which is run npm serve). You can use npm init (https://docs.npmjs.com/cli/init) to create a starting package.json file if you don't already have one.
I'm currently trying to make Opus packets work with Web Audio API. The problem is however, while it should be natively supported by FireFox and Chrome, only FireFox can decode a stream of OPUS samples using decodeAudioData from the Web Audio API. Chrome does recognize the file when I drag the opus file into the browser and it also does play it! So I'm wondering that I may be doing something wrong here causing failure in Chrome.
Then I used some sample code from http://awm.jp/~yoya/js/audio/meow.html just load an opus file and try to decode it. Again Firefox does, and Chrome doesn't. So I'm wondering if someone can confirm my finding or tell me what I'm doing wrong here. Below is the modified version from the earlier link. Thanks!
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-15">
<title> decodeAudioData sample </title>
</head>
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script type="text/javascript">
//$(document).ready(function() {
var catMeowingBuffer = null;
window.AudioContext = window.AudioContext||window.webkitAudioContext;
var context = new AudioContext();
function onError(err) {
console.log("unable to decode");
}
function loadCatSound(url) {
var request = new XMLHttpRequest();
request.open('GET', url, true);
request.responseType = 'arraybuffer';
// Decode asynchronously
request.onload = function() {
context.decodeAudioData(request.response, function(buffer) {
catMeowingBuffer = buffer;
var src = context.createBufferSource();
src.buffer = catMeowingBuffer
src.connect(context.destination);
src.start(0);
}, onError);
}
request.send();
}
loadCatSound("opus.opus");
function playCatSound() {
if (catMeowingBuffer !== null) {
var src = context.createBufferSource();
src.buffer = catMeowingBuffer
src.connect(context.destination);
src.start(0);
}
}
//});
</script>
<body>
<h1> decodeAudioData sample </h1>
<button onclick="playCatSound();"> playCatSound </button>
<hr>
<address></address>
</body> </html>
This is a bug in Chrome. See https://code.google.com/p/chromium/issues/detail?id=409402.
I am trying to load local javascripts with jsdom.
Now I am wondering how I can make jsdom loading the javascripts from "__dirname/../public".
Can someone help me?
My current code is:
var fs = require('fs');
var jsdom = require('jsdom');
jsdom.defaultDocumentFeatures = {
FetchExternalResources: ["script"],
ProcessExternalResources: ["script"],
MutationEvents : '2.0',
QuerySelector : false
};
exports.test = function(req, res) {
var html = fs.readFileSync(__dirname+'/../public/html/lame.html');
var document = jsdom.jsdom(html, null, {documentRoot: __dirname+'/../public/'});
var window = document.createWindow();
window.addEventListener('load', function () {
//window.$('script').remove();
//window.$('[id]').removeAttr('id');
res.send(window.document.innerHTML);
window.close();
});
}
The simple HTML page is:
<html>
<head>
<title id="title">bum</title>
<script type="text/javascript" src="/javascripts/jquery.min.js"></script>
<script type="text/javascript" src="/javascripts/stuff.js"></script>
</head>
<body>
<h1>hello world</h1>
<h2 id="bam">XXX</h2>
</body>
</html>
I've run into the same issue and got it to work. Try these, in order:
documentRoot is not documented. The option which is documented is url. So replace documentRoot with url.
If the above is not enough, then add a base element. I've set my templates like this:
<head>
<base href="#BASE#"></base>
<!-- ... -->
</head>
where #BASE# is replaced with the same value as the one passed to url.
The solutions above are extracted from actual code in use in a test suite.