是的，没用的。因为有一个错字，HTML中没有名为Image的标记。
要显示图像，必须使用img标记。

import React from 'react';
import './App.css';

class App extends React.Component {

  state = { url: 'https://graph.facebook.com/10157648190117379/picture'}

  render() {
    return <img alt='Profile' src={this.state.url} />;
  }
}
export default App;

URL中没有问题。只要确保使用正确的标签。

我试过了

import React from "react";
const TestCompOne = (props) => {
  console.log("[TEST COMP 1]");
  return (
    <div>
     <img src={"https://graph.facebook.com/10157648190117379/picture"} />
    </div>
  );
};

export default TestCompOne;

2023年解决方案使用firebase“Web Modular API”时

配置文件url可以通过以下方法获得

getAdditionalUserInfo(result);

以下是完整的实现：

import { initializeApp } from 'firebase/app';
import {
  getAuth,
  FacebookAuthProvider,
  signInWithPopup,
  getAdditionalUserInfo,
} from 'firebase/auth';

const firebaseConfig = {
  apiKey: 'xxx',
  authDomain: 'xxx',
  projectId: 'xxx',
  storageBucket: 'xxx',
  messagingSenderId: 'xxx',
  appId: 'xxx',
  measurementId: 'xxx',
};

initializeApp(firebaseConfig);
const auth = getAuth();
const provider = new FacebookAuthProvider();

let result = await signInWithPopup(auth, provider);

let additional = getAdditionalUserInfo(result);
console.log('picture_url: ', additional.profile.data.picture.url);

// if token is needet
const credential = FacebookAuthProvider.credentialFromResult(result);
console.log('credential: ', credential);

参考：https://firebase.google.com/docs/auth/web/facebook-login?hl=de#web-modular-api_4