前提・実現したいこと
登録した住所からgeocoderで緯度経度を取得し、
登録場所をGeocoding APIとMaps JavaScript APIを使い、詳細ページにてマップ上に表示させたいです。
発生している問題・エラーメッセージ
住所を登録後、詳細ページにMAPが表示されない状態になってしまっているため、
データベースを確認すると住所から緯度経度が自動的に保存されていない状態になってしまっている。
そのため、rails cをしてコンソールにて確認をするが、ターミナルに以下のエラー文が出ており、確認ができていない状態です。
ターミナル
/Users/k.h/.rbenv/versions/2.6.5/lib/ruby/gems/2.6.0/gems/bootsnap-1.5.1/lib/bootsnap/load_path_cache/core_ext/active_support.rb:80:in `block in load_missing_constant': uninitialized constant [APIkey] (NameError)
Geocoding APIとMaps JavaScript APIのAPIkeyはサイトで確認したが、きちんと有効になっており、取得できている。
以下、ソースコードになります。
質問の問題点が複数になってしまっておりますが、アドバイスのほどご教授いただければ幸いです。
よろしくお願いいたします。
ソースコード
######show.html.erb
ruby
1<h2>MAP</h2> 2 <div id='map'></div> 3 <script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyA5IBI1uKD_cvsflrRSl-LVDhxdWjeZNFQ&callback=initMap" async defer></script> 4 5 <style> 6 #map { 7 height: 200px; 8 width: 70%; 9 } 10 </style> 11 12 <script> 13 let map 14 15 function initMap(){ 16 geocoder = new google.maps.Geocoder() 17 map = new google.maps.Map(document.getElementById('map'), { 18 center: {lat: gon.post.latitude, lng: gon.post.longitude}, 19 zoom: 12, 20 }); 21 22 marker = new google.maps.Marker({ 23 position: {lat: gon.post.latitude, lng: gon.post.longitude }, 24 map: map 25 }); 26 } 27 </script>
######post.rb
ruby
1# 追記 2geocoded_by :address 3after_validation :geocode, if: :address_changed?
######Gemfile
source 'https://rubygems.org' git_source(:github) { |repo| "https://github.com/#{repo}.git" } ruby '2.6.5' # Bundle edge Rails instead: gem 'rails', github: 'rails/rails' gem 'rails', '~> 6.0.0' # Use mysql as the database for Active Record gem 'mysql2', '>= 0.5.3' # Use Puma as the app server gem 'puma', '~> 3.11' # Use SCSS for stylesheets gem 'sass-rails', '~> 5' # Transpile app-like JavaScript. Read more: https://github.com/rails/webpacker gem 'webpacker', '~> 4.0' # Turbolinks makes navigating your web application faster. Read more: https://github.com/turbolinks/turbolinks gem 'turbolinks', '~> 5' # Build JSON APIs with ease. Read more: https://github.com/rails/jbuilder gem 'jbuilder', '~> 2.7' # Use Redis adapter to run Action Cable in production # gem 'redis', '~> 4.0' # Use Active Model has_secure_password # gem 'bcrypt', '~> 3.1.7' # Use Active Storage variant # gem 'image_processing', '~> 1.2' # Reduces boot times through caching; required in config/boot.rb gem 'bootsnap', '>= 1.4.2', require: false gem 'counter_culture', '~> 1.8' group :development, :test do # Call 'byebug' anywhere in the code to stop execution and get a debugger console gem 'byebug', platforms: [:mri, :mingw, :x64_mingw] gem 'rspec-rails', '~> 4.0.0' gem 'factory_bot_rails' gem 'faker' end group :development do # Access an interactive console on exception pages or by calling 'console' anywhere in the code. gem 'web-console', '>= 3.3.0' gem 'listen', '>= 3.0.5', '< 3.2' # Spring speeds up development by keeping your application running in the background. Read more: https://github.com/rails/spring gem 'spring' gem 'spring-watcher-listen', '~> 2.0.0' end group :test do # Adds support for Capybara system testing and selenium driver gem 'capybara', '>= 2.15' gem 'selenium-webdriver' # Easy installation and use of web drivers to run system tests with browsers gem 'webdrivers' end # Windows does not include zoneinfo files, so bundle the tzinfo-data gem gem 'tzinfo-data', platforms: [:mingw, :mswin, :x64_mingw, :jruby] gem 'devise' gem 'pry-rails' group :development do gem 'rubocop', require: false end gem 'mini_magick' gem 'image_processing', '~> 1.2' gem 'active_hash' gem 'bootstrap', '~> 4.5.0' gem 'jquery-rails' gem 'font-awesome-rails' gem 'gon' gem 'geocoder'
######config/initializers/geocoder.rb
Geocoder.configure( # Geocoding options # timeout: 3, # geocoding service timeout (secs) lookup: :google, # name of geocoding service (symbol) # ip_lookup: :ipinfo_io, # name of IP address geocoding service (symbol) # language: :en, # ISO-639 language code use_https: true, # use HTTPS for lookup requests? (if supported) # http_proxy: nil, # HTTP proxy server (user:pass@host:port) # https_proxy: nil, # HTTPS proxy server (user:pass@host:port) api_key: [APIkey], # API key for geocoding service # cache: nil, # cache object (must respond to #[], #[]=, and #del) # cache_prefix: 'geocoder:', # prefix (string) to use for all cache keys # Exceptions that should not be rescued by default # (if you want to implement custom error handling); # supports SocketError and Timeout::Error # always_raise: [], # Calculation options units: :km, # :km for kilometers or :mi for miles # distances: :linear # :spherical or :linear )
ご回答いただければ幸いでございます。
あなたの回答
tips
プレビュー