Cross-Origin Request Blocked:

I want to upload an image-only Javascript and HTML with TinyMCE. How do I do it?

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>TinyMCE Example with Image Upload</title>
  <script src="https://cdn.tiny.cloud/1/no-api-key/tinymce/5/tinymce.min.js"></script>
  <script>
    tinymce.init({
      selector: '#mytextarea',
      plugins: 'advlist autolink lists link image charmap print preview hr anchor pagebreak table emoticons',
      toolbar: 'undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image | charmap emoticons | preview',
      images_upload_url: 'upload.php',
      images_upload_handler: function (blobInfo, success, failure) {
        var xhr, formData;
        xhr = new XMLHttpRequest();
        xhr.withCredentials = false;
        xhr.open('POST', 'upload.php');
        xhr.onload = function() {
          var json;
          if (xhr.status != 200) {
            failure('HTTP Error: ' + xhr.status);
            return;
          }
          json = JSON.parse(xhr.responseText);
          if (!json || typeof json.location != 'string') {
            failure('Invalid JSON: ' + xhr.responseText);
            return;
          }
          success(json.location);
        };
        // Create a new FormData object with the selected file
        formData = new FormData();
        formData.append('file', blobInfo.blob(), blobInfo.filename());
        xhr.send(formData);
      }
    });
  </script>
</head>
<body>
  <textarea id="mytextarea"></textarea>
</body>
</html>

I get this error

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at file:///C:/Users/Oxbir/Desktop/upload.php. (Reason: CORS request not http).

Please or to participate in this conversation.