跨源请求被阻止：Django，Axios

Question

我正在尝试通过优质阅读API来检索一本书附近的信息。到目前为止，我已经尝试了以下操作：

1. 通过邮递员：带有API密钥和查询字符串的简单get请求非常有效，并且我收到了XML响应：

2。通过django / python方法：我编写了一个简单的方法，该方法使用'requests'包​​检索数据，如下所示，这也可以按预期返回信息：

def get_goodreads_response(book_name):

    api_key = config('GOODREADS_API_KEY')
    response = requests.get('https://www.goodreads.com/book/title.xml?key=' + api_key + '&title=' + book_name)
    response_xml = ElementTree.fromstring(response.content)
    return response_xml

1. 通过django模板中的axios JS库：我对JS还是很陌生，并在网上收集了一些代码段，如下所示：

<script>
    axios.get('https://www.goodreads.com/book/title.xml?key={{ api_key }}&title={{ book_name }}')
    .then(response => {
        console.log(response.data)
    })
    .catch(error => console.error(error))
</script>

这将引发以下错误：

关于从哪里开始调试它，我丝毫没有任何线索。你能告诉我我要去哪里了吗？ 我尝试使用javascript执行此操作的原因是允许页面的其余部分加载且不会被API调用延迟。这样，只有依赖于API的部分才需要花费时间来加载，其余内容可以很快出现。目前，我只是想用Javascript成功调用API并首先获得响应。一旦可行，我计划在可用数据时转移到页面的某些部分。如果您对此方法有任何建议，请分享！