jquery ajax crossdomain always refused to execute script

[gongpex]

Hello everyone,

I've tried number of time to get json data using jsonp from another domain, here is my full code :

<script type="application/javascript" src="https://i.instagram.com/api/v1/tags/search?q=burger&callback=mycallback"></script>
<script type="text/javascript">
	$(document).ready(function() {    
		test();
	});

	function test()
	{
		$("#test").click(function(){
			$.ajax({
				crossDomain: true,
				type: "GET",
			    url: "https://i.instagram.com/api/v1/tags/search?callback=mycallback",
			    dataType: "jsonp", // jsonp
			    jsonp : 'callback',
			    jsonpCallback: 'mycallback',
			    data: {'q':'burger'},
			    success: function (result, status, xhr) {
			        console.log(result);
			    },
			})
		});
	}

	//callback function
	function mycallback(data) {
	  //do stuff with JSON
	  console.log(data);
	}
  
</script>

It always return : Refused to execute script from 'https://i.instagram.com/api/v1/tags/search/?callback=mycallback&q=burger&_=1571650640228' because its MIME type ('application/json') is not executable, and strict MIME type checking is enabled. 

I know if MIME or header from i.instagram had set json, so I used callback and even set script application/javascript so that I can retrieve json data, but the result is always like on above.

Please somebody help me.

Thanks

 

[dsonesuk]

All event handlers are placed in document ready, you don't  need to wrap it in another function, the click event is what runs the ajax.