1

タイトルだと分かりづらいという方が多いと思いますので説明します。

const [article, setArticle] = useState([]);
const params = useParams().id;
useEffect(() => {
    axios.get(`/api/article/${params}`).then((response) => {
        setArticle(response.data.article);
    });
}, [params]);

http://localhost/abc にアクセスしたとすると、paramsにはabcが入り、paramsをもとにgetでabcと紐付いた記事のデータを取得しています。

実際に正常に動作はしていますが、この場合abcというidは http://localhost/abc にアクセスした時点でサーバー側で取得できるにも関わらず、上記のように実装するのは冗長でしょうか。

パラメータのidなどをもとに記事を表示しるような形態のwebサイトでは一般的にどのような手法が用いられているのか教えていただきたいです。

またセキュリティーやパフォーマンスの面でご指摘いただけると幸いです。

/api/article/${params}へのアクセスはnginxのプロキシでnodejs/expressのバックエンドサーバーに転送しています。

1 件の回答 1

1

SSRなのかCSRなのかというところで、SSRでやっているのなら冗長だとは思いますが
例えばarticle部分が大容量など、画面大枠部分(レイアウト部分)のみSSRし、
遅延表示で良い部分(article)を記載されているように後で取得しにいくことで遷移時のロードを短い様に見せているとかであれば、このような形式もありだと思います。

0

この質問に回答するには、ログインする必要があります。

求めていた回答ではありませんか? のタグが付いた他の質問を参照する。