axios无法获取本地资源？

Question

通过vue-cli创建的项目，用的是vue init webpack的方式创建的，使用到了axios，通过axios来获取数据。
分为三种情况问题： 1、axios获取本地数据 2、axios跨域获取（获取豆瓣） 3、axios跨域获取（获取github）
1、axios获取本地数据

    import axios from 'axios'
    export default {
        created() {
            let LocalAPI = "data.json"
            axios.get(LocalAPI).then( (response) => {
                console.log(response)
            },(response) => {
                console.log('error');
            })
            
        }
    }

浏览器端报错 404 错误

why？？？

2、axios跨域获取（获取豆瓣）

    import axios from 'axios'
    export default {
        created() {
            let DouBanAPI = "https://api.douban.com/v2/book/1220562"
            axios.get(DouBanAPI ).then( (response) => {
                console.log(response)
            },(response) => {
                console.log('error');
            })
            
        }
    }

报的错误好像是跨域的问题，但是苦恼了两天没有寻出答案，求解

3、axios跨域获取（获取github）

    import axios from 'axios'
    export default {
        created() {
            let GitHubAPI = "https://api.github.com/users/johnny"
            axios.get(GitHubAPI).then( (response) => {
                console.log(response)
            },(response) => {
                console.log('error');
            })
            
        }
    }

github的接口竟然没有报错，这是为什么好苦恼啊？
请求指教啊！！！

Answer 1

1、第一个是data.json文件目录位置不对
2、第二个不支持跨域
3、第三个支持CORS跨域

Answer 2

1.本地文件读取的路径不正确
2.豆瓣和github的接口出现差异应该是豆瓣后端就设置了不可跨域，如果要读取请使用jsonp格式拿数据

Answer 3

获取本地数据那个，在webpack里面增加一条复制，把data.json复制到dist目录里面去

获取豆瓣的数据，开发的时候可以在proxytables配置一番，将本地的/douban/xxxxx接口指向豆瓣的xxxxx接口，线上配置服务器来做这一层转换

至于获取github接口没有报错，是因为github的这个接口本来就没打算做什么限制，A-C-A-O都给你配置好了，自然就没有什么跨域的问题了

Answer 4

我也碰到过这种错误...后来把 json 放在static里就没问题了...不知道有没有更好的其他解决办法

Answer 5

1、第一个是data.json文件目录位置不对
2、第二个不支持跨域
3、第三个支持CORS跨域

Answer 6

今天也遇到第一种情况，放到static文件夹也不行，后来才发现没配置静态资源QAQ

Answer 7

跨域问题，一：你可以在proxyTable中配置代理，可以暂时在开发中解决；二：想要永久解决，在后端处理，服务器允许跨域