问题症结:
Chrome
浏览器登录并显示ChatGPT正常并允许交互式输入和输出。WebView
OTOH 可以很好地登录到 ChatGPT 但是一旦登录,就会显示一个空白页面。WebView
显示正常(如Chrome
)所有我测试过的其他网站。由于 current
Chrome
和 WebView
都基于 AppleWebKit/537.36
,我很困惑这可能是什么原因。 对于如何进一步解决此问题的任何想法或提示,我将不胜感激。
我验证了我的 WebView 设置:
WebView webView = findViewById(R.id.webView);
webView.setWebViewClient(new WebViewClient());
WebSettings webSettings = webView.getSettings();
webSettings.setJavaScriptEnabled(true);
webSettings.setDomStorageEnabled(true);
webSettings.setLoadWithOverviewMode(true);
webSettings.setUseWideViewPort(true);
webSettings.setBuiltInZoomControls(true);
webSettings.setDisplayZoomControls(false);
webView.setWebChromeClient(new WebChromeClient());
但没有帮助。
然后我从
ChatGPT捕获了 HTML 的
<body>
部分,但找不到对这种奇怪行为的解释:
<body>
<div id="__next">
<div style="position: fixed; top: 1px; left: 1px; width: 1px; height: 0px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0px, 0px, 0px, 0px); white-space: nowrap; border-width: 0px; display: none;"/>
<div/>
<div class="overflow-hidden w-full h-full relative">
<div class="flex h-full flex-1 flex-col md:pl-[260px]">
<div class="sticky top-0 z-10 flex items-center border-b border-white/20 bg-gray-800 pl-1 pt-1 text-gray-200 sm:pl-3 md:hidden">
<button type="button" class="-ml-0.5 -mt-0.5 inline-flex h-10 w-10 items-center justify-center rounded-md hover:text-gray-900 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-white dark:hover:text-white">
<span class="sr-only">Open sidebar</span>
<svg stroke="currentColor" fill="none" stroke-width="1.5" viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round" class="h-6 w-6" height="1em" width="1em" xmlns="http://www.w3.org/2000/svg">
<line x1="3" y1="12" x2="21" y2="12"/>
<line x1="3" y1="6" x2="21" y2="6"/>
<line x1="3" y1="18" x2="21" y2="18"/>
</svg>
</button>
<h1 class="flex-1 text-center text-base font-normal">New chat</h1>
<button type="button" class="px-3">
<svg stroke="currentColor" fill="none" stroke-width="1.5" viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round" class="h-6 w-6" height="1em" width="1em" xmlns="http://www.w3.org/2000/svg">
<line x1="12" y1="5" x2="12" y2="19"/>
<line x1="5" y1="12" x2="19" y2="12"/>
</svg>
</button>
</div>
<main class="relative h-full w-full transition-width flex flex-col overflow-hidden items-stretch flex-1">
<div class="flex-1 overflow-hidden">
<div class="react-scroll-to-bottom--css-ngzlr-79elbk h-full dark:bg-gray-800">
<div class="react-scroll-to-bottom--css-ngzlr-1n7m0yu">
<div class="flex flex-col items-center text-sm dark:bg-gray-800">
<div class="w-full h-32 md:h-48 flex-shrink-0"/>
</div>
</div>
</div>
</div>
<div class="absolute bottom-0 left-0 w-full border-t md:border-t-0 dark:border-white/20 md:border-transparent md:dark:border-transparent md:bg-vert-light-gradient bg-white dark:bg-gray-800 md:!bg-transparent dark:md:bg-vert-dark-gradient pt-2">
<form class="stretch mx-2 flex flex-row gap-3 last:mb-2 md:mx-4 md:last:mb-6 lg:mx-auto lg:max-w-3xl">
<div class="relative flex h-full flex-1 md:flex-col">
<div class="flex flex-col w-full py-2 flex-grow md:py-3 md:pl-4 relative border border-black/10 bg-white dark:border-gray-900/50 dark:text-white dark:bg-gray-700 rounded-md shadow-[0_0_10px_rgba(0,0,0,0.10)] dark:shadow-[0_0_15px_rgba(0,0,0,0.10)]">
<textarea tabindex="0" data-id="root" rows="1" class="m-0 w-full resize-none border-0 bg-transparent p-0 pr-7 focus:ring-0 focus-visible:ring-0 dark:bg-transparent pl-2 md:pl-0" style="max-height: 200px; height: 24px; overflow-y: hidden;"/>
<button class="absolute p-1 rounded-md text-gray-500 bottom-1.5 md:bottom-2.5 hover:bg-gray-100 dark:hover:text-gray-400 dark:hover:bg-gray-900 disabled:hover:bg-transparent dark:disabled:hover:bg-transparent right-1 md:right-2">
<svg stroke="currentColor" fill="none" stroke-width="2" viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round" class="h-4 w-4 mr-1" height="1em" width="1em" xmlns="http://www.w3.org/2000/svg">
<line x1="22" y1="2" x2="11" y2="13"/>
<polygon points="22 2 15 22 11 13 2 9 22 2"/>
</svg>
</button>
</div>
<div class="flex ml-1 md:w-full md:m-auto md:mb-2 gap-0 md:gap-2 justify-center"/>
</div>
</form>
<div class="px-3 pt-2 pb-3 text-center text-xs text-black/50 dark:text-white/50 md:px-4 md:pt-3 md:pb-6">
<a href="https://help.openai.com/en/articles/6825453-chatgpt-release-notes" target="_blank" rel="noreferrer" class="underline">ChatGPT Mar 14 Version</a>. Free Research Preview. Our goal is to make AI systems more natural and safe to interact with. Your feedback will help us improve.</div>
</div>
</main>
</div>
</div>
<div class="absolute top-0 left-0 right-0 z-[2]"/>
</div>
<next-route-announcer>
<p aria-live="assertive" id="__next-route-announcer__" role="alert" style="border: 0px; clip: rect(0px, 0px, 0px, 0px); height: 1px; margin: -1px; overflow: hidden; padding: 0px; position: absolute; width: 1px; white-space: nowrap; overflow-wrap: normal;"/>
</next-route-announcer>
<div portal-container="">
<span class="pointer-events-none fixed inset-0 z-[60] mx-auto my-2 flex max-w-[560px] flex-col items-stretch justify-start md:pb-5"/>
</div>
<div id="headlessui-portal-root">
<div data-headlessui-portal="">
<button type="button" aria-hidden="true" style="position: fixed; top: 1px; left: 1px; width: 1px; height: 0px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0px, 0px, 0px, 0px); white-space: nowrap; border-width: 0px;"/>
<div>
<div class="relative z-50" id="headlessui-dialog-:r1:" role="dialog" aria-modal="true" data-headlessui-state="open">
<div class="fixed inset-0 bg-gray-500/90 transition-opacity dark:bg-gray-800/90 ease-out duration-75 opacity-100"/>
<div class="fixed inset-0 z-50 overflow-y-auto">
<div class="flex min-h-full items-end justify-center p-4 text-center sm:items-center sm:p-0">
<div class="relative transform overflow-hidden rounded-lg bg-white text-left shadow-xl transition-all dark:bg-gray-900 sm:my-8 sm:w-full sm:max-w-lg px-4 pt-5 pb-4 sm:p-6 ease-out duration-300 opacity-100 translate-y-0 sm:scale-100" id="headlessui-dialog-panel-:r2:" data-headlessui-state="open">
<div class="flex items-center justify-between">
<div class="flex items-center">
<div class="text-center sm:text-left"/>
</div>
<div/>
</div>
<div class="prose dark:prose-invert">
<div class="mb-5">
<h2 class="!mt-4 font-normal !mb-2">
<b>ChatGPT</b>
</h2>
</div>
<div class="w-full h-[1px] bg-gray-300 opacity-20"/>
<h4 class="mb-4">This is a free research preview.</h4>
<div class="flex gap-4 flex-col text-sm">
<div class="flex p-4 bg-gray-50 dark:bg-white/5 rounded-md items-center gap-4 min-h-[71px]">
<div class="w-10 text-2xl text-center">🔬</div>
<div class="flex-1 leading-5">Our goal is to get external feedback in order to improve our systems and make them safer.</div>
</div>
<div class="flex p-4 bg-gray-50 dark:bg-white/5 rounded-md items-center gap-4 min-h-[71px]">
<div class="w-10 text-2xl text-center">🚨</div>
<div class="flex-1 leading-5">While we have safeguards in place, the system may occasionally generate incorrect or misleading information and produce offensive or biased content. It is not intended to give advice.</div>
</div>
</div>
<div class="flex gap-4 mt-6">
<button class="btn relative btn-neutral ml-auto" tabindex="0">
<div class="flex w-full items-center justify-center gap-2">Next</div>
</button>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<button type="button" aria-hidden="true" style="position: fixed; top: 1px; left: 1px; width: 1px; height: 0px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0px, 0px, 0px, 0px); white-space: nowrap; border-width: 0px;"/>
</div>
</div>
</body>
知道如何解决这个问题吗?
起点可以是了解 https://chat.openai.com/chat 与其他网站相比的结构或行为有何特别之处。