And honestly, the more I consider this setup (which I hadn't heard about
until now), the more I wonder why MW isn't just set up to send a wildcard
origin always, since any site on any domain could trivially request this.

-Travis

On Sun, Aug 18, 2024 at 12:58 PM Travis Briggs <audiod...@gmail.com> wrote:

> CORS is unrelated to authentication. It has nothing to do with what
> cookies you do or do not have. While a website could look at cookies when
> deciding whether to send the Access-Control-Allow-Origin header, that would
> be unusual.
>
> origin=* should be all you ever need, because otherwise you're just
> telling the MW server to allow whatever you tell it. So it's just as good
> for the MW server to tell the browser that it allows everything. You don't
> gain any security by asking the MW server to only allow your specific
> origin for that request.
>
> -Travis
>
> On Sun, Aug 18, 2024 at 12:52 PM Roy Smith <r...@panix.com> wrote:
>
>> OK, I'm reading along at
>> https://www.mediawiki.org/wiki/API:Cross-site_requests and this is
>> starting to make sense.  I see that origin=* forces anonymous mode.  This
>> is enough to get me started.  At some point I'll certainly need to be
>> authenticated, but I'll tackle that when I get to it.
>>
>>
>> On Aug 18, 2024, at 2:37 PM, Sportzpikachu via Cloud <
>> cloud@lists.wikimedia.org> wrote:
>>
>> Access-Control-Allow-Origin (and other related headers) is standard.
>> `origin=*` is specific to the Action API, which requests MW to add the ACAO
>> header.
>>
>> `origin=localhost:5173` IIRC makes MW check the origin against a
>> whitelist of sites that can use credentials, but origin=* is special in
>> that MW allows CORS for anonymous requests (ie no cookies sent).
>>
>> On 19 Aug 2024, at 02:32, Roy Smith <r...@panix.com> wrote:
>>
>> OK, that worked, thanks.  Surprisingly origin=localhost:5173 doesn't
>> work, but I can live with that.
>>
>> Is this a standard part of the CORS protocol, or something specific to
>> the Action API?
>>
>>
>> On Aug 18, 2024, at 1:45 PM, Siddharth VP <siddhart...@gmail.com> wrote:
>>
>> Add origin=* in the API request query params. This tells the API to
>> include Access-Control-Allow-Origin: * in the response headers. Don't put
>> mode: no-cors.
>>
>> On Sun, 18 Aug 2024 at 22:29, Roy Smith <r...@panix.com> wrote:
>> So, after beating my head against this for a couple of days, I've come to
>> the conclusion that I just don't understand how CORS works.
>>
>> If I get the following URL:
>> https://en.wikipedia.org/w/api.php?action=query&format=json&meta=userinfo&formatversion=2&uiprop=rights
>>
>> from a browser, I get what I expect:
>>
>> {
>>  "batchcomplete": true,
>>  "query": {
>>    "userinfo": {
>>      "id": 130326,
>>      "name": "RoySmith",
>>      "rights": [
>> etc
>> }
>>
>>
>>
>> On the command-line with curl, likewise something that makes sense:
>>
>> {
>>   "batchcomplete" : true,
>>   "query" : {
>>      "userinfo" : {
>>         "anon" : true,
>>         "id" : 0,
>> etc
>> }
>>
>>
>>
>> But when I do the same fetch from inside a VUE app:
>>
>> <template>
>>  <main>
>>    <button @click="getUserInfo">UserInfo!</button>
>>  </main>
>> </template>
>>
>> <script>
>> export default {
>>  methods: {
>>    getUserInfo() {
>>      fetch('
>> https://en.wikipedia.org/w/api.php?action=query&format=json&meta=userinfo&formatversion=2&uiprop=rights',
>> { mode: 'no-cors'})
>>        .then(function (response) {
>>          response
>>        })
>>    }
>>  }
>> }
>> </script>
>>
>>
>>
>> I get a 200 response
>>
>>
>>
>> Request URL:
>> https://en.wikipedia.org/w/api.php?action=query&format=json&meta=userinfo&formatversion=2&uiprop=rights
>> Request Method:  GET
>> Status Code:  200 OK
>> Remote Address:  (elided)
>> Referrer Policy:  strict-origin-when-cross-origin
>>
>>
>>
>> Request headers:
>>
>>
>>
>> :authority: en.wikipedia.org
>> :method: GET
>> :path:
>> /w/api.php?action=query&format=json&meta=userinfo&formatversion=2&uiprop=rights
>> :scheme: https
>> accept: */*
>> accept-encoding: gzip, deflate, br, zstd
>> accept-language: en-US,en;q=0.9
>> dnt: 1
>> priority: u=1, i
>> referer: http://localhost:5173/
>> sec-ch-ua: "Not)A;Brand";v="99", "Google Chrome";v="127",
>> "Chromium";v="127"
>> sec-ch-ua-mobile: ?0
>> sec-ch-ua-platform: "macOS"
>> sec-fetch-dest: empty
>> sec-fetch-mode: no-cors
>> sec-fetch-site: cross-site
>> user-agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7)
>> AppleWebKit/537.36 (KHTML, like Gecko) Chrome/127.0.0.0 Safari/537.36
>>
>>
>>
>> Response headers:
>>
>>
>>
>> accept-ranges: bytes
>> age: 2
>> cache-control: private, must-revalidate, max-age=0
>> content-disposition: inline; filename=api-result.json
>> content-encoding: gzip
>> content-length: 207
>> content-type: application/json; charset=utf-8
>> date: Sun, 18 Aug 2024 13:45:15 GMT
>> nel: { "report_to": "wm_nel", "max_age": 604800, "failure_fraction":
>> 0.05, "success_fraction": 0.0}
>> report-to: { "group": "wm_nel", "max_age": 604800, "endpoints": [{ "url":
>> "
>> https://intake-logging.wikimedia.org/v1/events?stream=w3c.reportingapi.network_error&schema_uri=/w3c/reportingapi/network_error/1.0.0";
>> }] }
>> server: mw-api-ext.eqiad.main-5744d5b77-fzvxz
>> server-timing: cache;desc="pass", host;desc="cp1102"
>> set-cookie:
>> WMF-Last-Access=18-Aug-2024;Path=/;HttpOnly;secure;Expires=Thu, 19 Sep 2024
>> 12:00:00 GMT
>> set-cookie: WMF-Last-Access-Global=18-Aug-2024;Path=/;Domain=.
>> wikipedia.org;HttpOnly;secure;Expires=Thu, 19 Sep 2024 12:00:00 GMT
>> set-cookie: GeoIP=(elided)
>> set-cookie:
>> NetworkProbeLimit=0.001;Path=/;Secure;SameSite=Lax;Max-Age=3600
>> strict-transport-security: max-age=106384710; includeSubDomains; preload
>> vary: Accept-Encoding
>> x-cache: cp1102 miss, cp1102 pass
>> x-cache-status: pass
>> x-client-ip: (elided)
>> x-content-type-options: nosniff
>> x-frame-options: DENY
>>
>>
>>
>> but the response body is empty.  Chrome just says "Failed to load
>> response data: No data found for resource with given identifier".  I assume
>> this is just Chrome's way of saying "Your brain is not big enough to
>> understand how CORS works".  Can anybody help me increase my brain capacity?
>>
>>
>>
>> On Aug 15, 2024, at 2:36 PM, Roy Smith <r...@panix.com> wrote:
>>
>> Thank you to everybody who offered advice.  I've set up a Vue/Vite
>> environment on my laptop and started working my way through the tutorials.
>> Some stuff makes a lot of sense; other stuff not so much yet, but I'm
>> working on cleaning out some old neural storage areas to make room for new
>> knowledge.
>>
>> I think what would help me at this point was being able to look at the
>> source for some well-written Vue apps written to work in the wikipedia
>> environment.  If folks could point me to some examples, I would appreciate
>> it.  Are there higher-level wrappers around the Action API, like pywikibot
>> for Python, or do you just do raw fetch calls on the API endpoints?
>>
>>
>> On Aug 8, 2024, at 1:14 PM, Travis Briggs <audiod...@gmail.com> wrote:
>>
>> Vue.js is definitely a good option. I already had a lot of JavaScript
>> experience, but I learned Vue at someone's recommendation for a wikimedia
>> project and it was a great experience.
>>
>> One quick tip that might help you: in the "old world" you might use
>> jQuery or something to do AJAX requests (XHR). However, in modern browsers,
>> the built-in `fetch` function is more than adequate for almost everything.
>>
>> Also, I would highly recommend using create-vue to bootstrap your
>> project, because it sets up all the complicated JavaScript "compilation"
>> steps for you, and gives you commands so that you can just do "npm run
>> build" and get a static site in a single directory.
>>
>> Good luck!
>> -Travis
>>
>> On Thu, Aug 8, 2024 at 8:36 AM Kimmo Virtanen <kimmo.virta...@gmail.com>
>> wrote:
>> Hi,
>>
>> Vue.js is afaik current choice.
>> - https://www.mediawiki.org/wiki/Vue.js
>>
>> -- Kimmo
>>
>> On Thu, Aug 8, 2024 at 6:34 PM Roy Smith <r...@panix.com> wrote:
>> I'm about to embark on building a client-side javascript tool intended to
>> help with enwiki's [[WP:DYK]] process.  JS is not my strength (and what I
>> do know about tooling is quite outdated) so I'm looking for advice on
>> what's in common use in the WMF environment these days.  If I'm going to
>> learn some new tools, I figure I might as well learn what folks here are
>> using.  If only because it'll make it easier for me to mooch on other
>> people for help :-)
>>
>> As far as testing goes, I used to use JUnit.  I gather that's pretty
>> old-hat by now.  What are you-all using?
>>
>> And for app frameworks.  Angular?  React?  I hear Vie might be the new
>> hotness?  I'm leaning more towards "easy to learn" vs "most powerful".
>> _______________________________________________
>> Cloud mailing list -- cloud@lists.wikimedia.org
>> List information:
>> https://lists.wikimedia.org/postorius/lists/cloud.lists.wikimedia.org/
>> _______________________________________________
>> Cloud mailing list -- cloud@lists.wikimedia.org
>> List information:
>> https://lists.wikimedia.org/postorius/lists/cloud.lists.wikimedia.org/
>> _______________________________________________
>> Cloud mailing list -- cloud@lists.wikimedia.org
>> List information:
>> https://lists.wikimedia.org/postorius/lists/cloud.lists.wikimedia.org/
>>
>>
>>
>> _______________________________________________
>> Cloud mailing list -- cloud@lists.wikimedia.org
>> List information:
>> https://lists.wikimedia.org/postorius/lists/cloud.lists.wikimedia.org/
>> _______________________________________________
>> Cloud mailing list -- cloud@lists.wikimedia.org
>> List information:
>> https://lists.wikimedia.org/postorius/lists/cloud.lists.wikimedia.org/
>>
>>
>> _______________________________________________
>> Cloud mailing list -- cloud@lists.wikimedia.org
>> List information:
>> https://lists.wikimedia.org/postorius/lists/cloud.lists.wikimedia.org/
>>
>>
>> _______________________________________________
>> Cloud mailing list -- cloud@lists.wikimedia.org
>> List information:
>> https://lists.wikimedia.org/postorius/lists/cloud.lists.wikimedia.org/
>>
>>
>> _______________________________________________
>> Cloud mailing list -- cloud@lists.wikimedia.org
>> List information:
>> https://lists.wikimedia.org/postorius/lists/cloud.lists.wikimedia.org/
>>
>
_______________________________________________
Cloud mailing list -- cloud@lists.wikimedia.org
List information: 
https://lists.wikimedia.org/postorius/lists/cloud.lists.wikimedia.org/

Reply via email to