iOS快捷指令中用JSONata解析Spotify Web API结果无输出

我尝试用HTML+JavaScript执行JSONata表达式处理Spotify Web API返回结果，表达式在JSONata playground里能正常生成预期数组，但嵌入JS后完全没输出。

我的JSONata表达式 #

items.{
  "Release Year": $number(($toMillis($.track.album.release_date))~>$fromMillis('[Y]')),
  "Track": track.name,
  "Artist(s)": $join($map(track.artists.name, $string), ", "),
  "Album": track.album.name,
  "Genre": "",
  "URL": $join(['https://song.link/s/', track.id]),
  "Release Date": track.album.release_date,
  "Duration": track.duration_ms,
  "Popularity": track.popularity,
  "SpotifyID": track.id,
  "Added to Playlist On": $toMillis($.added_at)~>$fromMillis('[M]/[D]/[Y] at [h]:[m] [P]')
}

嵌入的HTML/JavaScript代码（原错误版本） #

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<script src="https://cdn.jsdelivr.net/npm/jsonata/jsonata.min.js"></script>
</head>
<body>
    
<script>
var jsonata = require("jsonata");
function evaluateJsonata() {
    var apiData = apiResponse2;
    var expression = jsonata(items.{"Release Year":$number(($toMillis($.track.album.release_date))~>$fromMillis('[Y]')),"Track":track.name,"Artist(s)":$join($map(track.artists.name,$string),", "),"Album":track.album.name,"Genre":"","URL":$join(['https://song.link/s/',track.id]),"Release Date":track.album.release_date,"Duration":track.duration_ms,"Popularity":track.popularity,"SpotifyID":track.id,"Added to Playlist On":$toMillis($.added_at)~>$fromMillis('[M]/[D]/[Y] at [h]:[m] [P]')});
    var result = expression.evaluate(apiData);
    document.write(JSON.stringify(result)) 
}
</script>

</body>
</html>

问题排查与修复步骤 #

• 错误1：重复导入JSONata：浏览器环境下已通过<script>标签引入CDN库，无需再用require("jsonata")，这行代码会直接阻断后续执行。
• 错误2：JSONata表达式未作为字符串传入：原代码直接把表达式写进jsonata()函数，会被JS引擎当成JS语法解析，引发语法错误，必须将表达式包裹为字符串。
• 错误3：未调用执行函数：仅定义了evaluateJsonata()但未触发调用，代码不会自动执行。
• 额外优化：兼容数据类型：iOS快捷指令传入的apiResponse2可能是字符串，需先解析为JSON对象；添加错误捕获便于排查问题。

修复后的完整代码 #

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<script src="https://cdn.jsdelivr.net/npm/jsonata/jsonata.min.js"></script>
</head>
<body>
<script>
function evaluateJsonata() {
    // 处理可能的字符串类型API响应
    var apiData = typeof apiResponse2 === 'string' ? JSON.parse(apiResponse2) : apiResponse2;
    // 用模板字符串包裹JSONata表达式，保留格式可读性
    var expressionStr = `items.{
        "Release Year": $number(($toMillis($.track.album.release_date))~>$fromMillis('[Y]')),
        "Track": track.name,
        "Artist(s)": $join($map(track.artists.name, $string), ", "),
        "Album": track.album.name,
        "Genre": "",
        "URL": $join(['https://song.link/s/', track.id]),
        "Release Date": track.album.release_date,
        "Duration": track.duration_ms,
        "Popularity": track.popularity,
        "SpotifyID": track.id,
        "Added to Playlist On": $toMillis($.added_at)~>$fromMillis('[M]/[D]/[Y] at [h]:[m] [P]')
    }`;
    var expression = jsonata(expressionStr);
    // 捕获执行错误，便于调试
    try {
        var result = expression.evaluate(apiData);
        document.write(JSON.stringify(result));
    } catch (error) {
        document.write('执行错误：' + error.message);
    }
}
// 调用函数触发执行
evaluateJsonata();
</script>
</body>
</html>

内容的提问来源于stack exchange，提问作者esstroud