wslでelixir その57

概要

wsl(wsl2じゃない)で、elixirやってみた。
練習問題、やってみた。

練習問題

Phoenixで、APIを作れ。
xhrで叩け

方針

• phx.gen.json使う。
• routerを書く
• controlerを書く
• cors対策

手順

• mix phx.gen.json

$ mix phx.gen.json Urls Url urls link:string title:string
* creating lib/hello2_web/controllers/url_controller.ex
* creating lib/hello2_web/views/url_view.ex
* creating test/hello2_web/controllers/url_controller_test.exs
* creating lib/hello2_web/views/changeset_view.ex
* creating lib/hello2_web/controllers/fallback_controller.ex
* creating lib/hello2/urls/url.ex
* creating priv/repo/migrations/20230913221227_create_urls.exs
* creating lib/hello2/urls.ex
* injecting lib/hello2/urls.ex
* creating test/hello2/urls_test.exs
* injecting test/hello2/urls_test.exs
* creating test/support/fixtures/urls_fixtures.ex
* injecting test/support/fixtures/urls_fixtures.ex

Add the resource to your :api scope in lib/hello2_web/router.ex:

		resources "/urls", UrlController, except: [:new, :edit]


Remember to update your repository by running migrations:

		$ mix ecto.migrate

• lib/hello2_web/router.ex:修正

		resources "/urls", UrlController, except: [:new, :edit]

• マイグレーションを実行

$ mix ecto.migrate
warning: the :gettext compiler is no longer required in your mix.exs.

Please find the following line in your mix.exs and remove the :gettext entry:

		compilers: [..., :gettext, ...] ++ Mix.compilers(),

	(gettext 0.23.1) lib/mix/tasks/compile.gettext.ex:5: Mix.Tasks.Compile.Gettext.run/1
	(mix 1.13.4) lib/mix/task.ex:397: anonymous fn/3 in Mix.Task.run_task/3
	(mix 1.13.4) lib/mix/tasks/compile.all.ex:92: Mix.Tasks.Compile.All.run_compiler/2
	(mix 1.13.4) lib/mix/tasks/compile.all.ex:72: Mix.Tasks.Compile.All.compile/4
	(mix 1.13.4) lib/mix/tasks/compile.all.ex:59: Mix.Tasks.Compile.All.with_logger_app/2
	(mix 1.13.4) lib/mix/tasks/compile.all.ex:36: Mix.Tasks.Compile.All.run/1

Compiling 7 files (.ex)
Generated hello2 app

07:17:32.409 [info]	== Running 20230913221227 Hello2.Repo.Migrations.CreateUrls.change/0 forward

07:17:32.423 [info]	create table urls

07:17:32.476 [info]	== Migrated 20230913221227 in 0.0s

• routes確認

$ mix phx.routes
warning: the :gettext compiler is no longer required in your mix.exs.

Please find the following line in your mix.exs and remove the :gettext entry:

		compilers: [..., :gettext, ...] ++ Mix.compilers(),

	(gettext 0.23.1) lib/mix/tasks/compile.gettext.ex:5: Mix.Tasks.Compile.Gettext.run/1
	(mix 1.13.4) lib/mix/task.ex:397: anonymous fn/3 in Mix.Task.run_task/3
	(mix 1.13.4) lib/mix/tasks/compile.all.ex:92: Mix.Tasks.Compile.All.run_compiler/2
	(mix 1.13.4) lib/mix/tasks/compile.all.ex:72: Mix.Tasks.Compile.All.compile/4
	(mix 1.13.4) lib/mix/tasks/compile.all.ex:59: Mix.Tasks.Compile.All.with_logger_app/2
	(mix 1.13.4) lib/mix/tasks/compile.all.ex:36: Mix.Tasks.Compile.All.run/1

					page_path	GET		 /																			Hello2Web.PageController :index
					page_path	POST		/hello																 Hello2Web.PageController :hello
					page_path	POST		/upload																Hello2Web.PageController :upload
					todo_path	GET		 /todos																 Hello2Web.TodoController :index
					todo_path	GET		 /todos/:id/edit												Hello2Web.TodoController :edit
					todo_path	GET		 /todos/new														 Hello2Web.TodoController :new
					todo_path	GET		 /todos/:id														 Hello2Web.TodoController :show
					todo_path	POST		/todos																 Hello2Web.TodoController :create
					todo_path	PATCH	 /todos/:id														 Hello2Web.TodoController :update
										 PUT		 /todos/:id														 Hello2Web.TodoController :update
					todo_path	DELETE	/todos/:id														 Hello2Web.TodoController :delete
					 url_path	GET		 /api/urls															Hello2Web.UrlController :index
					 url_path	GET		 /api/urls/:id													Hello2Web.UrlController :show
					 url_path	POST		/api/urls															Hello2Web.UrlController :create
					 url_path	PATCH	 /api/urls/:id													Hello2Web.UrlController :update
										 PUT		 /api/urls/:id													Hello2Web.UrlController :update
					 url_path	DELETE	/api/urls/:id													Hello2Web.UrlController :delete
live_dashboard_path	GET		 /dashboard														 Phoenix.LiveDashboard.PageLive :home
live_dashboard_path	GET		 /dashboard/:page											 Phoenix.LiveDashboard.PageLive :page
live_dashboard_path	GET		 /dashboard/:node/:page								 Phoenix.LiveDashboard.PageLive :page
										 *			 /dev/mailbox													 Plug.Swoosh.MailboxPreview []
					websocket	WS			/live/websocket												Phoenix.LiveView.Socket
					 longpoll	GET		 /live/longpoll												 Phoenix.LiveView.Socket
					 longpoll	POST		/live/longpoll												 Phoenix.LiveView.Socket

• cors対策

mix.exs
	defp deps do
		[
			{:cors_plug, "~> 1.2"}
		]
	end

$ mix deps.get
Resolving Hex dependencies...
Resolution completed in 0.298s
Unchanged:
  castore 1.0.3
  cowboy 2.10.0
  cowboy_telemetry 0.4.0
  cowlib 2.12.1
  db_connection 2.5.0
  decimal 2.1.1
  ecto 3.10.3
  ecto_sql 3.10.2
  esbuild 0.7.1
  expo 0.4.1
  file_system 0.2.10
  floki 0.34.3
  gettext 0.23.1
  jason 1.4.1
  mime 2.0.5
  phoenix 1.6.16
  phoenix_ecto 4.4.2
  phoenix_html 3.3.2
  phoenix_live_dashboard 0.6.5
  phoenix_live_reload 1.4.1
  phoenix_live_view 0.17.14
  phoenix_pubsub 2.1.3
  phoenix_template 1.0.3
  phoenix_view 2.0.2
  plug 1.14.2
  plug_cowboy 2.6.1
  plug_crypto 1.2.5
  postgrex 0.17.3
  ranch 1.8.0
  swoosh 1.11.5
  telemetry 1.2.1
  telemetry_metrics 0.6.1
  telemetry_poller 1.0.0
New:
  cors_plug 1.5.2
* Getting cors_plug (Hex package)

• endpoint.exに追加

plug CORSPlug

• options対策
  router.exを修正

  scope "/api", Hello2Web do
    pipe_through :api
    resources "/urls", UrlController, except: [:new, :edit]
	options "/urls", UrlController, :options
	options "/urls/:id", UrlController, :options
  end

成果物

• xhr

以上。