Merge pull request #6 from john-cheesman/pass-origin-async-data

ferrywlto · web-flow · commit 14f18a1c2349 · 2018-05-21T20:04:04.000+08:00
Pass context to asyncData to provide origin for vuex actions
diff --git a/ClientApp/components/Messages.vue b/ClientApp/components/Messages.vue
@@ -12,10 +12,10 @@ import Message from './Message.vue';
 export default {
   components: { Message },
   computed: mapGetters(['messages', 'lastFetchedMessageDate']),
-  methods: 
-    mapActions(['fetchMessages']), 
-    asyncData ({ store }) {
-      return store.dispatch('fetchInitialMessages')
+  methods:
+    mapActions(['fetchMessages']),
+    asyncData ({ store, context }) {
+      return store.dispatch('fetchInitialMessages', context.origin)
     }
 }
 </script>
diff --git a/ClientApp/server.js b/ClientApp/server.js
@@ -11,7 +11,7 @@ export default context => {
       }
       Promise.all(matchedComponents.map(Component => {
         if (Component.asyncData) {
-          return Component.asyncData({ store })
+          return Component.asyncData({ store, context })
         }
       }))
       .then(() => {
diff --git a/ClientApp/vuex/actions.js b/ClientApp/vuex/actions.js
@@ -1,16 +1,16 @@
 import axios from 'axios'
 
-export const fetchInitialMessages = ({commit}) => {
+export const fetchInitialMessages = ({commit}, origin) => {
   // this one will run on server so it need FQDN or server won't able to resolve the API address
-  return axios.get('http://localhost:5000/initialMessages').then(response => {
+  return axios.get(`${origin}/initialMessages`).then(response => {
     commit('INITIAL_MESSAGES', response.data)
   }).catch(err => {
     console.log(err)
   })
 }
 
 export const fetchMessages = ({commit}, lastFetchedMessageDate) => {
-  axios.post('http://localhost:5000/fetchMessages',{
+  axios.post('/fetchMessages',{
     lastMessageDate : lastFetchedMessageDate
   })
     .then(response => {

Original file line number	Diff line number	Diff line change
`@@ -11,7 +11,7 @@ export default context => {`
`11`	`11`	`}`
`12`	`12`	`Promise.all(matchedComponents.map(Component => {`
`13`	`13`	`if (Component.asyncData) {`
`14`		`- return Component.asyncData({ store })`
	`14`	`+ return Component.asyncData({ store, context })`
`15`	`15`	`}`
`16`	`16`	`}))`
`17`	`17`	`.then(() => {`