Web
通用:
“关于”信息习惯性上放置在网页底部,相比App而言页面空间大一些。
fetch API 进度、置灰:
每分钟检测一次是否提交完毕;编解码用 encodeURIComponent("query string value")。
<textarea id="inputText" style="box-sizing: border-box;width: 100%;" placeholder="输入..." ></textarea>
<button onclick="api(this)" style="height: 3em;margin: 8px 0px;">执行</button><hr />
<div id="contentArea"></div>
function api(el) {
var text = document.getElementById("inputText").value;
if (text.trim().length > 0) {
el.setAttribute("disabled", null);
setTimeout(() => {
el.removeAttribute("disabled");
}, 60 * 1000); // nginx超时默认值为60秒。
var fd = new FormData();
fd.append("text", text);
fetch(backendBaseURI + "/main/apis/cp/x?urlencode="+encodeURIComponent(document.title),
{method: "POST", body: fd}).then(r => {
el.removeAttribute("disabled");
if (r.status === 204 || r.status === 404) {
alert("status - " + r.status);
return null; // 204(No Content)不能调json(),优先处理。
} else if (r.ok) { // r.ok = 2xx开头状态码
return r.json();
} else {
return Promise.reject('fetch error!');
}
}).then(data => {
console.log(data); // candidates[0].content.parts[0].text
//alert(data.filePath);
var rText = data !== null ? data?.candidates?.[0]?.content?.parts?.[0]?.text : null;
if (rText !== null) {
rText = marked.parse(rText);
ca.innerHTML = rText + "<hr />(" + new Date().toLocaleString() + ")";
} else {
// href值跨域则不会下载而是新开窗口
ca.innerHTML = JSON.stringify(data) + "<br />(" + new Date().toLocaleString() + ")";
}
}).catch(e => {
el.removeAttribute("disabled");
ca.innerHTML = "<h2 style='color:red;'>" + e + "</h2>";
});
} else {
el.removeAttribute("disabled");
ca.innerHTML = "<h2 style='color:red;'>👆请先输入问话内容!</h2>";
}
}
CSS实现饼状图 - https://ithelp.ithome.com.tw/articles/10365072
var data="""
<style>
#pie { // 饼状图
width: 200px;
height: 200px;
border-radius: 50%;
background: conic-gradient(from 0turn at center, rgb(115 164 223) 0.25turn, rgb(238 238 238) 0);
}
body { // 居中
display: flex;
justify-content: center;
align-items: center;
}
</style>
<div id="pie"></div>
""";
// 注意 - 若想用 Data URI scheme 的 loadData 则必须将 #123abc 换为 rgb(238 238 238) 写法,否则必须转义 # 井号。
webview.getSettings().setCacheMode(WebSettings.LOAD_NO_CACHE); // 使用 loadDataWithBaseURL 时应禁止缓存,否则清缓存后变空白页。
webview.loadDataWithBaseURL(null, data, "text/html", "UTF-8", null);