1839811/ifms-smart-cp
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Client connection setup

Browse Source
This commit is contained in:
Douglas Barone 2023-10-06 14:40:16 -04:00
parent 7189b14de0
commit 2b6e3ad7fe
10 changed files with 96 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
.env.development Normal file
View File

@ -0,0 +1 @@
VITE_SERVER_URL=http://127.0.0.1:8080

1
.env.production Normal file
View File

@ -0,0 +1 @@
VITE_SERVER_URL=https://cp.pp.ifms.edu.br

54
package-lock.json generated
View File

@ -11,8 +11,10 @@
"@mdi/font": "7.0.96",
"@trpc/client": "^10.38.5",
"@trpc/server": "^10.38.5",
"@types/cors": "^2.8.14",
"@types/express": "^4.17.18",
"body-parser": "^1.20.2",
"cors": "^2.8.5",
"express": "^4.18.2",
"roboto-fontface": "*",
"vue": "^3.2.0",
@ -28,7 +30,7 @@
"@vitejs/plugin-vue": "^4.0.0",
"concurrently": "^8.2.1",
"tsx": "^3.13.0",
"typescript": "^5.0.0",
"typescript": "^5.2.2",
"vite": "^4.2.0",
"vite-plugin-vuetify": "^1.0.0",
"vue-tsc": "^1.2.0"
@ -465,6 +467,14 @@
"@types/node": "*"
}
},
"node_modules/@types/cors": {
"version": "2.8.14",
"resolved": "https://registry.npmjs.org/@types/cors/-/cors-2.8.14.tgz",
"integrity": "sha512-RXHUvNWYICtbP6s18PnOCaqToK8y14DnLd75c6HfyKf228dxy7pHNOQkxPtvXKp/hINFMDjbYzsj63nnpPMSRQ==",
"dependencies": {
"@types/node": "*"
}
},
"node_modules/@types/express": {
"version": "4.17.18",
"resolved": "https://registry.npmjs.org/@types/express/-/express-4.17.18.tgz",
@ -975,6 +985,18 @@
"resolved": "https://registry.npmjs.org/cookie-signature/-/cookie-signature-1.0.6.tgz",
"integrity": "sha512-QADzlaHc8icV8I7vbaJXJwod9HWYp8uCqf1xa4OfNu1T7JVxQIrUgOWtHdNDtPiywmFbiS12VjotIXLrKM3orQ=="
},
"node_modules/cors": {
"version": "2.8.5",
"resolved": "https://registry.npmjs.org/cors/-/cors-2.8.5.tgz",
"integrity": "sha512-KIHbLJqu73RGr/hnbrO9uBeixNGuvSQjul/jdFvS/KFSIH1hWVd1ng7zOHx+YrEfInLG7q4n6GHQ9cDtxv/P6g==",
"dependencies": {
"object-assign": "^4",
"vary": "^1"
},
"engines": {
"node": ">= 0.10"
}
},
"node_modules/csstype": {
"version": "3.1.2",
"resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.2.tgz",
@ -1594,6 +1616,14 @@
"node": ">= 0.6"
}
},
"node_modules/object-assign": {
"version": "4.1.1",
"resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz",
"integrity": "sha512-rJgTQnkUnH1sFw8yT6VSU3zD3sWmu6sZhIseY8VX+GRu3P6F7Fu+JNDoXfklElbLJSnc3FUQHVe4cU5hj+BcUg==",
"engines": {
"node": ">=0.10.0"
}
},
"node_modules/object-inspect": {
"version": "1.12.3",
"resolved": "https://registry.npmjs.org/object-inspect/-/object-inspect-1.12.3.tgz",
@ -2577,6 +2607,14 @@
"@types/node": "*"
}
},
"@types/cors": {
"version": "2.8.14",
"resolved": "https://registry.npmjs.org/@types/cors/-/cors-2.8.14.tgz",
"integrity": "sha512-RXHUvNWYICtbP6s18PnOCaqToK8y14DnLd75c6HfyKf228dxy7pHNOQkxPtvXKp/hINFMDjbYzsj63nnpPMSRQ==",
"requires": {
"@types/node": "*"
}
},
"@types/express": {
"version": "4.17.18",
"resolved": "https://registry.npmjs.org/@types/express/-/express-4.17.18.tgz",
@ -3014,6 +3052,15 @@
"resolved": "https://registry.npmjs.org/cookie-signature/-/cookie-signature-1.0.6.tgz",
"integrity": "sha512-QADzlaHc8icV8I7vbaJXJwod9HWYp8uCqf1xa4OfNu1T7JVxQIrUgOWtHdNDtPiywmFbiS12VjotIXLrKM3orQ=="
},
"cors": {
"version": "2.8.5",
"resolved": "https://registry.npmjs.org/cors/-/cors-2.8.5.tgz",
"integrity": "sha512-KIHbLJqu73RGr/hnbrO9uBeixNGuvSQjul/jdFvS/KFSIH1hWVd1ng7zOHx+YrEfInLG7q4n6GHQ9cDtxv/P6g==",
"requires": {
"object-assign": "^4",
"vary": "^1"
}
},
"csstype": {
"version": "3.1.2",
"resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.2.tgz",
@ -3468,6 +3515,11 @@
"resolved": "https://registry.npmjs.org/negotiator/-/negotiator-0.6.3.tgz",
"integrity": "sha512-+EUsqGPLsM+j/zdChZjsnX51g4XrHFOIXwfnCVPGlQk/k5giakcKsuxCObBRu6DSm9opw/O6slWbJdghQM4bBg=="
},
"object-assign": {
"version": "4.1.1",
"resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz",
"integrity": "sha512-rJgTQnkUnH1sFw8yT6VSU3zD3sWmu6sZhIseY8VX+GRu3P6F7Fu+JNDoXfklElbLJSnc3FUQHVe4cU5hj+BcUg=="
},
"object-inspect": {
"version": "1.12.3",
"resolved": "https://registry.npmjs.org/object-inspect/-/object-inspect-1.12.3.tgz",

4
package.json
View File

@ -12,8 +12,10 @@
"@mdi/font": "7.0.96",
"@trpc/client": "^10.38.5",
"@trpc/server": "^10.38.5",
"@types/cors": "^2.8.14",
"@types/express": "^4.17.18",
"body-parser": "^1.20.2",
"cors": "^2.8.5",
"express": "^4.18.2",
"roboto-fontface": "*",
"vue": "^3.2.0",
@ -29,7 +31,7 @@
"@vitejs/plugin-vue": "^4.0.0",
"concurrently": "^8.2.1",
"tsx": "^3.13.0",
"typescript": "^5.0.0",
"typescript": "^5.2.2",
"vite": "^4.2.0",
"vite-plugin-vuetify": "^1.0.0",
"vue-tsc": "^1.2.0"

6
src/server/index.ts
View File

@ -1,7 +1,7 @@
import { server } from './server'
const PORT = process.env.PORT || 8080
export const SERVER_PORT = process.env.PORT || 8080
server.listen(PORT, () => {
console.log(`Server ready on http://localhost:${PORT}`)
server.listen(SERVER_PORT, () => {
console.log(`Server ready on http://localhost:${SERVER_PORT}`)
})

1
src/server/lib/hello.ts
View File

@ -1,3 +1,4 @@
export function hello(name: string) {
console.log(`hello ${name}`)
return { message: `hello ${name}` }
}

2
src/server/server.ts
View File

@ -1,8 +1,10 @@
import express from 'express'
import { trpcMiddleware } from './trpc'
import cors from 'cors'
const server = express()
server.use(cors())
server.use('/trpc', trpcMiddleware)
export { server }

19
src/web/App.vue
View File

@ -1,11 +1,22 @@
<template>
<v-app>
<v-main>
<HelloWorld />
</v-main>
<v-main> {{ message }}</v-main>
</v-app>
</template>
<script setup lang="ts">
import HelloWorld from '@/components/HelloWorld.vue'
import { onMounted, ref } from 'vue'
import { trpc } from './trpc'
const message = ref('Hello World!')
onMounted(async () => {
console.log('Hello')
try {
const res = await trpc.hello.query('Doug')
message.value = res.message
} catch (err: any) {
console.log(err)
}
})
</script>

2
src/web/main.ts
View File

@ -11,7 +11,7 @@ import App from './App.vue'
import { createApp } from 'vue'
// Plugins
import { registerPlugins } from '@/plugins'
import { registerPlugins } from './plugins'
const app = createApp(App)

16
src/web/trpc.ts Normal file
View File

@ -0,0 +1,16 @@
import { createTRPCProxyClient, httpBatchLink } from '@trpc/client'
import type { AppRouter } from '../server/trpc'
const SERVER_URL = import.meta.env.VITE_SERVER_URL || 'http://localhost:80'
console.log('SERVER_URL', SERVER_URL)
// Pass AppRouter as generic here. 👇 This lets the `trpc` object know
// what procedures are available on the server and their input/output types.
export const trpc = createTRPCProxyClient<AppRouter>({
links: [
httpBatchLink({
url: `${SERVER_URL}/trpc`
})
]
})