生产 SPA 上的 Angular 应用程序 Http 解析错误
Posted
技术标签:
【中文标题】生产 SPA 上的 Angular 应用程序 Http 解析错误【英文标题】:Angular app Http Parsing Error on Production SPA 【发布时间】:2022-01-01 04:38:16 【问题描述】:我在同一目录中有 Angular 和 dotnet 核心模板应用程序。
我必须在 azure 服务器上上传构建,但出现此错误。请指导我如何解决此问题。
生产:
ERROR Error: Uncaught (in promise): TR: "headers":"normalizedNames":,"lazyUpdate":null,"status":200,"statusText":"OK","url":"https://admin-dev.xperters.com/api/jobs/getJobs","ok":false,"name":"HttpErrorResponse","message":"Http failure during parsing for https://admin-dev.xperters.com/api/jobs/getJobs","error":"error":,"text":"<!DOCTYPE html><html lang=\"en\"><head>\n <meta charset=\"utf-8\">\n <title>Xperters</title>\n <base href=\"/\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1\">\n <link rel=\"icon\" type=\"image/x-icon\" href=\"https://files.xperters.com/images/favicon.webp\">\n <link href=\"https://unpkg.com/boxicons@2.0.9/css/boxicons.min.css\" rel=\"stylesheet\">\n <link rel=\"stylesheet\" type=\"text/css\" href=\"https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.9.0/css/all.css\">\n<style>@charset \"UTF-8\";@import url(https://fonts.googleapis.com/css?family=Roboto:300,400,500,700);@import url(https://fonts.googleapis.com/earlyaccess/notokufiarabic.css);htmlfont-family:sans-serif;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%bodymargin:0:after,:beforebox-sizing:border-boxhtmlfont-size:10px;-webkit-tap-highlight-color:rgba(0,0,0,0)bodyfont-family:Helvetica Neue,Helvetica,Arial,sans-serif;font-size:14px;line-height:1.42857143;color:#333;background-color:#fffbody,htmlmargin:0;min-height:100%;height:100%*box-sizing:border-box</style><link rel=\"stylesheet\" href=\"styles.15db04db7ed750153d26.css\" media=\"print\" onload=\"this.media='all'\"><noscript><link rel=\"stylesheet\" href=\"styles.15db04db7ed750153d26.css\"></noscript></head>\n\n<body class=\"dx-viewport\">\n <app-root></app-root>\n<script src=\"runtime.03132d1f1e3c790b12ce.js\" defer></script><script src=\"polyfills.0087e061b20969056b57.js\" defer></script><script src=\"main.9d0e9744df940a9c2e1d.js\" defer></script>\n\n</body></html>"
at G (polyfills.0087e061b20969056b57.js:1)
at polyfills.0087e061b20969056b57.js:1
at Ee (main.9d0e9744df940a9c2e1d.js:1)
at T.invoke (polyfills.0087e061b20969056b57.js:1)
at Object.onInvoke (main.9d0e9744df940a9c2e1d.js:1)
at T.invoke (polyfills.0087e061b20969056b57.js:1)
at I.run (polyfills.0087e061b20969056b57.js:1)
at polyfills.0087e061b20969056b57.js:1
at T.invokeTask (polyfills.0087e061b20969056b57.js:1)
at Object.onInvokeTask (main.9d0e9744df940a9c2e1d.js:1)
本地主机:
ERROR Error: Uncaught (in promise): HttpErrorResponse: "headers":"normalizedNames":,"lazyUpdate":null,"headers":,"status":0,"statusText":"Unknown Error","url":"https://admin-dev.xperters.com/api/jobs/getJobs","ok":false,"name":"HttpErrorResponse","message":"Http failure response for https://admin-dev.xperters.com/api/jobs/getJobs: 0 Unknown Error","error":"isTrusted":true
at resolvePromise (zone.js:1213)
at zone.js:1120
at rejected (index.ts:1)
at ZoneDelegate.invoke (zone.js:372)
at Object.onInvoke (core.js:28692)
at ZoneDelegate.invoke (zone.js:371)
at Zone.run (zone.js:134)
at zone.js:1276
at ZoneDelegate.invokeTask (zone.js:406)
at Object.onInvokeTask (core.js:28679)
【问题讨论】:
【参考方案1】:始终建议提供您正在处理的代码以及您遇到的错误,因为这有助于我们重现问题并为您提供解决方案。
所以现在我只能告诉您您可能遇到此问题的原因。如下所述,出现此错误有三个可能的原因。请检查所有原因并按照他们解决问题。
无效的 JSON 格式
您收到此错误的一个可能原因是您的 JSON 格式不正确。从网络选项卡复制响应并通过JSON validator 进行验证。
错误的响应类型
另一个原因可能是HttpClient默认将response转换为response.json()。如果您的 API 返回非 json 响应,您必须指定如下所示。
return this.http.get/post(url, responseType: 'text').
响应中不可见 \0
字符
如果您已经在 JSON 验证工具中验证了 JSON 并且设置 responseType 没有帮助,请尝试从后端获取 json 并查看是否有任何 \0
字符。
要在 C# 中解决此问题,您可以执行以下操作:
result.FieldWithStackTrace = result.FieldWithStackTrace?.Replace("\0", string.Empty);
我建议您阅读此Angular documentation 以获取更多信息。还要检查这个answer 和其他对类似堆栈溢出线程的响应。
【讨论】:
我没有收到任何回复。响应为空 你检查响应类型了吗? 您好,感谢您的宝贵时间。我希望我的问题已经解决。实际上问题出在我现在修复的 angular.json 文件中。谢谢以上是关于生产 SPA 上的 Angular 应用程序 Http 解析错误的主要内容,如果未能解决你的问题,请参考以下文章
从 Angular 4 SPA 请求 Web api 时,范围声明为空
如何在 Wildfly 上使用 Angular 7 单页应用程序避免 404 错误