JavaScript UI Libraries & Blazor Components Suite – Smart UI › Forums › Data Grid › getting JSON codepen example to work with CORS issue

Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • August 15, 2023 at 4:27 pm #108538
    edwardsmarkff
    Participant

    hello all –

    grid newbie here.  so far it looks mind-blowingly awesome!

    i think the best way to get the https://www.htmlelements.com/demos/grid/datagrid-bind-to-json/ demo to work is to do the following:

    1. on windows, do window-key “R”
    2. enter the following command & open up a new window:    chrome.exe –user-data-dir=”C://Chrome dev session” –disable-web-security
    3. click the “Edit the codepen” button at the bottom
    4. QUICKLY grab the URL to the codepen (it will morph after  a moment or so)
    5. paste URL into the newly opened window from prior step
    6. change the dataSource value to the following:  dataSource: ‘//htmlelements.com/demos/scripts/beverages.json‘,

    there is an easy way to bypass the CORS issue by right-clicking the little lock just left of the URL and change “site-settings” to “allow insecure content” but i could not get that working with codepen.

    August 15, 2023 at 9:38 pm #108550
    edwardsmarkff
    Participant

    sorry should have said:

    1. visit: https://www.htmlelements.com/demos/grid/datagrid-bind-to-json/
    2. scroll to bottom of page and notice the “Edit the codepen” button at the bottom of the page
    3. on windows, do window-key “R”
    4. enter the following command & open up a new window:    chrome.exe –user-data-dir=”C://Chrome dev session” –disable-web-security
    5. go back to first window, and click “Edit the codepen” at the bottom of the page
    6. QUICKLY grab the URL to the codepen (it will morph into another URL after  a moment or so)  repeat if necessary
    7. paste URL into the newly opened window from step 4
    8. change the dataSource value to the following:  dataSource: ‘//htmlelements.com/demos/scripts/beverages.json‘,

    otherwise you get the CORS error.

    August 18, 2023 at 4:56 pm #108583
    edwardsmarkff
    Participant

    this is starting to become a big problem with all the codepen examples:

    
Access to script at 'https://codepen.io/source/modules/smart.grid.js' (redirected from 'https://cdpn.io/source/modules/smart.grid.js') from origin 'https://cdpn.io' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
    August 20, 2023 at 8:51 am #108598
    Markov
    Keymaster

    Hi,

    It would not be possible to bypass CORS with codepen. All examples are also included in the download package.

    Regards,
    Markov

    August 21, 2023 at 5:06 pm #108611
    edwardsmarkff
    Participant

    Actually, my suggestion works fine.

    sadly, there is not a chrome plugin to do this for us, or at least not one i could find that works.

    i should think simulating this with a plugin would be easy:    chrome.exe –user-data-dir=”C://Chrome dev session” –disable-web-security

  • Author
    Posts
Viewing 5 posts - 1 through 5 (of 5 total)
  • You must be logged in to reply to this topic.