Skip to content

atilafassina/contentful-link-checker-ui-extension

 
 

Repository files navigation

header

Contentful URL checker UI extension

A Contentful UI-extension that gets all string values of an entry, gets the included URLs and makes actual requests to see if the URL responds with a 200 status code.

Link checker UI-extension in the Contentful interface

How it works

The UI extension will access all string values of the entry and evaluate what URLs are included. Then it will make actual requests to the found URLs and check if the returned status code is 200. If now the URLs is marked as invalid.

Additionally the extension makes use of parameters which makes it possible to black-list certain URLs to prevent e.g. linking to a testing or staging environment.

How to install

Currently there are two way to install a UI-extension.

Installation via the web app

  • go to the extensions section in the web app
  • click Add extension
  • click Install from GitHub
  • paste https://github.com/stefanjudis/contentful-link-checker-ui-extension/blob/master/extension.json into the input field
  • done ✅

Install extension via GitHub dialog

Installation via the command line

  • clone the repository via git clone git@github.com:stefanjudis/contentful-link-checker-ui-extension.git
  • run npm install in the cloned directory
  • run npm run create
  • done ✅

The repository has the Contentful CLI as a local dependency so that you don't have install it globally.

How to enable the extension

To enable the extension go to a content type of your choice and add a new field of type Boolean. In the appearance panel you can then find the URL checker. There you can also define the URLs (a simple string match is performed) that should be marked as invalid, too.

The appearance panel of a field in a content type

Don't forget to disable the created Boolean field in the API responses. This boolean field is most likely nothing you want to include in your payloads.

There is one big gotcha – Use at own risk!

Due to the security setting of Contentful and the way UI-extensions work all requests are piped through http://cors-anywhere.herokuapp.com. This is needed because most of the URLs you'll link to won't include CORS headers which means that requests made by the extension would be blocked.

The UI-extension itself does nothing else then checking the status code of the request response which means that even when the owner of cors-anywhere changes the responses in an malicious way there is no risk.

But still – Use at own risk!

About

A UI extension to check for broken or invalid links

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • HTML 100.0%