Fetch请求返回HTML,Postman获FeedBurner XML播客源的问题求助
问题分析与解决方案
嗨,这个问题我之前踩过类似的坑,核心原因是目标服务器根据请求头的内容协商策略返回不同格式的响应,咱们一步步拆解来看:
为什么会出现差异?
- Postman发送GET请求时,默认的
Accept请求头会包含application/xml、application/rss+xml这类XML相关的MIME类型,服务器识别后就返回了RSS源。 - 浏览器中
fetch的默认Accept头是*/*(或更偏向text/html的组合),服务器接收到后认为你想要网页内容,所以返回了HTML。 - 无痕窗口偶尔返回XML的情况,大概率是cors-anywhere服务的缓存生效,转发了之前带有正确请求头的响应,并非当前请求的结果。
另外还要注意你代码里的一个小错误:fetch的第二个参数应该是配置对象,而非直接传Headers实例,你之前的写法会导致请求头没有被正确设置!
修复后的代码
我们需要手动添加Accept请求头,明确告诉服务器我们要XML/RSS格式的内容,同时修正fetch的参数格式:
$('#fetchXML').click(function(){ $('#xmlContent').text('Loading ...'); const feedUrl = 'https://cors-anywhere.herokuapp.com/http://feeds.wnyc.org/dearhankandjohn'; const headers = new Headers({ 'X-Requested-With': 'XMLHttpRequest', 'Accept': 'application/rss+xml, application/xml;q=0.9, */*;q=0.8' }); // 这里要把headers放在options对象里 fetch(feedUrl, { headers: headers }) .then(function(response) { return response.text(); }) .then(function(xmlText) { $('#xmlContent').text(xmlText); }) .catch(function(err){ $('#xmlContent').text(err); }); });
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <table> <tr> <td><button id="fetchXML"> Fetch Feed </button></td> </tr> <tr> <td id="xmlContent"></td> </tr> </table>
额外说明
Accept头里的q=0.9是权重值,告诉服务器优先返回application/rss+xml,其次是application/xml,最后才是其他格式。- 如果还是有问题,可以尝试添加
User-Agent头,模拟Postman或常用浏览器的UA,有些服务器会根据UA做内容过滤。
内容的提问来源于stack exchange,提问作者reggaemahn
相关产品推荐
相关产品推荐

