Question

我试图下载（获取）返回字符串的网页，而不是XML而不是JSON。

基本上有没有办法在Angular4中将网页下载为字符串，如C＃中的WebClient.DownloadString？

注意： 我以为我可以先使用http方法（observables，promises，JSONP）来下载网站。但无论如何我试过了。

我无法使用JSONP，因为它将结果解析为json并且我收到错误，因为响应是字符串而不是JSON。

并且可观察和承诺失败，因为我收到了CORS错误。而且我不确定为什么我会收到CORS错误，因为它不是RESTful服务，WCF或web api等。

否＆＃39;访问控制 - 允许 - 来源＆＃39;标头出现在请求的资源上。

我也尝试过HttpClient，但我又遇到了CORS错误。

所以我相信Angular中应该有一些其他的方法或组件或模块来下载网页作为字符串。

Answer 1

您可以使用CORS代理获取不发送Access-Control-Allow-Origin的网站内容。这是一个简单的示例：

＆＃13;

const proxyurl = "https://cors-anywhere.herokuapp.com/";
const requesturl = "https://google.com";
fetch(proxyurl + requesturl)
    .then(response => response.text())
    .then(text => document.querySelector("pre").textContent = text)

＆＃13;

<pre></pre>

＆＃13;

这是怎么回事：

如果某个网站本身没有发送Access-Control-Allow-Origin响应标头，那么当您使用Fetch API向其发出请求时，浏览器会阻止您的前端JavaScript代码访问该网站的响应或来自JavaScript库的XHR或Ajax方法。

但是使用URL https://cors-anywhere.herokuapp.com/https://google.com会导致请求通过https://cors-anywhere.herokuapp.com进行，https://github.com/Rob--W/cors-anywhere/是一个开放的CORS代理，它将请求转发给https://google.com，然后从中接收响应。 https://cors-anywhere.herokuapp.com后端将Access-Control-Allow-Origin标头添加到响应中，并将其传递回您的请求前端代码。

然后，浏览器将允许您的前端代码访问响应，因为具有Access-Control-Allow-Origin响应标头的响应是浏览器看到的响应。

您还可以使用https://developer.mozilla.org/en-US/docs/Web/HTTP/Access_control_CORS

轻松设置自己的CORS代理

有关使用XHR或JavaScript库中的Fetch API或AJAX方法从前端JavaScript代码发送跨源请求时浏览器执行的操作的详细信息，以及有关浏览器允许前端代码必须接收哪些响应标头的详细信息访问回复 - 请参阅{{3}}。

Answer 2

很抱歉，Same Origin Policy阻止您的网站从其他域下载网站。同源策略适用于每个Web请求。无论是网站还是REST API都没有区别。

同源策略有多种方法：

目标网络服务器可以通过设置CORS - 标头Access-Control-Allow-Origin进行合作。（CORS已知注释中提到的“简单请求”的概念，但这与此无关。“简单请求”是不触发预请求的请求。但跳过预请求不允许您访问对于响应，您仍然需要Access-Control-Allow-Origin响应标头。
您可以将您的网站转换为可安装的应用程序或浏览器扩展
您可以在域上提供代理请求到目标域的服务器端脚本。请谨慎使用此选项，因为它可能很容易被第三方滥用，除非您采取额外步骤（例如白名单目的地，速率限制和记录）。

如何使用Angular4将网站下载为字符串？

2 个答案: