NewsAPIをFirebase上で取得しようとした際「status code 426」が出る

Question

前提

Firebase
APIサービス…NewsAPI
React

要件

APIサービスであるNewsAPIで日本のニュースを取得するアプリを作成し、
ローカル上では無事取得し、表示できたのですが、
いざFirebaseにデプロイし挙動確認したところ以下コンソールエラーが出ます。
これは何が原因でFirebaseではエラーになるのでしょうか？

Failed to load resource: the server responded with a status of 426 ()

Error: Request failed with status code 426
    at t.exports (2.ca60fa3e.chunk.js:2)
    at t.exports (2.ca60fa3e.chunk.js:2)
    at XMLHttpRequest.p.onreadystatechange (2.ca60fa3e.chunk.js:2)

コード全文
NewsAPIを取得して表示させるReactコンポーネント

import React, { useState, useEffect } from 'react';
import axios from 'axios';

// NEWS API(https://newsapi.org/) 
const keyId = 'Your_Key'; // APIキーなので伏せてあります
const URL = `https://newsapi.org/v2/top-headlines?country=jp&apiKey=${keyId}`;

const News = () => {
    const [articles, setArticles] = useState([]);
    
    useEffect(() => {
        fetchArticles();
    }, []);

    const fetchArticles = async () => {
        try {
            const res = await axios.get(URL);
            setArticles(res.data.articles); // NEWS API
        } catch (error) {
            console.error(error);
        }
    }
    
    return(
        <>
            <h3>日本のニュース</h3>
            {articles.slice(0, 10).map((item) => (
                <div key={item.url}>
                    <p className="title">
                        <a href={item.url} rel="noopener noreferrer" target="_blank">{item.title.substr(0,30)}...</a>
                    </p>
                </div>
            ))}
            <style jsx>{`
                h3 {
                    font-size: 12px;
                    font-weight: 100;
                    color: #BCBCBC;
                    padding: 15px;
                }
                .title {
                    font-size: 12px;
                    line-height: 1.25em;
                    padding: 15px;
                    border-top: 1px solid #fff;
                }
                .title a {
                    display: block;
                    font-size: 12px;
                    text-decoration: none;
                }
            `}</style>
        </>
    );
}

export default News;

Comments

[hoshi-takanori]

NewsAPI は CORS 対応してないようなので、proxy server を立てる必要があると思います。
ブラウザ上の JS だと API キーもダダ漏れですし。