Question

我在test.js中有以下代码：

var symbol = "GOOG";
var Url = 'https://api.iextrading.com/1.0/stock/' + symbol + '/quote?filter=symbol,companyName,open,close,high,low,change,changePercent';
$.ajax({
    url: Url,
    type: "GET",
    success: function(result){
        console.log(result)
    },
    error: function(error) {
        alert("Error received:  " + error)
        console.log(`Error ${error}`)
    }
})

它工作得很漂亮，没有返回错误以及我想要的所有JSON。但是...如果我将其放在回调中，例如以下代码，则会收到跨域错误。为什么会这样？

$(document).ready(function() {
    $('#btn').click(function() {
        const symbol = document.getElementById('symbol').value;
        var Url = 'https://api.iextrading.com/1.0/stock/' + symbol + '/quote?filter=symbol,companyName,open,close,high,low,change,changePercent';

        $.ajax({
            url: Url,
            type: "GET",
            success: function(result){
                console.log(result)
            },
            error: function(error) {
                alert("Error received:  " + error)
            }
        })
    })
})

Answer 1

我发现了一个修复程序，它与冒泡有关。它不是我关注的任何地方（即，在我的javascript文件中）。我仍然不明白为什么会出现此CORS错误。如果有人可以出于某种原因而鸣叫，我肯定会感激的。

错误：
跨域请求被阻止：同源策略禁止读取https://api.iextrading.com/1.0/stock/aapl/quote?filter=symbol,companyName,open,close,high,low,change,changePercent处的远程资源。（原因：CORS请求未成功。）

解决方法是删除“添加”按钮周围的表单元素：

<body>
    <h1 ><center>Stock Watcher</center></h1> 
    <div id="root">
        <div style="text-align: center;">
            <form>
                 <input id="symbol" type="text" placeholder="Enter stock symbol...">
                 <button id="btn">Add</button>
            </form>
        </div>      
    </div>
    <script src="js/httpRequest.js"></script>
</body>

为什么仅在回调函数中出现跨域错误？

1 个答案: