jQuery를 사용하지 않고 rails-ujs Rails.ajax POST 호출로 JSON 데이터를 어떻게 전송합니까?

jQuery를 사용하지 않고 rails-ujs Rails.ajax POST 호출로 JSON 데이터를 어떻게 전송합니까?

Rails API와 대화해야 하는 React 클라이언트 앱이 있습니다.rails-ujs 메서드 Rails.ajax를 사용하고 싶습니다.예:

Rails.ajax({
  type: "POST", 
  url: "/things",
  data: mydata,
  success: function(response) {...},
  error: function(response) {...}
})

설정할 수 없을 것 같습니다.data다음과 같은 JSON 개체로 이동합니다.

mydata = {
 thing: {
  field1: value1,
  field2: value2,
}}

저는 그것을 a로 변환해야 합니다.application/x-www-form-urlencoded다음과 같이 수동으로 컨텐츠 유형:

mydata = 'thing[field1]=value1&thing[field2]=value2'

이는 플랫 데이터에는 적합하지만 내포된 데이터에는 빠르게 복잡해집니다.

jQuery는 요청하기 전에 변환을 자동으로 수행합니다.

그래서 저는 Rails UJS가 그것을 자동적으로 할 수 있는 방법이 있는지 궁금합니다. 하지만 저는 문서나 코드에서 아무것도 찾을 수 없었습니다.

Rails UJS를 사용할 때는 데이터를 문자열 형식 파라미터로 포맷해야 합니다.유감스럽게도 JSON을 제공할 수 없습니다. 적어도 현재는 레일 6.0.2(이상적이지 않음)가 없습니다.

해결책

JSON을 URL 매개 변수로 변환하는 데 사용합니다.

myData = {
 thing: {
  field1: value1,
  field2: value2,
}}

Rails.ajax({
  type: "POST",
  url: "/things",
  data: new URLSearchParams(myData).toString()
})

다음은 Content-Type: application/json을 사용하여 게시/게시하는 해결 방법입니다.

Send callback 전에 options.data를 설정하여 작동합니다.이 방법으로 내부 Rails.ajax.createXHR 메서드는 내용 유형 헤더를 먼저 설정하지 않습니다.https://github.com/rails/rails/blob/master/actionview/app/assets/javascripts/rails-ujs/utils/ajax.coffee#L53

    Rails.ajax({
      url: 'http://some-url.com',
      type: 'put',
      beforeSend(xhr, options) {
        xhr.setRequestHeader('Content-Type', 'application/json; charset=UTF-8')
        // Workaround: add options.data late to avoid Content-Type header to already being set in stone
        // https://github.com/rails/rails/blob/master/actionview/app/assets/javascripts/rails-ujs/utils/ajax.coffee#L53
        options.data = JSON.stringify(data)
        return true
      },
    });

나는 아약스 콜을 여러 번 사용했고 json 데이터를 이렇게 보내곤 했습니다.

var fd = new FormData();
fd.append("jsondata", JSON.stringify(mydata));

$.ajax({
  url: ...
  type :"post",
  data: fd
  success:function(){
  }
})

루비 컨트롤러에서 Json 데이터를 구문 분석하는 것은 쉽습니다.그냥 사용할 수 있습니다.JSON.parse(params["jsondata"])
이것이 당신의 경우에 효과가 있기를 바랍니다.

라이브러리 코드를 검토했는데 지원하지 않습니다. 왜냐하면 객체를 보내기 위해서는 객체를 문자열화해야 하기 때문입니다. 그리고 그 후 라이브러리가 데이터가 문자열 유형인지 확인하는 것을 발견했습니다. 요청의 내용 유형을 application/x-www-form-urlenced로 변경합니다.이 링크는 라이브러리에서 해당 조건을 보여줍니다.그리고 이 문제를 해결하기 위한 옵션은 객체를 입력 양식으로 변환하는 방법을 작성하거나 JQuery Ajax 또는 다른 라이브러리를 사용하는 것입니다.

제가 이 문제를 오해하고 있는지는 모르겠지만 JSON.stringify를 사용하여 객체를 변환할 수는 없습니까?

https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/JSON/stringify

확실히 레일즈 모듈에서 JSON.parse를 사용하여 JSON 응답을 구문 분석하는 것을 볼 수 있습니다.

언급된 문제에 대한 실제적인 해결책은 없고 해결책만 발견했습니다.

다음은 필수 직렬화를 처리할 gist(JS 클래스)에 대한 링크입니다.

https://gist.github.com/dansimpson/231546

당신은 당신의 에이잭스 통화에서 내용 유형을 설정하고 json 형식으로 데이터를 보낼 수 있습니다.

var data={
      user:{
        first_name: firstname,
        last_name: lastname,
        username: username
      }}

http 헤더 요청에 json으로 내용 유형을 배치하여 Ajax 호출 전송

$.ajax({
   type: "POST",
   url: "http://someurl/post",
   data:data,
   contentType: "application/json",
   success: function(data) {
       -------
  }
});​

언급URL : https://stackoverflow.com/questions/45820587/how-do-you-send-json-data-in-a-rails-ujs-rails-ajax-post-call-not-using-jquery