Spaces:
Running
Running
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8" /> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0" /> | |
| <title>vits-simple-api</title> | |
| <link rel="stylesheet" href="/static/css/bootstrap.min.css" /> | |
| </head> | |
| <body> | |
| <main style="margin: 0 auto; width: 1024px"> | |
| <h1> | |
| <a href="https://github.com/Artrajz/vits-simple-api" target="_blank" style="text-decoration: none; color: black"> vits-simple-api </a> | |
| </h1> | |
| <div> | |
| <label>文档：</label> | |
| <a href="https://github.com/Artrajz/vits-simple-api" target="_blank" style="text-decoration: none; color: black"> https://github.com/Artrajz/vits-simple-api </a> | |
| </div> | |
| <div> | |
| <label>返回speakers(json)：</label> | |
| <a id="speakersLink" href="https://artrajz-vits-simple-api.hf.space/voice/speakers" target="_blank" style="text-decoration: none; color: black"> | |
| https://artrajz-vits-simple-api.hf.space/voice/speakers | |
| </a> | |
| </div> | |
| <div> | |
| <label>简单调用api：</label> | |
| <a id="vitsLink" href="https://artrajz-vits-simple-api.hf.space/voice/vits?text=你好,こんにちは&id=164" style="text-decoration: none; color: black"> | |
| https://artrajz-vits-simple-api.hf.space/voice/vits?text=你好,こんにちは&id=164 | |
| </a> | |
| </div> | |
| <!-- <div style="display: flex; justify-content: center; align-items: center"> --> | |
| <div> | |
| <form> | |
| <div class="form-group"> | |
| <label>text</label> | |
| <textarea class="form-control" id="inputText" rows="3" oninput="updateLink()">你好,こんにちは</textarea> | |
| </div> | |
| <div class="form-group"> | |
| <label>id</label> | |
| <select class="form-control" id="inputId" oninput="updateLink()"> | |
| <option value="164"></option> | |
| {% for speaker in speakers["VITS"] %} | |
| {% if speaker["name"] == "雷电将军（雷神）" %} | |
| <option value="{{speaker["id"]}}" selected>{{speaker["id"]}} | {{speaker["name"]}} | {{speaker["lang"]}}</option> | |
| {% else %} | |
| <option value="{{speaker["id"]}}">{{speaker["id"]}} | {{speaker["name"]}} | {{speaker["lang"]}}</option> | |
| {% endif %} | |
| {% endfor %} | |
| </select> | |
| </div> | |
| </form> | |
| </div> | |
| <p> | |
| <button class="btn btn-primary" type="button" data-toggle="collapse" data-target="#collapseExample" aria-expanded="false" aria-controls="collapseExample"> | |
| Advanced | |
| </button> | |
| </p> | |
| <div class="collapse" id="collapseExample"> | |
| <div class="card card-body"> | |
| <form> | |
| <div class="form-group"> | |
| <label>format</label> | |
| <select class="form-control" id="inputFormat" oninput="updateLink()"> | |
| <option></option> | |
| <option>wav</option> | |
| <option>mp3</option> | |
| <option>ogg</option> | |
| <option>silk</option> | |
| </select> | |
| </div> | |
| <div class="form-group"> | |
| <label>lang</label> | |
| <input type="text" class="form-control" id="inputLang" oninput="updateLink()" value="" placeholder="auto" /> | |
| </div> | |
| <div class="form-group"> | |
| <label>length</label> | |
| <input type="text" class="form-control" id="inputLength" oninput="updateLink()" value="" placeholder="1" /> | |
| </div> | |
| <div class="form-group"> | |
| <label>noise</label> | |
| <input type="text" class="form-control" id="inputNoise" oninput="updateLink()" value="" placeholder="0.33" /> | |
| </div> | |
| <div class="form-group"> | |
| <label>noisew</label> | |
| <input type="text" class="form-control" id="inputNoisew" oninput="updateLink()" value="" placeholder="0.4" /> | |
| </div> | |
| <div class="form-group"> | |
| <label>max</label> | |
| <input type="text" class="form-control" id="inputMax" oninput="updateLink()" value="" placeholder="50" /> | |
| </div> | |
| </form> | |
| </div> | |
| </div> | |
| <div style="display: flex; justify-content: center; align-items: center; height: 80px; margin-top: 20px; margin-bottom: 20px; border: 1px solid rgba(0,0,0,.125); border-radius: 0.25rem;"> | |
| <button type="button" class="btn btn-outline-secondary" id="getAudio" style="margin-right: 10px">播放器生成</button> | |
| <audio id="audioPlayer" controls> | |
| <source src="" type="audio/mp3" /> | |
| Your browser does not support the audio element. | |
| </audio> | |
| </div> | |
| <div>自动识别语言：可识别的语言根据不同speaker而不同，方言无法自动识别</div> | |
| <br /> | |
| <h2>所有模型均为网络搜集，感谢模型原作者的付出！</h2> | |
| <p> | |
| Nene_Nanami_Rong_Tang: | |
| <a href="https://github.com/CjangCjengh/TTSModels" rel="noreferrer" target="_blank">CjangCjengh/TTSModels</a> | |
| </p> | |
| <p> | |
| louise: | |
| <a href="https://github.com/CjangCjengh/TTSModels" rel="noreferrer" target="_blank">CjangCjengh/TTSModels</a> | |
| </p> | |
| <p> | |
| Cantonese: | |
| <a href="https://github.com/CjangCjengh/TTSModels" rel="noreferrer" target="_blank">CjangCjengh/TTSModels</a> | |
| </p> | |
| <p> | |
| shanghainese: | |
| <a href="https://github.com/CjangCjengh/TTSModels" rel="noreferrer" target="_blank">CjangCjengh/TTSModels</a> | |
| </p> | |
| <p> | |
| w2v2-vits: | |
| <a href="https://github.com/CjangCjengh/TTSModels" rel="noreferrer" target="_blank">CjangCjengh/TTSModels</a> | |
| </p> | |
| <p> | |
| vctk: | |
| <a href="https://github.com/jaywalnut310/vits" rel="noreferrer" target="_blank">jaywalnut310/vits</a> | |
| </p> | |
| <p> | |
| Bishojo Mangekyo: | |
| <a href="https://github.com/Francis-Komizu/VITS" rel="noreferrer" target="_blank">Francis-Komizu/VITS</a> | |
| </p> | |
| <p> | |
| genshin: | |
| <a href="https://huggingface.co/spaces/zomehwh/vits-uma-genshin-honkai" rel="noreferrer" target="_blank">zomehwh/vits-uma-genshin-honkai</a> | |
| </p> | |
| <p> | |
| paimon: | |
| <a href="https://github.com/zixiiu/Digital_Life_Server" rel="noreferrer" target="_blank">zixiiu/Digital_Life_Server</a> | |
| </p> | |
| <p> | |
| vits_chinese: | |
| <a href="https://github.com/PlayVoice/vits_chinese" rel="noreferrer" target="_blank">PlayVoice/vits_chinese</a> | |
| </p> | |
| </main> | |
| <script src="/static/js/jquery.slim.min.js"></script> | |
| <script src="/static/js/bootstrap.bundle.min.js"></script> | |
| <script> | |
| function getProtocol(){ | |
| return 'https:' == location.protocol ? "https://": "http://"; | |
| } | |
| function getUrl(){ | |
| var url = window.location.host; | |
| return url; | |
| } | |
| var baseUrl = getProtocol() + getUrl(); | |
| setBaseUrl(); | |
| function setBaseUrl(){ | |
| var text = document.getElementById("inputText").value; | |
| var id = document.getElementById("inputId").value; | |
| var vitsLink = document.getElementById("vitsLink"); | |
| var speakersLink = document.getElementById("speakersLink"); | |
| var vitsUrl = baseUrl + "/voice/vits?text=" + text + "&id=" + id; | |
| var speakersUrl = baseUrl + "/voice/speakers"; | |
| vitsLink.href = vitsUrl; | |
| vitsLink.textContent = vitsUrl; | |
| speakersLink.href = speakersUrl; | |
| speakersLink.textContent = speakersUrl; | |
| } | |
| function getLink() { | |
| var text = document.getElementById("inputText").value; | |
| var id = document.getElementById("inputId").value; | |
| var format = document.getElementById("inputFormat").value; | |
| var lang = document.getElementById("inputLang").value; | |
| var length = document.getElementById("inputLength").value; | |
| var noise = document.getElementById("inputNoise").value; | |
| var noisew = document.getElementById("inputNoisew").value; | |
| var max = document.getElementById("inputMax").value; | |
| var url = baseUrl + "/voice/vits?text=" + text + "&id=" + id; | |
| if (format != "") { | |
| url += "&format=" + format; | |
| } | |
| if (lang != "") { | |
| url += "&lang=" + lang; | |
| } | |
| if (length != "") { | |
| url += "&length=" + length; | |
| } | |
| if (noise != "") { | |
| url += "&noise=" + noise; | |
| } | |
| if (noisew != "") { | |
| url += "&noisew=" + noisew; | |
| } | |
| if (max != "") { | |
| url += "&max=" + max; | |
| } | |
| return url; | |
| } | |
| function updateLink() { | |
| var url = getLink(); | |
| var link = document.getElementById("vitsLink"); | |
| link.href = url; | |
| link.textContent = url; | |
| } | |
| function setAudioSource() { | |
| var url = getLink(); | |
| var audioPlayer = document.getElementById("audioPlayer"); | |
| audioPlayer.src = url; | |
| } | |
| var button = document.getElementById("getAudio"); | |
| button.addEventListener("click", function () { | |
| setAudioSource(); | |
| }); | |
| </script> | |
| </body> | |
| </html> | |