Getting data with Meetups API javascript

问题

I'm trying to use meetups API with an API key, but I'm being blocked by CORS.

I'm using the example meetup gives: https://api.meetup.com/2/events?key=mykey&group_urlname=ny-tech&sign=true, replacing the API key with my API key. This example comes from here.

Here's my code (I took out my key and replaced it with < key>):

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>


<button id="find">find</button>
 <script>
        $("#find").click( function(){
          $.getJSON("https://api.meetup.com/2/events?key=<key>&group_urlname=ny-tech&sign=true", function(data){
            console.log(data);
          });
        });
</script>

I'm getting these errors:

Access to XMLHttpRequest at 'https://api.meetup.com/2/events?key=aKey&group_urlname=ny-tech&sign=true' from origin 'http://127.0.0.1:5500' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. test.html:18

Cross-Origin Read Blocking (CORB) blocked cross-origin response https://api.meetup.com/2/events?key=aKey&group_urlname=ny-tech&sign=true with MIME type application/json. See https://www.chromestatus.com/feature/5629709824032768 for more details.

I'm new to API's and I'm confused about what's going on here. I know that some API requests on meetup's API need OAuth, which I'm still trying to grasp. However, since this was the example that was used for API keys in the docs as opposed to OAuth, I expected it to work with my API key. The request works when I simply paste it in the browser but not when I use jQuery to grab it.

There are several places where the documentation talks about CORS: Here the documentation says

"you must be using OAuth to benefit from CORS."

And here

While we support key-based authentication for first-party applications, we require OAuth for third-party applications that take actions on behalf of other users.

I'm not taking action on behalf of other users. But am I a third party app? What would be a first party app? Under what circumstances would the request I'm making work?

回答1:

Looks like Meetup only allows CORS with requests that are authenticated via OAuth – reading this issue

One way is to use jsonP. After you get your generated API signature URL you can add ?callback=? as a first parameter and it will work for you.

Here is an example below

$("#find").click(function() {
  $.getJSON("https://api.meetup.com/2/events?callback=?&offset=0&format=json&limited_events=False&group_urlname=ny-tech&page=200&fields=&order=time&desc=false&status=upcoming&sig_id=SIGID&sig=SIG", function(data) {
    console.log(data);
  }).fail(function(jqxhr, textStatus, error) {
    console.log("error", textStatus);
  })
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>


<button id="find">find</button>

来源：https://stackoverflow.com/questions/54427098/getting-data-with-meetups-api-javascript

标签

javascript

jquery

api

cors

meetup