Question

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
    <script>
        $(document).ready(function(){
            $.get({
                url: "http://www.dnd5eapi.co/api/races/",
                dataType: "JSON",
                success: function(result){
                    result.results.forEach(function(element) {
                        $("#racebox").append('<option value="'+element.url+'">'+element.name+ ' '+'</option>');
                    });

                    $('#racebox').on('change',function(){
                        var raceChoice = $('#racebox').val();
                        console.log(raceChoice);
                        $.get({
                            url: raceChoice,
                            dataType: "JSON",
                            success: function(result){
                                result.starting_proficiencies.forEach(function(element) {
                                    $("#output").append(element.name);
                                });
                            }
                        });
                    });
                }
            });
        });
    </script>
</head>
<body>
    <form>
        <select id="racebox">
        </select>
    </form>
    <div id="output"></div>


</body>

我正在尝试使用API，我无法解决代码的跨源问题，我不确定如何执行此操作，因为一个文件旨在将url提供给另一个。它来自一个宁静的API，我想知道是否有更清洁的方法来做到这一点或解决问题。如果可能的话，我很乐意看到一个例子，我将处理从这些下一个网址提供的大量请求。

Answer 1

你可以轻松解决这个问题，只是不要用js访问api

更改

url: "http://www.dnd5eapi.co/api/races/",

到

url: "http://yourowndomain/script",

并且脚本文件可以是例如获取数据服务器端的php脚本。所以你不要遇到交叉问题

脚本可以像

一样简单

return file_get_contents('http://www.dnd5eapi.co/api/races/');

访问外部API的Cross Origin问题

1 个答案: