content-range error with papaparse. Can I edit htaccess?

[NickCarducci]

I'm trying to access .htaccess file to implement gzip compression (I'm getting a content-request error using papaparse with codesandbox). Is there a way to edit .htaccess?

| Сodesandbox |
| Chrome |

thanks

[lbogdan]

Hey @NickCarducci ,

Can you be more specific of what you're trying to achieve, exactly?

[NickCarducci]

Sure, the 'gzip compression' link above says to add the following to .htaccess <ifModule mod_gzip.c> mod_gzip_on Yes mod_gzip_dechunk Yes mod_gzip_item_include file .(html?|txt|css|js|php|pl)$ mod_gzip_item_include handler ^cgi-script$ mod_gzip_item_include mime ^text/.* mod_gzip_item_include mime ^application/x-javascript.* mod_gzip_item_exclude mime ^image/.* mod_gzip_item_exclude rspheader ^Content-Encoding:.*gzip.* </ifModule> in order to compress files with gzip. I'm sure there is more to getting rid of the error "content-range" (I just tried to reproduce the error message hold on...) but writing in .htaccess was the first step to solve content-range issue according to the 'papaparse with' link above.

[NickCarducci]

I'm sorry... that error 'Refused to get unsafe header "Content-Range"' only shows when I use https://cors-anywhere.herokuapp.com/ in front of my dl.dropboxusercontent.com link https://dl.dropboxusercontent.com/s/wy9vjxczbjm796y/worldcities_usa_few.csv in papaparse remove csv parser, but I'm still curious can your users edit .htaccess?

[lbogdan]

I still don't understand why you would want to change .htaccess (we're using nginx as a web server, which doesn't honor .htaccess, anyway). Can you maybe point me to a sandbox where I can see what you're trying to do?

[NickCarducci]

I can't find another project that does this but you can go to src>UIConainers/Map/CitiesMap.js here to see my implementation of papaparse. the CitiesMap.js is found by bottom globe icon (after pressing the inbox icon if you're starting on the purple screen), then top left city animation. You really don't have to though.

I'm just going by the 'papaparse with' link above from papaparse github when it says "content-range" error can be fixed with gzip or smaller files. gzip compatibility for nginx server from the gzip compression' link above is:

gzip on;
gzip_comp_level 2;
gzip_http_version 1.0;
gzip_proxied any;
gzip_min_length 1100;
gzip_buffers 16 8k;
gzip_types text/plain text/html text/css application/x-javascript text/xml application/xml application/xml+rss text/javascript;

// Disable for IE < 6 because there are some known problems
gzip_disable "MSIE [1-6].(?!.*SV1)";

// Add a vary header for downstream proxies to avoid sending cached gzipped files to IE6
gzip_vary on;

You can close this. I also meant for this to be labeled a question not an issue I don't know what happened with that

[lbogdan]

But I think those settings are for the server that serves the CSV file(s) - which in your case is Dropbox?

[NickCarducci]

ok, yes, that would make sense. 'Refused to get unsafe header "Content-Range"' error only appears when I try to use https://cors-anywhere.herokuapp.com/ as a prefix to the csv document link at dl.dropboxusercontent.com or dropbox.com. I'll try to find another hosting site for the doc, or should I try to host the 5mb csv on my own computer? codesandbox has a limit<5 but specifically I can't upload more files even 511 bytes

[lbogdan]

Check you please check your devtools console for errors?

[NickCarducci]

Nothing comes up there when I try to upload 511 byte csv

[lbogdan]

Oh, sorry, I meant the browser's devtools.

[NickCarducci]

well this is when I try to use https://cors-anywhere.herokuapp.com/ as a prefix to the csv document link

and this is thrown from cities.toUpperCase (used later, not shown) which doesn't seem to get the papaparse step output to cities as an array

In my componentDidMount

componentDidMount() {
    this._isMounted = true;
    Papa.parse(
      //this link works...not the next one"https://dl.dropboxusercontent.com/s/k81s5enbamijuke/worldcitiespop_northamerica_nolonglat_few.csv",
      "https://dl.dropboxusercontent.com/s/wy9vjxczbjm796y/worldcities_usa_few.csv",
      {
        download: true,
        header: true,
        worker: true,
        skipEmptyLines: true,
        step: this.updateData,
        complete: function(results) {
          //console.log(results);
        }
      }
    );
  }
  updateData(results) {
    if (this._isMounted) {
      this.setState(prevState => ({
        cities: [...prevState.cities, results.data.City]
      })); //console.log(this.state.cities)
    }
  }
  componentWillUnmount() {
    // if Papa.parse done, set _isMounted to false
    this._isMounted = false;
  }

But I really want to know why I can't upload 511 byte csv, did I reach the sandbox size limit? When I upload the 511 byte csv browser dev tools doesn't catch the rejected upload to the sandbox

[NickCarducci]

I'm going to not use papaparse and instead webscrape https://www.freemaptools.com/find-cities-and-towns-inside-radius.htm to render cities, but I'm not closing this in case you can answer why I can't upload 511 byte csv. thanks

[NickCarducci]

I got an error uploading an image this time: I exceeded 20MB limit