NUKnightLab / NUKnightLab/StoryMapJS

OpenStreetMap does not work on Wordpress.com

Open
#507 0 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Dominant language
JavaScript
Stars
248
Forks
61
Avg merge
1m
Merged PRs (30d)
1

Description

We've had a series of reports from people who use Wordpress.com that their map is filled with 403 blocked tiles.

Image

Wordpress.com does not allow iframe tags in the Custom HTML block; instead, storymaps must be embedded using the embed block, which constructs an iframe with the storymap URL. The constructed iframe has sandbox="allow-scripts" which prevents the referrer from being sent with the tile request, which is against OpenStreetMap's policy.

We cannot change the way that Wordpress handles embeds. For now, the workaround is to use a different basemap. The only no-cost basemap directly supported by StoryMapJS is "Cooper-Hewitt: Watercolor".

Users could also consider using Mapbox Studio or Stadia Maps, each of which have some no-cost options. Mapbox Studio's pay-as-you-go plan might never get to the point of costing money; Stadia's no-cost option is only available for non-commercial use. Of course, if you have access to some other "slippy map" URL, you could use that with the "custom" map type.

To consider: should StoryMapJS be updated to recognize when self.origin === "null" and the basemap is set to OpenStreetMap and

  • switch to another map
  • message the viewer (who may not be the author)
  • both
  • neither

Contributor guide

No contributing guide indexed for this repository

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start by reproducing a StoryMapJS with the OpenStreetMap basemap inside a WordPress.com embed block, where the sandboxed iframe produces 403 tile requests. Decide whether StoryMapJS should detect a null origin, switch basemaps, notify viewers, or do nothing; done requires an agreed behavior and verification that the embedded map no longer fails or clearly informs users.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript
Domain
frontend, web-dev
Issue type
Bug
Difficulty
5/5
Estimated time
Over a week
Activity status
Active
Clarity
Needs clarification
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.