如何解决将graphql + nextJs部署到heroku
我正在使用(后端上的graphql-yoga)(前端上的nextjs和apollo客户端)构建打字稿mern堆栈应用程序 我一直在尝试将其部署到heroku和vercel,但都给出了错误
idk我所缺少的,我已经尝试了许多方法,但是仍然无法正常工作
如果您更容易在此处阅读代码,https://github.com/hamohuh/social-app
// Server connection options
const options = {
port: process.env.PORT || 5000,endpoint: "/graphql",subscriptions: "/subscriptions",playground: "/graphql",cors: {
credentials: true,origin:
process.env.NODE_ENV === "production"
? ["https://yarab-yshtaghal.herokuapp.com"]
: ["http://localhost:3000"] // your frontend url.
}
};
// starting the server on port 5000
server.start(options,() => {
console.log(`Server is running on http://localhost:${options.port}`);
});
客户端
// apollo client configurations
// http link
const httpLink = createUploadLink({
uri:
process.env.NODE_ENV == "production"
? "https://yarab-yshtaghal.herokuapp.com/graphql"
: "http://localhost:5000/graphql",// Server URL (must be absolute)
credentials: "include",// Additional fetch() options like `credentials` or `headers`
fetch
});
// websocket link
const wsLink = process.browser
? new WebSocketLink({
uri: `ws://localhost:5000/subscriptions`,options: { reconnect: true }
})
: null;
// splitLink decides which link to use
const splitLink = process.browser
? split(
({ query }) => {
const definition = getMainDefinition(query);
return (
definition.kind === "OperationDefinition" &&
definition.operation === "subscription"
);
},wsLink,httpLink as any
)
: httpLink;
// will user `setContext` to send the token with every request
const authLink = setContext((_,{ headers }) => {
// get the authentication token from protected route context
if (typeof window !== "undefined") {
token = Cookies.get("token");
}
if (headers) {
token = headers.token;
}
// return the headers to the context so httpLink can read them
return {
headers: {
...headers,token: token ? token : ""
}
};
});
// create an apollo client
function createApolloClient() {
return new ApolloClient({
uri: "/graphql",ssrMode: !isBrowser,link: authLink.concat(splitLink as any),cache: new InMemoryCache()
});
}
脚本
server package.json scripts
"scripts": {
"client-install": "npm install --prefix client","start": "ts-node -r esm server/index.ts","server": "nodemon -r esm server/index.ts","client": "npm run dev --prefix client","dev": "concurrently \"npm run server\" \"npm run client\""
}
next package.json scripts
"scripts": {
"dev": "next dev","build": "next build","start": "next start"
}
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。