我的NEXTJS博客“服务器错误TypeError”有问题:从graphql获取数据时只支持绝对URL
我是建立在NEXTJS和使用graphql CMS。当我创建一个服务来使用api从Graphql中提取数据时，我会得到一个错误“服务器错误TypeError:只支持绝对URL
此错误发生在生成页面时。任何控制台日志都将显示在终端窗口中。“
另外，在控制台中，我得到了一个来自node_modules的500个错误。“获取http://localhost:3000/ 500 (内部服务器错误) index.js?46cb:323在getNodeRequestOptions上”
NEXT_PUBLIC_GRAPHCMS_ENDPOINT位于一个.env文件中，我从api中粘贴了url。这是两个文件，我认为是给我的问题。
服务/index.js
import { request, gql } from 'graphql-request';
const graphqlAPI = process.env.NEXT_PUBLIC_GRAPHCMS_ENDPOINT;
export const getPosts = async () => {
const query = gql `
query MyQuery {
postsConnection {
edges {
node {
author {
bio
name
id
photo {
url
}
}
createdAt
slug
title
excerpt
featuredImage {
url
}
categories {
name
slug
}
}
}
}
}
`
const result = await request(graphqlAPI, query)
return result.postsConnection.edges;
}然后，我将api收集的信息呈现在页面上。
页/index.js
import Head from 'next/head'
import { PostCard, Categories, PostWidget } from '../components';
import { getPosts } from '../services';
export default function Home( { posts } ) {
return (
<div className="container mx-auto px-10 mb-8">
<Head>
<title>My Website name</title>
<link rel="icon" href="/favicon.ico" />
</Head>
<div className="grid grid-cols-1 lg:grid-cols-12 gap-12">
<div className="lg:col-span-8 col-span-1">
{posts.map ((post, index) => <PostCard post={post} key={post.title} /> )}
</div>
<div className="lg:col-span-4 col-span-1">
<div className="lg:sticky relative top-8">
<PostWidget />
<Categories />
</div>
</div>
</div>
</div>
)
}
export async function getStaticProps() {
const posts = (await getPosts()) || [];
return {
props: { posts }
}
}我使用的是顺风css，所以这是className中的任何时髦代码。不知道我做错了什么，或者NextJS是否更新了什么，但是我在文档中找不到任何东西。任何帮助都将不胜感激。
回答 1
Stack Overflow用户
发布于 2021-11-27 03:28:18
您需要将GRAPHCMS_ENDPOINT放在.env文件中
GRAPHCMS_ENDPOINT=YOUR_GRAPHCMS_URL然后，next.js将将其转换为在前端文件中使用NEXT_PUBLIC_GRAPHCMS_ENDPOINT。记住，在您的API路由以及getServersideprops和getStaticProps中，它仍然是getServersideprops。
有关更多信息，请访问文档
https://stackoverflow.com/questions/70131775
复制相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号