vue.js 如何修复“类型错误:name.toUpperCase不是axios中的函数

7eumitmz  于 2023-03-03  发布在  Vue.js
关注(0)|答案(4)|浏览(165)

我想从dbpedia端点获取数据,在vue js中使用axios。
我使用axios.get从dbpedia获取数据,我在控制台中得到一个错误消息:
类型错误:name.toUpperCase不是函数
我该怎么修呢?

created(){
    this.fetch();
  },
  methods: {
    fetch(){
      axios
      .get('http://id.dbpedia.org/sparql?query=SELECT+DISTINCT+?concept+WHERE+{+?s+a+?concept+}+LIMIT+50', {
        headers: 'Access-Control-Allow-Origin: *'
      }).then(response => {
        /* eslint-disable */
        console.log('SUCCESS');
        console.log(response);
      }).catch((e) => {
        console.log(e);
      })
    }
  },
8yparm6h

8yparm6h1#

您需要将Axios请求更改为:

methods: {
async fetch () {
await axios.get('https://cors.io/?http://id.dbpedia.org/sparql?query=SELECT+DISTINCT+?concept+WHERE+{+?s+a+?concept+}+LIMIT+50', {
            headers: {'Access-Control-Allow-Origin': *},
             mode: 'cors',
          }).then(response => {
            /* eslint-disable */
            console.log('SUCCESS');
            console.log(response.data);
          }).catch((e) => {
            console.log(e);
          }
     }
}

五个变化:
1)使Axios headers成为对象(注意引号的位置)
2)console.log(response.data)
3)添加了mode: 'cors'
4)为URL添加了cors前缀,因为您正在从托管环境之外的第三方域检索数据
5)将您的fetch函数 Package 在asyncawait中,因为axios是一个基于承诺的库。

r1zk6ea1

r1zk6ea12#

我在学习阶段也遇到过类似的问题,通过将标题设置为对象而不是字符串来解决:

headers: { 'Access-Control-Allow-Origin': true }
enyaitl3

enyaitl33#

对于上面的答案前提条件是你允许你的来源。要指定我有一个例子如下

app.use(cors({credentials: true, origin: 'http://localhost:3000'}));
mefy6pfw

mefy6pfw4#

对我来说,这是 Camel 案件的错误,在toUpperCase在js,请确保您看到它

相关问题