如何允许使用< webview>弹出窗口和重定向在谷歌C​​hrome应用程序? [英] How to allow popup windows and redirects using <webview> in Google Chrome Apps?

查看:557
本文介绍了如何允许使用< webview>弹出窗口和重定向在谷歌C​​hrome应用程序?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有一个使用< webview> 组件的谷歌浏览器应用程序。



在访客的URL处,使用OAuth客户端管理的弹出式窗口和重定向来处理用户身份验证,以响应登录按钮 onclick < webview> / code>事件。



我的问题是,当我点击我的登录按钮时,没有任何反应。即没有弹出。没有重定向。没有登录。



我如何解决这个问题以允许我的OAuth实现所需的弹出窗口和重定向?



window.html

 <!DOCTYPE html> 
< html>
< head>
...
< / head>
< body>
< webview id =webviewsrc =https://mywebapp.com>< / webview>
< / body>
< / html>



background.js

  chrome .app.runtime.onLaunched.addListener(function(){
runApp();
});

function runApp(){
chrome.app.window.create('window.html',{
state:'fullscreen'
});
}

var webview = null;
函数isSafeUrl(url){
//这是现在的Hello World测试;权限代码将在稍后转到此处
返回true;
}

函数onPermissionRequest(e){
e.request.allow();
//这是现在的Hello world测试;权限代码将在稍后发布
}

函数onDomReady(){
webview = document.getElementById('webview');
webview.addEventListener('permissionrequest',onPermissionRequest);
}

document.addEventListener('DOMContentLoaded',onDomReady);


解决方案

您的脚本需要分成两部分。 / p>

后台脚本运行在与 window.html 不同的文档中,并通过创建一个新的< webview> ,可能在另一个窗口中。这不是很容易,但如果你寻找它们,可能已经有了实现。



要实际进行身份验证,您需要确保两个webviews 共享分区



..你可以看到,它比iframe复杂得多。






然而!我相信你会走完一条不正确的道路。如果您的任务是获取OAuth令牌,则应考虑 chrome.identity API ,特别是 launchWebAuthFlow


I have a Google Chrome App that uses a <webview> component.

Inside the <webview>, at the URL of the guest, user authentication is handled using a popup and redirect managed by OAuth client in response to a login button onclick event.

My problem is that when I click my login button, nothing happens. i.e., No popup. No redirect. No login.

How do I fix this to allow the popup and redirect needed by my OAuth implementation?

window.html

<!DOCTYPE html>
<html>
    <head>
        ...
    </head>
    <body>
        <webview id="webview" src="https://mywebapp.com"></webview>
    </body>
</html>

background.js

chrome.app.runtime.onLaunched.addListener(function() {
    runApp();
});

function runApp() {
    chrome.app.window.create('window.html', {
        state: 'fullscreen'
    });
}

var webview = null;
function isSafeUrl(url) {
    // This is Hello world test for now; permissions code will go here later
    return true;
}

function onPermissionRequest(e) {
    e.request.allow();
    // This is Hello world test for now; permissions code will go here later
}

function onDomReady() {
    webview = document.getElementById('webview');
    webview.addEventListener('permissionrequest', onPermissionRequest);
}

document.addEventListener('DOMContentLoaded', onDomReady);

解决方案

Your script needs to be split into two parts.

The background script runs in a different document than window.html, the Event page. Your app should look like this:

// This should be split off to app.js
var webview = null;
function isSafeUrl(url) {
    // This is Hello world test for now; permissions code will go here later
    return true;
}

function onPermissionRequest(e) {
    e.request.allow();
    // This is Hello world test for now; permissions code will go here later
}

function onDomReady() {
    webview = document.getElementById('webview');
    webview.addEventListener('permissionrequest', onPermissionRequest);
}

document.addEventListener('DOMContentLoaded', onDomReady);

Then include a <script> tag for the new script to window.html.


Since there is no such concept as "webview window" in a Chrome App, it's going to be more complicated than allowing everything.

You need to catch the newwindow event and process it by creating a new <webview>, possibly in another window. It's not very easy, but there may be implementations already if you look for them.

For the authentication to actually proceed, you need to make sure that the two webviews share a partition.

..as you can see, it's quite a bit more complicated than iframes.


However! I do believe you're going down an incorrect path altogether. If your task is to get an OAuth token, you should consider chrome.identity API, specifically launchWebAuthFlow.

这篇关于如何允许使用&lt; webview&gt;弹出窗口和重定向在谷歌C​​hrome应用程序?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆