Rails 3.1은 뒤로 버튼을 사용할 때 원시 Javascript 코드를 반환합니다.

Rails 3.1은 뒤로 버튼을 사용할 때 원시 Javascript 코드를 반환합니다.

나의 기본 목표

HTML5를 사용하여 브라우저의 기록 상태를 유지하면서 Ajax를 통해 새로운 콘텐츠를 로드할 수 있는 Rails 앱입니다.나는 헤로쿠에서 실행되는 초기본 버전의 앱을 가지고 있습니다.아래에 언급된 모든 코드를 더 자세히 볼 수 있도록 공용 GitHub 저장소도 설치했습니다.

문제

HTML5 브라우저 히스토리 API를 사용하여 기본 앱을 성공적으로 구현했습니다(한 때 History.jsjQuery 플러그인을 사용하여 버전도 만들었습니다).사용자가 축이 아닌 링크를 클릭한 다음 뒤로 단추를 누를 때까지 모든 것이 정상적으로 작동합니다.예를 들어 사용자가 항목 2를 클릭하면 앱이 새 콘텐츠를 성공적으로 로드하고 브라우저 상태를 변경합니다.뒤로 단추를 누르면 이전 내용이 올바르게 다시 로드되고 브라우저 상태가 일치하도록 다시 변경됩니다.그러나 사용자가 다른 웹 페이지(인터넷의 다른 페이지)를 찾은 다음 브라우저의 뒤로 단추를 클릭하면 Rails 앱은 원본 페이지 대신 원시 Javascript를 렌더링합니다.

컨트롤러가 show.html.erb 대신 show.js.erb에서 원시 자바스크립트를 반환하기 시작할 때까지 모든 것이 작동합니다.컨트롤러에서 여러 설정을 변경해 보았지만 구체적으로 무엇이 원인인지 알 수 없습니다.show.js.erb에서 history.pushState 호출을 제거하면 문제가 멈춘다는 것을 알고 있습니다(애초에 찾았던 브라우저 기록 기능이 모두 사라졌습니다).

아이디어 있어요?

보너스: 고통스러운 세부 사항

이것이 모든 것이 작동하는 방식입니다.

사용자가 후드 아래에 있는 다음과 같은 링크를 클릭합니다.

<%= link_to number_to_human(volume.number), volume_path(volume), :remote => true %>

그러면 다음과 같은 Javascript 요청이 컨트롤러로 전송됩니다.

def show
  @volume = Volume.find(params[:id])

  respond_to do |format|
    format.html # show.html.erb
    format.js # show.js.erb
    format.json { render json: @volume }
  end
end

이렇게 하면 다음과 같은 show.js.erb 요청이 전달됩니다.

var stateObject = {"html": "<%= escape_javascript render(@volume) %>"};
history.pushState(stateObject,'',"<%= escape_javascript volume_path(@volume) %>");
$('#volumes').fadeTo(0, 0);
$('#volumes').html(stateObject.html).fadeTo('slow', 1.0);

그런 다음 원래 페이지의 div 태그 내용을 대체하고 pushState를 사용하여 상태 개체를 만들고 페이지 URL을 변경합니다.

그런 다음 사용자는 뒤로 버튼을 클릭하고 show.html.erb의 window.onpopstate 이벤트에 첨부된 Javascript가 적절한 콘텐츠를 다시 로드합니다.

    if(history.pushState) {
    window.onpopstate = function(event) {  
        if (event.state != null) {
            $('#volumes').html(event.state.html);
        }
    }
}

저는 RoR이 매우 생소해서 제 답변이 최선일지 확신할 수 없지만, 같은 문제에 부딪혀 가까스로 해결했습니다.자, 여기 제 2센트입니다.

브라우저 캐시 때문에 원시 Ajax 응답이 발생하는 것으로 보입니다.응답이 캐시되기 시작하지 않도록 다음 헤더를 추가하여 문제를 해결했습니다.

response.headers["Cache-Control"] = "no-cache, no-store, max-age=0, must-revalidate"
response.headers["Pragma"] = "no-cache"
response.headers["Expires"] = "Fri, 01 Jan 1990 00:00:00 GMT"

준이가 위에서 말한 것은 확실히 효과가 있었습니다.헤더를 추가하기 전에 요청이 아약스에서 온 것인지 확인하기 위해 추가 검사를 추가했습니다.고마워 준!

if request.xhr?
    response.headers["Cache-Control"] = "no-cache, no-store, max-age=0, must-revalidate"
    response.headers["Pragma"] = "no-cache"
    response.headers["Expires"] = "Fri, 01 Jan 1990 00:00:00 GMT"
end

언급URL : https://stackoverflow.com/questions/7734427/rails-3-1-is-returning-raw-javascript-code-when-back-button-is-used