Cors 在服务器上调用axios,但在页面上调用后者,而不是在启动时获取或异步数据

Cors 在服务器上调用axios,但在页面上调用后者,而不是在启动时获取或异步数据,cors,axios,nuxt.js,Cors,Axios,Nuxt.js,我有一个简单的nuxt页面,它从服务器(axios)通过fetch提取数据来填充表以进行初始加载,效果非常好 import axios from 'axios' import CONST from '@/store/settings.js' import mix from '@/components/mymixin' export default { mixins: [ mix ], data() { return { msg: new Date(),

我有一个简单的nuxt页面,它从服务器(axios)通过
fetch
提取数据来填充表以进行初始加载,效果非常好

import axios from 'axios'
import CONST from '@/store/settings.js'
import mix from '@/components/mymixin'

export default {
  mixins: [ mix ],
  data() {
    return {
      msg: new Date(),
      domains: [],
      fields: [{
        key: 'name',
        label: 'Domain',
        sortable: true
      },{
        key: 'status', 
        label: 'Status'
      },{
        key: 'development_mode',
        label: 'Bypass CF',
        formatter: value => (value != '0') ? true : false, 
        sortable: true
      },{
        key: 'paused',
        label: 'Paused', 
        sortable: true
      },{
        key: 'actPageRules',
        label: 'Page Rules'
      }],
    }
  },
  methods: {
    info ( item, ix ) {
      axios.get( `${CONST.base}/zones/${item.id}/pagerules`, { headers: CONST.headers })
      .then( (res) => { console.log( res.data ) })
    }
  },
  mounted() {
    var me = this
    setInterval(function(){
      me.msg = new Date()
    }, 1000 )
    this.domains = this.$store.state.domains
  },
  fetch ( { store, params  } ) {
    const domains   = store.$axios.get( `${CONST.base}/zones?per_page=${CONST.pg}&account.id=${CONST.uid}`, { headers: CONST.headers })
      .then( (res) => { store.state.domains = res.data.result })
    // const registrar = axios.get( `${CONST.base}/accounts/${CONST.uid}/registrar/domains`, { headers: CONST.headers })
    //   .then( (res) => { this.domains = store.state.registrar = res.data.result })
    return Promise.all([ domains ])
  }, 
  asyncData( { store, params } ){

  }
}
我的表格模板是这个

<b-table class="table-responsive" striped hover :fields="fields" :items="domains">

  <template v-slot:cell(name)="data">
    <a :href="`#${data.value}`">{{ data.value }}</a>
  </template>

  <template v-slot:cell(development_mode)="data">
    <b-form-checkbox v-model="data.value" name="devmode" switch />
  </template>

  <template v-slot:cell(paused)="data">
    <b-form-checkbox v-model="data.value" name="paused" switch/>
  </template>

  <template v-slot:cell(actPageRules)="data">
    <b-button size="sm" @click="info(data.item)" class="mr-1" variant="warning">
      Page Rules
    </b-button>
  </template>
</b-table>

页面规则
和表正确呈现。现在,我想用
info
method
axios.get
在服务器上触发

我得到的错误是,由于CORS,我无法在客户端上运行它

所以我的问题是,如何触发(通过单击或其他方式)方法在服务器上而不是客户端上运行


非常感谢

在谷歌搜索了很多关键词后,我得到了它

--对于在这里偶然发现的其他谷歌用户,为了能够防止CORS错误,并让服务器请求到一些远程API(在我的例子中,是CloudFlare和MailChimp+Godaddy for DNS),我们必须通过服务器代理我们的请求

此页面包含了我们自己创建和构建的所有详细信息>