Spotify「创建艺人页面」示例无法在JSFiddle运行的原因及解决

我之前也碰到过类似的情况，帮你梳理下可能的问题和解决办法：

可能的原因 #

• 旧版API/Widget已废弃：你参考的是beta版的开发者教程，Spotify后续对其嵌入组件进行了更新，旧版的widget实现方式已经被官方弃用，不再提供支持，所以原来的代码自然无法正常运行。
• 缺少必要的授权或配置：新版的Spotify嵌入功能虽然很多不需要API密钥，但如果是自定义的discography组件，可能需要正确的权限配置，而旧教程里的步骤没有覆盖这部分更新后的要求。
• JSFiddle环境限制：旧版代码可能依赖Spotify的特定脚本资源，而这些资源现在可能存在CORS限制，在JSFiddle的沙箱环境里无法正常加载。

修复方法 #

• 改用官方最新的嵌入代码：直接在Spotify的艺术家页面点击「分享」→「嵌入」，复制生成的<iframe>代码，把这段代码粘贴到JSFiddle的HTML面板里，就能直接显示艺术家的discography组件，这是官方目前推荐的最稳定的方式。
• 更新脚本引用（如果需要自定义）：如果你需要自定义组件功能，去Spotify开发者平台获取最新的Web Playback SDK或嵌入相关的脚本资源，替换旧教程里的脚本链接，同时确保按照最新文档配置必要的参数（比如客户端ID等）。
• 调整JSFiddle配置：如果使用自定义脚本，在JSFiddle的「Resources」面板里添加最新的Spotify脚本链接，确保没有CORS相关的报错（可以在浏览器控制台查看具体错误信息来排查）。

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