title: api request has been blocked by CORS policy
body: <p>In my <code>next.js</code> project I'm trying to send a POST request using <code>axios</code>:</p>
  <pre><code>axios.defaults.baseURL = &quot;https://{my-server-url}/api&quot;;
  
  useEffect(() =&gt; {
          axios({
              method: &quot;POST&quot;,
              url: &quot;/build_pages&quot;,
              data: {
                  page_id: 3,
              },
          }).then((res) =&gt; {
              console.log(res.data);
          });
      }, []);
  </code></pre>
  <p>I'm getting the following CORS error:
  <a href="https://i.stack.imgur.com/ldYbP.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/ldYbP.png" alt="enter image description here" /></a></p>
  <p>My server is [laravel] <code>php</code> and is deployed on <code>cpanel</code>, but before I deployed my backend to cpanel (i.e. when I was working on localhost) I did not get this error.</p>
  <p>How do I turn off this error (note that I don't want to download any web browser extension to fix the CORS error)</p>
  <p>I came across <a href="https://enable-cors.org/server_php.html" rel="nofollow noreferrer">this link</a> but it does not say where (which file) to add it to so I'm stuck</p>
  <p>Edit: I tried the middleware solution provided in this answer: <a href="https://stackoverflow.com/a/69151121/12009071">https://stackoverflow.com/a/69151121/12009071</a> but also it didn't work, howerver the error changed to:</p>
  <pre><code>Access to XMLHttpRequest at 'https://{my-server-url}/api/check_admin_login' from origin 'https://{my-server-url}.vercel.app' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: It does not have HTTP ok status.
  </code></pre>