title: ReactJS No 'Access-Control-Allow-Origin'
body: <p>I am having a problem in loading my fonts from a link from my website. ON what I have seen there is an error in my server.js that CORS is not present in my header. Now, My problem is How will I insert the header into my server.js Can someone help me?</p>
  
  <p>Here is the error </p>
  
  <blockquote>
    <p>Font from origin 'my website link' has been blocked from loading by Cross-Origin Resource Sharing policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin '<a href="http://localhost:3001" rel="nofollow">http://localhost:3001</a>' is therefore not allowed access</p>
  </blockquote>
  
  <pre><code>const app = express();
  
  //
  // Tell any CSS tooling (such as Material UI) to use all vendor prefixes if the
  // user agent is not known.
  // -----------------------------------------------------------------------------
  global.navigator = global.navigator || {};
  global.navigator.userAgent = global.navigator.userAgent || 'all';
  
  //
  // Register Node.js middleware
  // -----------------------------------------------------------------------------
  app.use(express.static(path.join(__dirname, 'public')));
  app.use(cookieParser());
  app.use(bodyParser.urlencoded({ extended: true }));
  app.use(bodyParser.json());
  
  //
  // Authentication
  // -----------------------------------------------------------------------------
  app.use(expressJwt({
    secret: auth.jwt.secret,
    credentialsRequired: false,
    getToken: req =&gt; req.cookies.id_token,
  }));
  app.use(passport.initialize());
  
  app.get('/login/facebook',
    passport.authenticate('facebook', { scope: ['email', 'user_location'], session: false })
  );
  app.get('/login/facebook/return',
    passport.authenticate('facebook', { failureRedirect: '/login', session: false }),
    (req, res) =&gt; {
      const expiresIn = 60 * 60 * 24 * 180; // 180 days
      const token = jwt.sign(req.user, auth.jwt.secret, { expiresIn });
      res.cookie('id_token', token, { maxAge: 1000 * expiresIn, httpOnly: true });
      res.redirect('/');
    }
  );
  
  //
  // Register API middleware
  // -----------------------------------------------------------------------------
  app.use('/graphql', expressGraphQL(req =&gt; ({
    schema,
    graphiql: true,
    rootValue: { request: req },
    pretty: process.env.NODE_ENV !== 'production',
  })));
  
  //
  // Register server-side rendering middleware
  // -----------------------------------------------------------------------------
  app.get('*', async (req, res, next) =&gt; {
    try {
      let css = [];
      let statusCode = 200;
      const data = { title: '', description: '', style: '', script: assets.main.js, children: '' };
  
      await UniversalRouter.resolve(routes, {
        path: req.path,
        query: req.query,
        context: {
          insertCss: (...styles) =&gt; {
            styles.forEach(style =&gt; css.push(style._getCss())); // eslint-disable-line no-underscore-dangle, max-len
          },
          setTitle: value =&gt; (data.title = value),
          setMeta: (key, value) =&gt; (data[key] = value),
        },
        render(component, status = 200) {
          css = [];
          statusCode = status;
          data.children = ReactDOM.renderToString(component);
          data.style = css.join('');
          return true;
        },
      });
  
      const html = ReactDOM.renderToStaticMarkup(&lt;Html {...data} /&gt;);
  
      res.status(statusCode);
      res.send(`&lt;!doctype html&gt;${html}`);
    } catch (err) {
      next(err);
    }
  });
  
  //
  // Error handling
  // -----------------------------------------------------------------------------
  const pe = new PrettyError();
  pe.skipNodeFiles();
  pe.skipPackage('express');
  
  app.use((err, req, res, next) =&gt; { // eslint-disable-line no-unused-vars
    console.log(pe.render(err)); // eslint-disable-line no-console
    const statusCode = err.status || 500;
    const html = ReactDOM.renderToStaticMarkup(
      &lt;Html
        title="Internal Server Error"
        description={err.message}
        style={errorPageStyle._getCss()}
        userAgent={req.headers['user-agent']}&gt; // eslint-disable-line no-underscore-dangle
        {ReactDOM.renderToString(&lt;ErrorPage error={err} /&gt;)}
      &lt;/Html&gt;
    );
    res.status(statusCode);
    res.send(`&lt;!doctype html&gt;${html}`);
  });
  
  //
  // Launch the server
  // -----------------------------------------------------------------------------
  /* eslint-disable no-console */
  models.sync().catch(err =&gt; console.error(err.stack)).then(() =&gt; {
    app.listen(port, () =&gt; {
      console.log(`The server is running at http://localhost:${port}/`);
    });
  });
  /* eslint-enable no-console */
  </code></pre>