heroku Mixed Content: The page at 'https://appname.herokuapp.com/' was loaded over HTTPS, but requested an insecure XMLHttpRequest endpoint 'http://appname.herokuapp.com/api/photos?page=1'. This request has been blocked

herokuにdeployしてアプリを開いてみるとconsoleにて以下のエラーが発生し、画面が正しく表示されない

Mixed Content: The page at 'https://appname.herokuapp.com/' was loaded over HTTPS, but requested an insecure XMLHttpRequest endpoint 'http://appname.herokuapp.com/api/photos/?page=1'. This request has been blocked

以下のURLがおかしいみたい

http://appname.herokuapp.com/api/photos/?page=1

クエリ前の「/」を省く

http://appname.herokuapp.com/api/photos?page=1

herokuに再度deployしてみるとエラー解消!!!