YouTube 视频 API 片段标题包含 Next.js 中的特殊字符

Question

我想要获得不包含特殊字符的正确视频片段标题。 我正在使用 API:

https://www.googleapis.com/youtube/v3/search,

与 snippet.

部分

目前，我得到以下snippet.title：

I'M GONNA CARRY HER!!! Fortnite With Karina!

我期待这个标题：

I'm gonna carry her!!! Fortnite With Karina!

Answer 1

我正在使用 escape-goat as it operates as either a standalone function or as a tagged template literal，具体取决于您的用例：

const {htmlUnescape} = require('escape-goat');

htmlUnescape("I'M GONNA CARRY HER!!! Fortnite With Karina!");
//=> 'I'm gonna carry her!!! Fortnite With Karina!'

htmlUnescape`Title: ${"I'M GONNA CARRY HER!!! Fortnite With Karina!"}`;
//=> 'Title: I'm gonna carry her!!! Fortnite With Karina!'

与htmlencode/decode打交道时，时刻警惕潜在的XSS exploitation。

Answer 2

如果您想使用原始 JS 而不是导入库，我在旅行中看到了一些适用于您提供的简单用例的东西。它基本上是剥离分隔符以获得表示 Unicode-16 字符的整数。 fromCharCode 查找那个整数和 returns 匹配你给它的整数的字符。

const unescape = (str) => {
  return str.replace(/&#(\d+);/g, (match, dec) => String.fromCharCode(dec))
}

正如 Matt Hosch 在他的回答中提到的，您需要清理收到的所有数据以防止 XSS。

Answer 3

首先，请确认您从 API 获得的内容不是（引自您的）特殊字符。

从技术上讲，这些字符序列是 HTML character references, also known as HTML entities。

您遇到的行为是 ，据我所知没有其他解决方案，除了您必须自己用那些 HTML 实体替换它们所显示的实际字符代表.

现在，我建议不要使用 临时解决方案；也就是说，我确实建议您使用 well-written well-tested well-known 库，这些库从符合当前 HTML 标准的精心实施的代码中派生出 non-trivial 解决方案。

在我看来，Mathias Bynens' 库显然是满足我上面提到的每个标准的工具：

he

he (for “HTML entities”) is a robust HTML entity encoder/decoder written in JavaScript. It supports all standardized named character references as per HTML, handles ambiguous ampersands and other edge cases just like a browser would, has an extensive test suite, and — contrary to many other JavaScript solutions — he handles astral Unicode symbols just fine. An online demo is available.