【Rails】image_기본 이미지와 기본 이미지의 설정 방법
image_기본 계획
image_'tag'은 Rails가 준비한 HTML
태그를 생성하는 방법입니다.
페이지에 이미지를 표시할 때 사용합니다.
문장의 구조는 다음과 같다.image_tag(source, options = {})
source 부분에서 그림이 있는 위치를 설명하고 옵션에서class 이름과alt 속성을 지정합니다.
※ alt 속성이 무엇인지는 이쪽 링크를 통해 확인하세요.간단하게 설명하면 이미지가 특정 이유로 표시되지 않을 때 대신 표시되는 문자가 됩니다.
alt 속성
클래스 이름과alt 속성을 사용할 때 다음과 같습니다.uby
image_tag 'icons/cat.jpg', :class=>"cat-icon", :alt => '猫の画像'
참고로, eb 파일에 기술할 때 <%=%>로 둘러싸야 합니다.<%= image_tag 'icons/cat.jpg', :class=>"cat-icon", :alt => '猫の画像' %>
그림을 어디에 놓을까요?
① "app/assets/images" 디렉토리
여기에 놓으면 파일 이름만 지정하면 됩니다.<%= image_tag 'cat.jpg' %>
② "app/public" 디렉토리
"public"디렉터리 바로 아래에 이미지 파일을 설정할 때
여기에 놓으면 앱의 상대적인 경로를 써야 한다.<%= image_tag '/cat.jpg' %>
사용자 아이콘 등을 기본적으로 설정하려면
나는 사용자가 등록할 때 이름과 메일 주소 등을 입력하고 이미지를 등록하지 않으면 완성되는 경우가 많다고 생각한다.
새 로그인이 완료된 후 사용자의 이미지는 아무것도 들어오지 않은 상태이기 때문에 기본적으로 그림을 입력하는 방법을 먼저 적으십시오.
메서드 ① 이미지를 업로드하지 않은 경우 CarrierWave 사용
image_uploader.rb의 코드를 조금만 만지작거리면 기본적으로 설정된 그림을 대상의 위치에 놓으면 설정을 완성할 수 있습니다.
STEP1:image_uploader.희롱하다
app/uploaders/image_uploader.rb(中略)
# Provide a default URL as a default if there hasn't been a file uploaded:
# def default_url(*args)
# # For Rails 3.1+ asset pipeline compatibility:
# # ActionController::Base.helpers.asset_path("fallback/" + [version_name, "default.png"].compact.join('_'))
#
# "/images/fallback/" + [version_name, "default.png"].compact.join('_')
# end
(中略)
아래와 같이 이것↓
app/uploaders/image_uploader.rb(中略)
# Provide a default URL as a default if there hasn't been a file uploaded:
def default_url(*args)
# # For Rails 3.1+ asset pipeline compatibility:
# # ActionController::Base.helpers.asset_path("fallback/" + [version_name, "default.png"].compact.join('_'))
"default.jpg"
# "/images/fallback/" + [version_name, "default.png"].compact.join('_')
end
(中略)
STEP2: app/assets/images 바로 아래에 파일 놓기
image_uploader.rb가 지정한 파일 이름을 놓습니다. (이번은default.jpg)
이렇게 완성!
이렇게 하면 그림이 업로드되지 않았을 때,carrierwave는 자동으로 기본적으로 그림을 설정합니다.
방법 ② 컨트롤러에 미리 데이터를 준비하는 방법
컨트롤러를 사용하여 실례 변수에 데이터를 미리 입력하는 방법.이번에는 사용자 로그인을 구상했다.
app/controllers/users_controller.rbclass UsersController < ApplicationController
(中略)
def create
@user = User.new(user_params)
#デフォルトで画像を設定しておく。ユーザーのimageカラムにデータを代入
@user.image = "default_icon.jpg"
if @user.save
redirect_to posts_path, success: '登録ができました'
else
flash.now[:danger] = "登録に失敗しました"
render :new
end
end
(中略)
def user_params
params.require(:user).permit(:name, :password, :password_confirmation, :image)
end
end
그리고 뷰 옆에 보이면 돼요!
user.show.html.erb<%= image_tag @user.image_icon.url, class:"user-icon" %>
P.S.
Carrier Wave를 사용하여 기본 이미지를 설정하는 방법은 사실상 단점이 있습니다.
그것은 업로드해야 할 이미지 부분이 모두 같은 기본 이미지로 바뀌었다.
업로드 후 표시된 이미지에 무의식적으로 준비한 이미지를 사용했기 때문에 표시와 일치하지 않는 부분에도 적용될 수 있습니다.
업로드된 이미지가 하나면 문제없지만 여러 군데가 있다면 컨트롤러에서 데이터를 각각 전달하는 것이 비교적 유용하다고 생각합니다.
참고 자료
image_tag(source, options = {})
uby
image_tag 'icons/cat.jpg', :class=>"cat-icon", :alt => '猫の画像'
<%= image_tag 'icons/cat.jpg', :class=>"cat-icon", :alt => '猫の画像' %>
① "app/assets/images" 디렉토리
여기에 놓으면 파일 이름만 지정하면 됩니다.
<%= image_tag 'cat.jpg' %>
② "app/public" 디렉토리
"public"디렉터리 바로 아래에 이미지 파일을 설정할 때
여기에 놓으면 앱의 상대적인 경로를 써야 한다.
<%= image_tag '/cat.jpg' %>
사용자 아이콘 등을 기본적으로 설정하려면
나는 사용자가 등록할 때 이름과 메일 주소 등을 입력하고 이미지를 등록하지 않으면 완성되는 경우가 많다고 생각한다.
새 로그인이 완료된 후 사용자의 이미지는 아무것도 들어오지 않은 상태이기 때문에 기본적으로 그림을 입력하는 방법을 먼저 적으십시오.
메서드 ① 이미지를 업로드하지 않은 경우 CarrierWave 사용
image_uploader.rb의 코드를 조금만 만지작거리면 기본적으로 설정된 그림을 대상의 위치에 놓으면 설정을 완성할 수 있습니다.
STEP1:image_uploader.희롱하다
app/uploaders/image_uploader.rb(中略)
# Provide a default URL as a default if there hasn't been a file uploaded:
# def default_url(*args)
# # For Rails 3.1+ asset pipeline compatibility:
# # ActionController::Base.helpers.asset_path("fallback/" + [version_name, "default.png"].compact.join('_'))
#
# "/images/fallback/" + [version_name, "default.png"].compact.join('_')
# end
(中略)
아래와 같이 이것↓
app/uploaders/image_uploader.rb(中略)
# Provide a default URL as a default if there hasn't been a file uploaded:
def default_url(*args)
# # For Rails 3.1+ asset pipeline compatibility:
# # ActionController::Base.helpers.asset_path("fallback/" + [version_name, "default.png"].compact.join('_'))
"default.jpg"
# "/images/fallback/" + [version_name, "default.png"].compact.join('_')
end
(中略)
STEP2: app/assets/images 바로 아래에 파일 놓기
image_uploader.rb가 지정한 파일 이름을 놓습니다. (이번은default.jpg)
이렇게 완성!
이렇게 하면 그림이 업로드되지 않았을 때,carrierwave는 자동으로 기본적으로 그림을 설정합니다.
방법 ② 컨트롤러에 미리 데이터를 준비하는 방법
컨트롤러를 사용하여 실례 변수에 데이터를 미리 입력하는 방법.이번에는 사용자 로그인을 구상했다.
app/controllers/users_controller.rbclass UsersController < ApplicationController
(中略)
def create
@user = User.new(user_params)
#デフォルトで画像を設定しておく。ユーザーのimageカラムにデータを代入
@user.image = "default_icon.jpg"
if @user.save
redirect_to posts_path, success: '登録ができました'
else
flash.now[:danger] = "登録に失敗しました"
render :new
end
end
(中略)
def user_params
params.require(:user).permit(:name, :password, :password_confirmation, :image)
end
end
그리고 뷰 옆에 보이면 돼요!
user.show.html.erb<%= image_tag @user.image_icon.url, class:"user-icon" %>
P.S.
Carrier Wave를 사용하여 기본 이미지를 설정하는 방법은 사실상 단점이 있습니다.
그것은 업로드해야 할 이미지 부분이 모두 같은 기본 이미지로 바뀌었다.
업로드 후 표시된 이미지에 무의식적으로 준비한 이미지를 사용했기 때문에 표시와 일치하지 않는 부분에도 적용될 수 있습니다.
업로드된 이미지가 하나면 문제없지만 여러 군데가 있다면 컨트롤러에서 데이터를 각각 전달하는 것이 비교적 유용하다고 생각합니다.
참고 자료
image_uploader.rb의 코드를 조금만 만지작거리면 기본적으로 설정된 그림을 대상의 위치에 놓으면 설정을 완성할 수 있습니다.
STEP1:image_uploader.희롱하다
app/uploaders/image_uploader.rb
(中略)
# Provide a default URL as a default if there hasn't been a file uploaded:
# def default_url(*args)
# # For Rails 3.1+ asset pipeline compatibility:
# # ActionController::Base.helpers.asset_path("fallback/" + [version_name, "default.png"].compact.join('_'))
#
# "/images/fallback/" + [version_name, "default.png"].compact.join('_')
# end
(中略)
아래와 같이 이것↓app/uploaders/image_uploader.rb
(中略)
# Provide a default URL as a default if there hasn't been a file uploaded:
def default_url(*args)
# # For Rails 3.1+ asset pipeline compatibility:
# # ActionController::Base.helpers.asset_path("fallback/" + [version_name, "default.png"].compact.join('_'))
"default.jpg"
# "/images/fallback/" + [version_name, "default.png"].compact.join('_')
end
(中略)
STEP2: app/assets/images 바로 아래에 파일 놓기
image_uploader.rb가 지정한 파일 이름을 놓습니다. (이번은default.jpg)
이렇게 완성!
이렇게 하면 그림이 업로드되지 않았을 때,carrierwave는 자동으로 기본적으로 그림을 설정합니다.
방법 ② 컨트롤러에 미리 데이터를 준비하는 방법
컨트롤러를 사용하여 실례 변수에 데이터를 미리 입력하는 방법.이번에는 사용자 로그인을 구상했다.
app/controllers/users_controller.rbclass UsersController < ApplicationController
(中略)
def create
@user = User.new(user_params)
#デフォルトで画像を設定しておく。ユーザーのimageカラムにデータを代入
@user.image = "default_icon.jpg"
if @user.save
redirect_to posts_path, success: '登録ができました'
else
flash.now[:danger] = "登録に失敗しました"
render :new
end
end
(中略)
def user_params
params.require(:user).permit(:name, :password, :password_confirmation, :image)
end
end
그리고 뷰 옆에 보이면 돼요!
user.show.html.erb<%= image_tag @user.image_icon.url, class:"user-icon" %>
P.S.
Carrier Wave를 사용하여 기본 이미지를 설정하는 방법은 사실상 단점이 있습니다.
그것은 업로드해야 할 이미지 부분이 모두 같은 기본 이미지로 바뀌었다.
업로드 후 표시된 이미지에 무의식적으로 준비한 이미지를 사용했기 때문에 표시와 일치하지 않는 부분에도 적용될 수 있습니다.
업로드된 이미지가 하나면 문제없지만 여러 군데가 있다면 컨트롤러에서 데이터를 각각 전달하는 것이 비교적 유용하다고 생각합니다.
참고 자료
class UsersController < ApplicationController
(中略)
def create
@user = User.new(user_params)
#デフォルトで画像を設定しておく。ユーザーのimageカラムにデータを代入
@user.image = "default_icon.jpg"
if @user.save
redirect_to posts_path, success: '登録ができました'
else
flash.now[:danger] = "登録に失敗しました"
render :new
end
end
(中略)
def user_params
params.require(:user).permit(:name, :password, :password_confirmation, :image)
end
end
<%= image_tag @user.image_icon.url, class:"user-icon" %>
Carrier Wave를 사용하여 기본 이미지를 설정하는 방법은 사실상 단점이 있습니다.
그것은 업로드해야 할 이미지 부분이 모두 같은 기본 이미지로 바뀌었다.
업로드 후 표시된 이미지에 무의식적으로 준비한 이미지를 사용했기 때문에 표시와 일치하지 않는 부분에도 적용될 수 있습니다.
업로드된 이미지가 하나면 문제없지만 여러 군데가 있다면 컨트롤러에서 데이터를 각각 전달하는 것이 비교적 유용하다고 생각합니다.
참고 자료
Reference
이 문제에 관하여(【Rails】image_기본 이미지와 기본 이미지의 설정 방법), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://qiita.com/Toshimatu/items/a6382efd410fe5544406텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념
(Collection and Share based on the CC Protocol.)