簡易にテストを見せるだけのサーバーを全てNetlifyに以降してみた、ユゲタです。
サーバーの運用管理って、正直面倒くさいです。
（楽しいという反面の気持ちもありますが・・・）
だって、自分で構築したサーバーだと、sslこう更新やら、osやらモジュールのアップデートやら、ログ管理やら、サーバー負荷監視やら・・・
初心者だったら、絶対に心折れるのは間違いないでしょう。
（これからサーバー学習始める人はこの箇所読まないでください）
最近だと、AWSやGCPなどのクラウドサーバーで色々と楽になる箇所もあるかもしれませんが、自分で作ったサービスのサンプルを乗っけるだけのサーバーを手軽に準備できるNetlifyが、今の所最強に使いやすいと感じています。
Netlifyって何ぞ？
ベタ褒めしている、Netlifyってどんなサービスかというと、以下のとおりです。
サービスURL
https://www.netlify.com/
概要
Netlifyってどんなサービスかというのを、一言で言うと、「静的なホームページを表示させるサービス」という事ですね。
静的なホームページというのは、CGIを使わないという事ですが、HTML+CSS+Javascriptは問題なく使えるので、ユゲタのよく推奨するカンタンなホームページ制作であれば、全くもって問題なく公開できてしまいます。
個人的感想
これまで、何かwebツールを作ったら、その都度サブドメインを作って、DNSをセットして、サーバーの準備をして公開して、SSLを適用して、3ヶ月毎に更新して・・・みたいなことをやっていたんですが、最初に準備しておけば、全く運用手間いらずというのも魅力の一つです。
もちろん、アクセス上限値もあるので、爆発的にアクセスされるようなホームページは、有料版を使うことになりますが、ちょっとしたサンプルサイト程度であれば、無料で運用できてしまうのも嬉しいですよね。
問題発生
そんな便利なNetlifyで、ブログ用に作ったjavascriptのツールを設置したところ、CORSエラーが発生してしまいました。
ありゃ、たしかに、ブログドメインとNetlifyドメインが違うので、エラーになるのは分かります。
これまで、CORSエラーは、受け側のサーバーに
Access-Control-Allow-Origin : *
をセットするだけでよかったのに、Netlifyってサーバー設定をどうすればいいのか分からなくて調べて、解決した方法を紹介したいと思います。
CORSエラー解決編
まず次のファイルをroot階層に設置します。
[[headers]]
for = "/*"
[headers.values]
Access-Control-Allow-Origin = "*"
netlify.tomlというファイルは、Apacheで言うところの、.htaccessのようなものだと考えるとわかりやすいでしょう。
これで、本番にデプロイしたら、CORSエラーが無くなりました。
非常にスッキリ！！
天気もいいし、なんて気持ちのいい朝なんだ。
こんなに簡単に、物事が解決すると、今日はなんかいい事ありそう・・・
0 件のコメント:
コメントを投稿