w3schools - javascript code



হ্যান্ডেল প্রতিক্রিয়া-সিনট্যাক্স এরির: মোড ব্যবহার করার সময় ইনপুটটির অপ্রত্যাশিত শেষ: 'নো-কর্স' (4)

আপনার mode: 'no-cors' মুছে ফেলতে mode: 'no-cors' আপনার অনুরোধ থেকে mode: 'no-cors' সেটিংস। এই mode: 'no-cors' হ'ল আপনার সমস্যার কারণ হ'ল।

একটি mode: 'no-cors' অনুরোধ প্রতিক্রিয়ার opaque তোলে। প্রশ্নের কনসোল-লগ স্নিপেট পরিষ্কারভাবে এটি দেখায়। এবং opaque অর্থ আপনার ফ্রন্টএন্ড জাভাস্ক্রিপ্ট কোড প্রতিক্রিয়া বডি বা শিরোনাম দেখতে পাবে না।

https://developer.mozilla.org/en-US/docs/Web/API/Request/mode ব্যাখ্যা করে:

no-cors - জাভাস্ক্রিপ্ট ফলাফল Response কোনও বৈশিষ্ট্যে অ্যাক্সেস করতে পারে না

সুতরাং সেটিং mode: 'no-cors' প্রভাব mode: 'no-cors' মূলত ব্রাউজারগুলিকে বলতে হয়, "কোনও অবস্থাতেই ফ্রন্ট্যান্ড্যান্ড জাভাস্ক্রিপ্ট কোডটি প্রতিক্রিয়া বডি বা হেডারগুলিতে অ্যাক্সেস করতে দেবেন না।"

আমি ভাবছি আপনি mode: 'no-cors' সেট করছেন mode: 'no-cors' অনুরোধটির জন্য mode: 'no-cors' কারণ http://localhost:8080/course প্রতিক্রিয়ায় Access-Control-Allow-Origin প্রতিক্রিয়া শিরোনামকে অন্তর্ভুক্ত করা হয়নি বা কারণ আপনার ব্রাউজারটির কোনও OPTIONS http://localhost:8080 অনুরোধ কারণ আপনার অনুরোধটি এমন একটি যা একটি সিওআরএস প্রিফলাইটকে ট্রিগার করে।

তবে সেটিং mode: 'no-cors' এই সমস্যাগুলির সমাধান নয়। সমাধানটি হয়:

আমি একটি REST-API এ একটি ReactJS আনার কল চেষ্টা করেছি এবং প্রতিক্রিয়াটি পরিচালনা করতে চাই। কলটি কাজ করে, আমি একটি প্রতিক্রিয়া পাই যা আমি ক্রোম দেব সরঞ্জামগুলিতে দেখতে পারি:

function getAllCourses() {
fetch('http://localhost:8080/course', {
    method: 'POST',
    mode: 'no-cors',
    credentials: 'same-origin',
    headers: {
        'Accept': 'application/json',
        'Content-Type': 'application/json',
    },
    body: JSON.stringify({
        objectClass: 'course',
        crud: '2'
    })
}).then(function (response) {
    console.log(response);
    return response.json();

}).catch(function (err) {
    console.log(err)
});
}

আমি যখন প্রতিক্রিয়াটি হ্যান্ডেল করার চেষ্টা করি তখন আমি একটি "সিনট্যাক্স এরর: ইনপুটটির অপ্রত্যাশিত শেষ" পেয়েছি

return response.json();

কনসোল.লগ এর মতো দেখাচ্ছে:

আমার প্রতিক্রিয়া জেএসএন দেখতে দেখতে এটি বৈধ, আমি এটি জসনলিন্ট দিয়ে পরীক্ষা করেছি:

[
  {
    "0x1": {
      "users": [],
      "lectures": [],
      "owner": "0x2",
      "title": "WWI 14 SEA",
      "description": null,
      "objectClass": "course",
      "id": "course_00001"
    },
    "0x2": {
      "username": "system",
      "lectures": [],
      "course": null,
      "solutions": [],
      "exercises": [],
      "roles": [
        "0x3",
        "0x4",
        "0x5"
      ],
      "objectClass": "user",
      "id": "user_00001"
    },
    "0x3": {
      "roleName": "ROLE_ADMIN",
      "objectClass": "role",
      "id": "role_00001"
    },
    "0x4": {
      "roleName": "ROLE_STUDENT",
      "objectClass": "role",
      "id": "role_00002"
    },
    "0x5": {
      "roleName": "ROLE_DOCENT",
      "objectClass": "role",
      "id": "role_00003"
    }
  }
]

Answer #1

আপনার then আপনার জবাবটি ফেরার আগে response.json ঠিক আছে কিনা তা পরীক্ষা করা উচিত j

.then(function (response) {
    if (!response.ok) {
        return Promise.reject('some reason');
    }

    return response.json();

})

আপনি যদি আপনার প্রত্যাখ্যাত প্রতিশ্রুতিতে ত্রুটি বার্তা পেতে চান তবে আপনি এর মতো কিছু করতে পারেন:

.then(function (response) {
    if (!response.ok) {
       return response.text().then(result => Promise.reject(new Error(result)));
    }

    return response.json();
})

Answer #2

আমি জানি এই উত্তরটি খুব দেরিতে হতে পারে এবং সমাধান হতে পারে তবে আমার আজ একই সমস্যা ছিল এবং হেডার হ্যাশ শেষে আমার একটি ',' যুক্ত করা দরকার এবং আমি ত্রুটি পাওয়া বন্ধ করে দিয়েছি

export function addContacts(formData) {
  return(dispatch) => {
    dispatch({type: 'POSTING_CONTACTS'});
    console.log(formData)
    return fetch(uri, {
      method: 'POST',
      body: JSON.stringify({contact: {name: formData.name, phone_number: formData.phoneNumber}}),
      headers: {
        Accept: 'application/json',
        'Content-Type': 'application/json'
      },
    })
    .then(response => {
        return response.json()
      }).then(responseJSON => {
        console.log(responseJSON)
        return dispatch({type: 'ADD_CONTACT', payload: responseJSON});
      })
  }
}     

Answer #3

কেবলমাত্র নীচের কোডটি অনুলিপি করুন এবং এটি <system.webServer> ট্যাগের অধীনে আপনার <system.webServer> ফাইলে পেস্ট করুন।

<httpProtocol>  
    <customHeaders>  
     <add name="Access-Control-Allow-Origin" value="*" />  
     <add name="Access-Control-Allow-Headers" value="Content-Type" />  
     <add name="Access-Control-Allow-Methods" value="GET, POST, PUT, DELETE, OPTIONS" />  
    </customHeaders>  
  </httpProtocol>  




fetch-api