I need some guidence please,
I'm currently working on a news blog using Next.js and a headless WordPress CMS. To handle video content, I've integrated ACF field groups for embedding or uploading videos. During testing in my local environment, I encountered issues embedding YouTube videos due to a Cross-Origin Communication problem. The YouTube iframe API was attempting to communicate across different origins, leading to browser security restrictions.
To address this, I followed a suggestion to switch my local host to HTTPS. I updated URLs and the GraphQL endpoint in my WordPress admin accordingly. While this resolved the Cross-Origin Communication issue, I'm now facing a new challenge:
Despite successfully fetching data from the headless WordPress CMS, the images associated with the posts are not loading as expected over HTTPS. I'm encountering the following errors:
Failed to load resource: the server responded with a status of 500 (Internal Server Error) - image:1 Failed to load resource: the server responded with a status of 500 (Internal Server Error)
It seems that images are not being fetched correctly in the HTTPS environment. How can I troubleshoot and resolve this issue? Are there additional configurations or adjustments needed to ensure that images are loaded seamlessly over HTTPS in a Next.js application connected to a headless WordPress CMS?
I appreciate any guidance, thanks