【问题标题】:ionic ios issue white page when doing REST Calls进行 REST 调用时,离子 ios 发出白页
【发布时间】:2021-08-24 02:08:15
【问题描述】:

我有一个离子反应应用程序,它从一个休息 API 中获取数据。当我将 ab 与 ionic 服务器或 Android 捆绑在一起时,该应用程序运行良好。 当我在 iOS 上运行相同的代码时,我得到了一个空白页。之前的一些版本也可以在 iOS 上运行。当我将代码重新设置为 5 天前的版本时,它现在根本不起作用。

代码如下所示:

export default function PostsContainer() {
    let {categoryid} = useParams<any>();
    const [posts, setPosts] = useState<any[]>([]);
    const [page, setPage] = useState<number>(1);
    const [totPages, setTotPages] = useState<number>(1);
    const [title, setTitle] = useState<string>("Recent posts");
    const baseUrl = BASE_URL + "wp-json/wp/v2";
    const [loadingPosts, setLoadingPosts] = useState<boolean>(false);

    useEffect(() => {
        async function loadPosts() {
            setLoadingPosts(false)
            let url = baseUrl + "/posts?status=publish&page=" + page;
            if (categoryid !== undefined) {
                url = url + "&categories=" + categoryid;
                getCategoryName(categoryid);
            }
            const response = await fetch(url);
            if (!response.ok) {
                return;
            }
            const totalPages = await response.headers.get("x-wp-totalpages");
            const postsTemp = await response.json();
            setPosts(postsTemp);
            setTotPages(Number(totalPages));
            setLoadingPosts(true);
            console.log(posts)
        }

        loadPosts();
    }, [page, categoryid]);
    
    function handleClickNextPage() {
        setPage(page + 1);
    }

    async function getCategoryName(id: number) {
        let url = baseUrl + "/categories/" + id;

        const response = await fetch(url);
        if (!response.ok) {
            return;
        }
        const category = await response.json();
        setTitle(category.name);
    }

    if (loadingPosts) {
        return (
            <IonPage>
                <IonHeader translucent={true}>
                </IonHeader>
                <IonContent>
                    {page === 1 ? <Slider listOfPosts={posts}/> : <div/>}
                    <Posts
                        listOfPosts={posts}
                        totPages={totPages}
                        handleClickNextPage={handleClickNextPage}
                        pageNumber={page}
                    />
                </IonContent>
            </IonPage>
        );

    } else {
        return <IonLoading
            isOpen={!loadingPosts}
            message={ION_LOADING_DIALOG}
            duration={ION_LOADING_DURATION}
        />
    }
}

是否有属于其余 api 的任何设置?调用的是带有 https 的 URL。当我删除 useefect 并仅呈现没有内容的静态页面时,它可以正常工作。

【问题讨论】:

    标签: ios reactjs rest ionic-framework


    【解决方案1】:

    最后它是 Endpoint 上的 CORS 错误。我必须在端点上允许cordova://localhost

    【讨论】:

      猜你喜欢
      • 2016-06-07
      • 1970-01-01
      • 1970-01-01
      • 2015-11-26
      • 1970-01-01
      • 1970-01-01
      • 2014-07-04
      • 2016-01-01
      • 2017-06-17
      相关资源
      最近更新 更多