Failed to fetch from React frontend (non react-native)

How to / Third Party Tooling
1

Im trying to send push notifications directly from a React frontend (non react-native). Curl and the expo push notification tool works fine. Only when I send if from my React frontend from ‘localhost:3000’, I am getting this error:

Access to fetch at 'https://exp.host/--/api/v2/push/send' from origin 'http://localhost:3000' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present 
Failed to fetch

My React Code


  handleSearch(event) {
    const message = {
        to: "ExponentPushToken[T01234ZuCoOtu2NK9]",
        sound: 'default',
        title: 'Original Title',
        body: 'And here is the body!',
        data: { data: 'goes here' },
        _displayInForeground: true,
      };
      fetch('https://exp.host/--/api/v2/push/send', {
        method: 'POST',
        headers: {
          Accept: 'application/json',
          'Accept-encoding': 'gzip, deflate',
          'Content-Type': 'application/json',
          'Access-Control-Allow-Origin':'*'
        },
        body: JSON.stringify(message),

  render() {
    return (
        <div>
          <input placeholder="Send a notification" onChange={this.handleTermChange} />
        </div>
        <div>
          <a onClick={this.handleSearch}>Send Push Notification</a>
        </div>
  )
}
1 Like