盖茨比XMLHttpRequest [英] Gatsby XMLHttpRequest
问题描述
简而言之:我想在Gatsby中使用 XMLHttpRequest ，该模式可以在开发模式下使用，但是在生产( gatsby build )模式下却无法使用，我无法获得固定.
In short: I want to use XMLHttpRequest in Gatsby, which works in development mode, but fails in production (gatsby build) mode, which I can't get fixed.
更多信息:我想访问一个API(准确地说是GitHub API).因此，我发出了这样的HTTP请求:
Some more information: I want to access an API (to be precise the GitHub API). Therefore I make an HTTP request like that:
const repoRequest = new XMLHttpRequest();
const repoUrl = "https://api.github.com/user/repos?visibility=all?type=all";
repoRequest.open("GET", repoUrl);
repoRequest.setRequestHeader("Authorization", "token <here would be my token>");
repoRequest.send();
我已经围绕它开发了一些代码，并且运行良好，但是当我想部署它并运行 gatsby build 时，我得到了:
I've developed some code around it and it worked fine, but when I wanted to deploy it and ran gatsby build, I got:
error Building static HTML failed
See our docs page on debugging HTML builds for help https://gatsby.dev/debug-html
69 | let age = ((today - birthday) / 1000 / 60 / 60 / 24 / 365).toFixed(1);
70 |
> 71 | const repoRequest = new XMLHttpRequest();
| ^
72 | const repoUrl = "https://api.github.com/user/repos?visibility=all?type=all";
73 | repoRequest.open("GET", repoUrl);
74 | repoRequest.setRequestHeader("Authorization", "token <here would be my token>");
WebpackError: ReferenceError: XMLHttpRequest is not defined
我尝试按照建议此处使用i18n，但实际上并没有根本不知道从哪里开始，因为这是我的第一个Gatsby项目，实际上也是我的第一个更大的JS项目.
I tried to use i18n, as suggested here, but didn't really know where to start at all, as this is my first Gatsby project and in fact also my first bigger JS project.
更复杂的事情是，我使用了此入门指南(我项目基本上看起来还是一样，因此您对我的代码有很好的印象)，它似乎不在默认的Gatsby布局中.
Complicating matters even further, I've used this starter (my project basically looks the same still, so you can get a good impression regarding my code), which does not seem to be in the default Gatsby layout.
我将Windows 10与linux子系统(Ubuntu)一起使用，在其中运行npm，Gatsby等...，同时我在Windows的IntelliJ中编辑代码-我认为这不相关，但是永远不知道.这是我在运行 sudo gatsby info 时得到的:
I'm using Windows 10 with the linux subsystem (Ubuntu), in which I run npm, Gatsby, ..., whilst I edit the code in IntelliJ in Windows - I don't think this is relevant, but one never knows. This is what I get when running sudo gatsby info:
System:
OS: Linux 4.4 Ubuntu 16.04.6 LTS (Xenial Xerus)
CPU: (16) x64 AMD Ryzen 7 1700 Eight-Core Processor
Shell: 4.3.48 - /bin/bash
Binaries:
Node: 11.11.0 - /usr/bin/node
npm: 6.9.0 - /usr/bin/npm
Languages:
Python: 2.7.12 - /usr/bin/python
npmPackages:
gatsby: ^2.1.35 => 2.1.35
gatsby-cli: ^2.4.16 => 2.4.16
gatsby-image: ^2.0.31 => 2.0.33
gatsby-plugin-debug-build: ^1.0.0 => 1.0.0
gatsby-plugin-google-analytics: ^2.0.16 => 2.0.17
gatsby-plugin-manifest: ^2.0.22 => 2.0.24
gatsby-plugin-netlify: ^2.0.11 => 2.0.12
gatsby-plugin-offline: ^2.0.24 => 2.0.25
gatsby-plugin-page-load-delay: ^0.1.2 => 0.1.2
gatsby-plugin-react-helmet: ^3.0.8 => 3.0.9
gatsby-plugin-sharp: ^2.0.25 => 2.0.28
gatsby-plugin-styled-components: ^3.0.6 => 3.0.7
gatsby-source-filesystem: ^2.0.23 => 2.0.24
gatsby-transformer-sharp: ^2.1.15 => 2.1.17
因此，即使可能已经有其他人遇到了类似的问题，我也要为我的问题的具体解决方案而感激.
So even though there might be others who had a similar problem already, I'd be thankful for a specific solution to my problem.
我实际上已经尝试过简单地部署开发版本，但这似乎并不那么容易(当像创建生产版本那样部署公用文件夹时，我只会得到一个空白页).因此，如果您知道如何部署开发版本，这实际上也将对我有很大帮助.
I've actually tried simply deploying the development build, but this doesn't seem to be that easy (when deplyoing the public folder, as I'd to with the production build, I simply get an empty page). So if you know how I could deploy the development build, this would actually help me a lot too.
推荐答案
在html页面构建期间失败，因为当时未定义 XMLHttpRequest .在使用 XMLHttpRequest 之前，您可以检查它是否已定义.
It fails during build of html pages because XMLHttpRequest isn't defined ta that time. before using XMLHttpRequest you can check if it is defined.
if(typeof XMLHttpRequest !== "undefined")
查看此 https://www.gatsbyjs.org/docs/debugging-html-builds/
这篇关于盖茨比XMLHttpRequest的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
