【问题标题】:404 error when using Jade/Pug to output audio on a webpage使用 Jade/Pug 在网页上输出音频时出现 404 错误
【发布时间】:2017-05-01 23:27:18
【问题描述】:

我正在尝试通过网页使用 IBM Watson Text to Speech api。在网页上,我有一个表格,其中包含用户想要阅读的句子或单词和一个按钮“SPEAK!”完成并读取表单输入。我的问题是,当我在控制台中查看以确保一切顺利时,我发现找不到我的音频文件。

App.js -- 这是连接到 api 的代码,然后将合成的代码发送到可以访问它们的“audioFiles/Output.ogg”。

var input;
app.get("/speech", function(req, res, next) {
 input = req.query.speech;
 const TextToSpeechV1 = require('watson-developer-cloud/text-to-speech/v1');
 const fs = require('file-system');
 if(input) {
   var intentValNumber = input.length;
 }
 console.log(intentValNumber);
 if (intentValNumber > 0) {
   const text_to_speech = new TextToSpeechV1({
       url: "URL is here",
       username: 'UserName is here',
       password: 'PassWord is here',
       version_date: TextToSpeechV1.VERSION_DATE_2017_04_26
     });
     var params = {
       text: input,
       voice: 'en-US_MichaelVoice',
       accept: 'audio/ogg'
     };
     console.log(input);
  // Pipe the synthesized text to a file.
   text_to_speech.synthesize(params).on('error', function(error) {
     console.log('Error:', error);
   }).pipe(fs.createWriteStream('audioFiles/output.ogg'));
 };
next();
});

speech.pug -- 这是表单和音频应该执行的地方。

extends layout

block content
 .main.container.row
  .col-md-6.col-md-offset-3
    h1.display-4.m-b-2 Magic Reading!
     form(method="GET" action="/speech")
      div.form-group
       label(for='speech') Type something to be spoken:
       input#speech.form-control(type='text', placeholder='Type something to be read' name='speech')
       button.btn.btn-primary(type='submit') SPEAK!
       audio(controls='', autoplay='')
         source(src='../audioFiles/output.ogg', type='audio/ogg')

具体错误 - GET http://localhost:3000/audioFiles/output.ogg

提前感谢您的任何建议!如果有人需要有关错误或代码的更多信息,也请告诉我。

编辑——这是我的目录结构的简化版本...

 Project
  |
  +-- audioFiles(folder)
  |   |
  |   + - output.ogg
  |   + - music.mp3
  |
  +-- public(folder)
  |     |
  |     + - images(folder)
  |     + - stylesheets(folder)
  |    
  +-- routes(folder)
  |    |  
  |    +-- index.js
  |    
  +-- views(folder)
  |    |  
  |    +-- speech.pug
  |    
  + -- app.js

【问题讨论】:

  • 服务器上是否存在audioFiles/output.ogg?如果是,那么您在加载静态内容时遇到问题。
  • @Mukesh Sharma 是的,它确实存在于服务器上。如果我在加载静态内容时遇到问题,我该如何解决?
  • 酷。显示您的目录结构。你必须使用express.static
  • @Mukesh Sharma 我用目录结构在我的主帖中添加了一个编辑。
  • 我只是在阅读有关静态文件的内容,它说静态文件是不会根据用户输入或操作而改变的文件,但是我的音频文件会根据给定的表单输入而改变。那仍然是静态文件还是我有其他问题而不是加载静态文件时出错?

标签: node.js text-to-speech ibm-watson


【解决方案1】:

在您的app.js 中添加以下行

app.use("/audioFiles", express.static(path.join(__dirname, "audioFiles")))

那么,http://localhost:3000/audioFiles/output.ogg 不应该给404 错误。

【讨论】:

  • 非常感谢!它确实摆脱了 404 错误,并在页面上发出音频!再问一个问题,这可能会完全将您引向另一个方向……静态文件可以“即时”更新还是实时更新?我在最近的评论/回复中提到,当输入更改时,我的音频文件需要更改。静态文件有能力像这样改变吗?抱歉,如果这完全改变了我最初提出的问题。
  • static 是一个模糊的术语。是的,如果基础文件发生变化,url 将提供最新内容。
  • 我一直在尝试你给我的代码,效果很好,只有一个问题。当我的音频文件更改时,该站点不会提供新音频,而是提供以前的音频文件。我注意到它只有在我离开网站然后回来时才会改变。我需要它在音频文件更改后立即更改。我怎样才能做到这一点?我的一部分认为,除了“express.static”方法之外,我还需要其他一些技术......
猜你喜欢
  • 1970-01-01
  • 2016-11-13
  • 1970-01-01
  • 1970-01-01
  • 2017-01-23
  • 2020-05-10
  • 2014-09-12
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多