首页 > 解决方案 > Angular2 HttpClient 获取响应应用程序/javascript 的请求被解析为 JSON,但我希望它们是“eval”

问题描述

我的问题的 tl;博士:有没有办法设置 Angular 的 HttpClient 使其具有与 jQuery 和 CGI​​ 示例中相同的行为?有没有办法使用 Angular HttpClient 不将响应解释为 JSON,而只是eval(response_data)?

当在应用程序中运行ng serve并发出请求时HttpClient#get,像这样......

return this.httpClient.get('/assets/values.json')
return this.httpClient.get('/assets/values.js')

... Angular 开发 Web 服务器返回带有适当Content-Type标头的响应,其中上述 get 请求的值分别为:

Content-Type: application/json
Content-Type: application/javascript

如果我将 JavaScript 放在values.js文件中,我会收到一个语法错误,“SyntaxError: JSON.parse: unexpected character at line 1 column 1 of the JSON data”——这对我来说是一个明显的迹象表明应用程序/javascript没有在浏览器中执行。它是通过JSON.parse函数的自动执行来解释的。该文件不应被解释为 JSON,这不是我想要的行为。

我想要的行为是执行 JavaScript 响应,类似于返回 CGI 服务器响应时发生的情况:

Content-Type: text/javascript

x=1;

如果我运行一个调用 的 Web 应用程序jQuery.get('/values.js'),并且 CGI 后端脚本返回上述响应,则在我的浏览器窗口(JavaScript 全局)对象中x具有该值。1这是 jQuery 的(有点不清楚的行为),但我猜它与使用 Content-Type 标头有关。看起来,jQuery#ajax是用dataType: "script"选项上的属性调用的。

编辑:在你问“我为什么要这样做?尝试这样做......”之前,我使用这样的资产的原因是创建一个与我正在构建这个应用程序完全相同的环境。GUI 应用程序将在具有 CGI 后端的环境中运行,并且指定了后端中描述的 API 响应格式。我无法改变它。我想使用模拟行为来设计我的前端应用程序,这样我就不必每次想要测试它时都部署应用程序。正在开发的前端应用程序ng serve是一个理想的环境,因为它具有自动刷新开发人员的体验,并且为了使它对我更有用(我认为)我想要这种行为。

标签: javascriptangularhttp

解决方案


使用不同的 HttpClient#get 配置对象,以便 Angular 不会将响应解释为 JSON,并且不会返回JSON.parse配置时的返回值,如下所示:

const options = {
  observe: 'body' as const,
  responseType: 'text' as const,
};
return this.httpClient.get('/assets/values.js', options)

当 HttpClient#get 返回时,该值将是一个 Observable,其响应体作为返回数据的参数。

您可以订阅 Observable 并像这样调用 eval.subscribe(data => eval(data))以获得与 jQuery 相同的行为。


推荐阅读