Url.Builder

In the URI spec, Tim Berners-Lee says a URL looks like this:

  https://example.com:8042/over/there?name=ferret#nose
  \___/   \______________/\_________/ \_________/ \__/
    |            |            |            |        |
  scheme     authority       path        query   fragment

This module helps you create these!

Builders

absolute : Array String -> Array QueryParameter -> String

Create an absolute URL:

absolute [] []
-- "/"

absolute [ "packages", "elm", "core" ] []
-- "/packages/elm/core"

absolute [ "blog", String.fromInt 42 ] []
-- "/blog/42"

absolute [ "products" ] [ string "search" "hat", int "page" 2 ]
-- "/products?search=hat&page=2"

Notice that the URLs start with a slash!

relative : Array String -> Array QueryParameter -> String

Create a relative URL:

relative [] []
-- ""

relative [ "elm", "core" ] []
-- "elm/core"

relative [ "blog", String.fromInt 42 ] []
-- "blog/42"

relative [ "products" ] [ string "search" "hat", int "page" 2 ]
-- "products?search=hat&page=2"

Notice that the URLs do not start with a slash!

crossOrigin : String -> Array String -> Array QueryParameter -> String

Create a cross-origin URL.

crossOrigin "https://example.com" [ "products" ] []
-- "https://example.com/products"

crossOrigin "https://example.com" [] []
-- "https://example.com/"

crossOrigin
  "https://example.com:8042"
  [ "over", "there" ]
  [ string "name" "ferret" ]
-- "https://example.com:8042/over/there?name=ferret"

Note: Cross-origin requests are slightly restricted for security. For example, the same-origin policy applies when sending HTTP requests, so the appropriate Access-Control-Allow-Origin header must be enabled on the server to get things working. Read more about the security rules here.

custom :
Root
-> Array String
-> Array QueryParameter
-> Maybe String
-> String

Create custom URLs that may have a hash on the end:

custom Absolute
  [ "packages", "elm", "core", "latest", "String" ]
  []
  (Just "length")
-- "/packages/elm/core/latest/String#length"

custom Relative [ "there" ] [ string "name" "ferret" ] Nothing
-- "there?name=ferret"

custom
  (CrossOrigin "https://example.com:8042")
  [ "over", "there" ]
  [ string "name" "ferret" ]
  (Just "nose")
-- "https://example.com:8042/over/there?name=ferret#nose"
type Root
= Absolute
| Relative
| CrossOrigin String

Specify whether a custom URL is absolute, relative, or cross-origin.

Queries

type QueryParameter

Represents query parameter. Builder functions like absolute percent-encode all the query parameters they get, so you do not need to worry about it!

string : String -> String -> QueryParameter

Create a percent-encoded query parameter.

absolute ["products"] [ string "search" "hat" ]
-- "/products?search=hat"

absolute ["products"] [ string "search" "coffee table" ]
-- "/products?search=coffee%20table"
int : String -> Int -> QueryParameter

Create a percent-encoded query parameter.

absolute ["products"] [ string "search" "hat", int "page" 2 ]
-- "/products?search=hat&page=2"

Writing int key n is the same as writing string key (String.fromInt n). So this is just a convenience function, making your code a bit shorter!

toQuery : Array QueryParameter -> String

Convert a Array of query parameters to a percent-encoded query. This function is used by absolute, relative, etc.

toQuery [ string "search" "hat" ]
-- "?search=hat"

toQuery [ string "search" "coffee table" ]
-- "?search=coffee%20table"

toQuery [ string "search" "hat", int "page" 2 ]
-- "?search=hat&page=2"

toQuery []
-- ""