How to include the Access-Control-Allow-Origin header?

Question

I am in a small project with php and I receive a video in which the origin is an IP camera and I need to take a picture of a frame of the video and convert it to Base64 to save in the database, I can’t use the tag video to receive the video from the IP camera ,because the browser complains about the absence of the Access-Control-Allow-Origin header , how to write this header in html? I’ve tried and nothing...

Answer 1

for some time I had this same problem , put the header Access-Control-Allow-Origin has to be added to the server-side.

Add to your server:

 header('Access-Control-Allow-Origin: http://site1.com');
 header('Access-Control-Allow-Origin: http://exemplo.com');
 header('Access-Control-Allow-Origin: https://www.site2.com');
 header('Access-Control-Allow-Origin: http://www.site3.com');

Or if you want to enable all use:

header('Access-Control-Allow-Origin: *');

Answer 2

In this case there is no way.

The header should not go on your page, but on what is trying to be accessed remotely, in case it would have to be added on the IP camera, which is probably impossible.

In these cases usually what is done to get around the problem is to request the server side, usually creates type a "proxy", where your page uses javascript to request to your own site, and then you make the request for PHP for example to external resource, in case the camera, but as in this case it is a video I do not know how it would behave.

Answer 3

Joseph,

I do not know if it is your knowledge, but this something on the server side, which in your case is PHP. That is, it is not in HTML that you will fix, but in PHP. This is a matter related to CORS or Cross-origin Resource sharing. Read the link I left.

Giving my explanation to help you understand, a web application can freely upload images, stylesheets, scripts, iframes, videos and plugins like Adobe Flash from any domain. However, web fonts and Ajax requests are only limited to within the domain itself, and in your case, probably from an X domain you are making an Ajax request to the Y domain or loading the source of a Z domain.

This happened once with me when of a web application, which was in a domain(http://localhost:8080/myapplication/), i performed an Ajax request on a web service, which was in different domain(http://localhost:8080/meuwebservice/).

I decided to add only in the header of my web service the permission for this type of request. In my case it was Java, but since you are making use of PHP, the solution will be to add the following line of code:

header('Access-Control-Allow-Origin: *'); 

In the code above, we are releasing for requests from any and all domains, because, as is common in our world, * indicates something like ALL. If you want to specify which specific domains to request, simply replace the * by the address thus:

 header('Access-Control-Allow-Origin: http://meusite.com', false);
 header('Access-Control-Allow-Origin: http://outrosite.com', false);
 header('Access-Control-Allow-Origin: https://www.maisum.com', false);

I hope I helped something, anything leave a comment!