我正在使用(后端上的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"
}