Enabling Cross Origin Resource Sharing (CORS)

QUESTION:

I am getting connectivity errors when I try to stream with WebRTC from my website to my Red5 Pro instance.  When I try running it in Chrome, it throws an error similar to this:  

XMLHttpRequest cannot load http://domain2.example. 
Origin http://domain1.example is not allowed by Access-Control-Allow-Origin

ANSWER:

You need to add the CORS authorization header into your project.

In the {red5pro}/webapps/live/WEB-INF/web.xml, add the following (including the domain URL you are trying to access red5pro from):

<filter>
      <filter-name>CorsFilter</filter-name>
      <filter-class>org.apache.catalina.filters.CorsFilter</filter-class>
      <init-param>
         <param-name>cors.allowed.origins</param-name>
         <param-value>http://localhost:5080, http://192.168.1.46:5080, https://mywebsite.com</param-value>
      </init-param>
      <init-param>
         <param-name>cors.exposed.headers</param-name>
         <param-value>Access-Control-Allow-Origin</param-value>
      </init-param>
      <init-param>
       <param-name>cors.allowed.methods</param-name>
       <param-value>GET, POST, PUT, DELETE</param-value>
      </init-param>
  </filter>
  <filter-mapping>
      <filter-name>CorsFilter</filter-name>
      <url-pattern>/*</url-pattern>
  </filter-mapping>

 

Please note: In all the following examples, the <domain name> should be the domain name that is assigned to your SSL certificate.

PHP

 <?php
 header("Access-Control-Allow-Origin: <domain name>");


Ruby on Rails:

use Rack::Cors do
  allow do
    origins '<domain-name>'
    resource '<domain-name>', headers: :any, methods: :any
  end  
end


ExpressJS on NodeJS

app.use(function(req, res, next) {
  res.header("Access-Control-Allow-Origin", "<domain name>");
  res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
  next();
});

app.get('/', function(req, res, next) {
  // Handle the get for this route
});

app.post('/', function(req, res, next) {
 // Handle the post for this route
});
 
ASP.NET:
Response.AppendHeader("Access-Control-Allow-Origin", "<domain name>");
 

For more information please see http://enable-cors.org/

Have more questions? Submit a request

0 Comments

Please sign in to leave a comment.