피닉스의 REST API

프런트엔드 또는 공용 사용을 위해 작은 REST API를 작성하는 방법에 대해 궁금한 적이 있습니까? - 방법은 다음과 같습니다.

요구 사항:

엘릭서 v13.3.2 +

피닉스 v1.6.10+

엘릭서 기초지식

$ elixir -v
Elixir 1.13.2 (compiled with Erlang/OTP 24)

$ mix phx.new --version
Phoenix installer v1.6.10

시작하기

다음 명령을 사용하여 프로젝트 생성부터 시작하겠습니다.

$ mix phx.new myApp --no-html --no-assets --no-mailer --no-dashboard --no-ecto 

This will remove all the useless boilerplate for us - since APis do not need any HTML or CSS.

이제 폴더로의 경로를 허용합니다.

$ cd myApp

먼저 라우터lib/myapp_web/router.ex를 열고 다음 코드를 추가합니다.get "/random", RandomController, :index
라우터는 이제 다음과 같아야 합니다.

defmodule MyAppWeb.Router do
  use MyAppWeb, :router

  pipeline :api do
    plug :accepts, ["json"]
  end

  # localhost:4000/api/{route}
  scope "/api", MyAppWeb do
    pipe_through :api

    get "/random", RandomController, :index
  end
end

커스텀 컨트롤러

라우터에 정의된 대로 이제 RandomController 라는 컨트롤러가 필요합니다.
이를 위해 controllers ( lib/myapp_web/controllers ) 폴더를 열고 random_controller.ex 라는 새 파일을 만듭니다.

defmodule MyAppWeb.RandomController do
  use MyAppWeb, :controller

  def index(conn, _params) do
    send_resp(conn, 200, "hello world")
  end
end

이 파일을 저장하고 이제 서버를 시작하십시오.

$ mix phx.server

서버가 http://localhost:4000/api/random에서 수신 중이어야 합니다. 선호하는 브라우저에 해당 URL을 입력해 보십시오. 이제 "hello world"를 볼 수 있습니다 😁.

사용자 지정 파일

컨트롤러에 함수를 직접 작성하는 것은 좋지 않습니다. 특히 더 큰 프로젝트에서는 더욱 그렇습니다. 따라서 우리를 위해 모든 것을 처리하는 도우미 함수를 작성해 보겠습니다.
helper 경로를 사용하여 lib/myapp/helper라는 폴더를 만듭니다.

이것은 웹과 관련이 없기 때문에 이제 기본 폴더(myapp_web가 아닌)를 사용합니다.

해당 폴더에서 random.ex라는 파일을 만듭니다.

다음과 같아야 합니다.

defmodule MyApp.Random do
  def random_number do
   Enum.random(100..10000)
  end
end

좋습니다. 이제 random_controller.ex로 돌아가서 약간 수정해 보겠습니다.

우선, 해당 기능과 함께 새 도우미 파일을 가져옵니다.
import MyApp.Random
그런 다음 "hello world"응답을 함수 이름random_number()으로 바꿉니다.

이와 같이:send_resp(conn, 200, random_number()) .
random_controller.ex는 이제 다음과 같아야 합니다.

defmodule MyAppWeb.RandomController do
  use MyAppWeb, :controller

  import MyApp.Random

  def index(conn, _params) do
    send_resp(conn, 200, random_number())
  end
end

파일을 저장하고 서버를 다시 시작하십시오.

$ mix phx.server

다음 URL로 이동: http://localhost:4000/api/random 이제 페이지를 새로 고치거나 페이지에 들어갈 때마다 임의의 숫자가 표시됩니다. 🎉

CORS 처리

이것은 보다 심층적인 주제이지만 다른 사람이 API를 사용하거나 다른 포트/ip에서 자신의 API를 호출하도록 하려면 필요합니다.

이를 위해 corsica라는 라이브러리를 사용할 것입니다. 루트 디렉토리에서 mix.exs 파일을 열어 설치하겠습니다.
deps 함수에 다음 줄을 추가합니다.

{:corsica, "~> 1.2"}

귀하의 mix.exs는 이제 다음과 같아야 합니다.

defmodule MyApp.MixProject do
  use Mix.Project

  def project do
    [
      app: :myapp,
      version: "0.1.0",
      elixir: "~> 1.13",
      description: "An example Web APi",
      elixirc_paths: elixirc_paths(Mix.env()),
      compilers: Mix.compilers(),
      start_permanent: Mix.env() == :prod,
      aliases: aliases(),
      deps: deps(),
      author: "github.com/vKxni",
      docs: [
        main: "readme",
        extras: [
          "README.md"
        ]
      ]
    ]
  end

  def application do
    [
      mod: {MyApp.Application, []},
      extra_applications: [:logger, :runtime_tools]
    ]
  end

  defp elixirc_paths(:test), do: ["lib", "test/support"]
  defp elixirc_paths(_), do: ["lib"]

  # Here !! :)
  defp deps do
    [
      # phoenix server
      {:phoenix, "~> 1.6.10"},
      {:telemetry_metrics, "~> 0.6"},
      {:telemetry_poller, "~> 1.0"},
      {:gettext, "~> 0.18"},
      {:plug_cowboy, "~> 2.5"},
      {:poison, "~> 5.0"},
      {:jason, "~> 1.3"},

      # add this line here
      {:corsica, "~> 1.2"} # <--
    ]
  end

  defp aliases do
    [
      setup: ["deps.get"]
    ]
  end
end

완료되면 다음 명령을 실행하십시오.

$ mix deps.get

연결에 따라 다소 시간이 걸릴 수 있습니다.

끝점에 CORS 추가

endpoint.exs 폴더에서 myapp_web라는 파일을 엽니다.
( lib/myapp_web/endpoint.exs )

이제 엔드포인트에서 다음 행을 추가하십시오.

 plug(Corsica,
    max_age: 600,
    origins: "*",
    allow_headers: ["accept", "content-type", "authorization"],
    allow_methods: ["GET", "POST"],
    allow_credentials: true,
    log: [rejected: :error, invalid: :warn, accepted: :debug]
  )

endpoint.exs는 이제 다음과 같이 표시됩니다.

defmodule MyAppWeb.Endpoint do
  use Phoenix.Endpoint, otp_app: :xadara

  @session_options [
    store: :cookie,
    key: "_myapp_key",
    signing_salt: "g10HT1jr"
  ]

  # our CORS config starts here
  plug(Corsica,
    max_age: 600,
    origins: "*",
    allow_headers: ["accept", "content-type", "authorization"],
    allow_methods: ["GET", "POST"],
    allow_credentials: true,
    log: [rejected: :error, invalid: :warn, accepted: :debug]
  )
  # CORS ends here

  plug Plug.Static,
    at: "/",
    from: :myapp,
    gzip: false,
    only: ~w(assets fonts images favicon.ico robots.txt)

  if code_reloading? do
    plug Phoenix.CodeReloader
  end

  plug Plug.RequestId
  plug Plug.Telemetry, event_prefix: [:phoenix, :endpoint]

  plug Plug.Parsers,
    parsers: [:urlencoded, :multipart, :json],
    pass: ["*/*"],
    json_decoder: Phoenix.json_library()

  plug Plug.MethodOverride
  plug Plug.Head
  plug Plug.Session, @session_options
  plug MyAppWeb.Router # this here is important too
end

뭔가 조금 다르게 보이더라도 걱정하지 마세요. session_options 바로 아래에 새 PLUG를 추가하면 됩니다.

그리고 끝났습니다! 축하합니다.